diff --git a/.vuepress/theme/styles/home.css b/.vuepress/theme/styles/home.css index df3966dc..3e80f90b 100644 --- a/.vuepress/theme/styles/home.css +++ b/.vuepress/theme/styles/home.css @@ -1,28 +1,56 @@ .home { + @apply .mx-auto; + max-width: 960px; + .hero { @apply .text-center .mx-auto; - max-width: 960px; + padding-top: 58px; img { - @apply .max-w-xs; + @apply .my-4; + max-height: 20rem; } .action-button { - @apply .inline-block .bg-blue .text-white .p-4 + @apply .inline-block .bg-blue .text-white .px-8 .py-4 .rounded .text-lg .font-normal .border .border-blue-dark; + transition: background-color 100ms ease; + + &:hover { + @apply .no-underline .bg-blue-light .border-blue; + transition: background-color 100ms ease; + } + } + + h1 { + @apply .text-5xl .text-black; + } + + .description { + @apply .text-grey-darkest; + font-size: 1.6rem; } } .features { - @apply .border-t .px-2 .mt-8 .flex .flex-wrap .items-start .content-between; + @apply .border-t .py-5 .mt-10 .flex .flex-wrap .items-start .justify-between; + align-content: stretch; .feature { - @apply flex-grow; + @apply .flex-grow; flex-basis: 30%; max-width: 30%; h2 { - @apply border-b-0 pb-0; + @apply .border-b-0 .pb-0 .py-4 .font-normal; + } + + p { + @apply .text-grey-darker; } } } + + .footer { + @apply .text-center .text-grey .text-sm; + } } diff --git a/README.md b/README.md index 55ccbc9d..90805c9e 100644 --- a/README.md +++ b/README.md @@ -10,5 +10,5 @@ features: details: Built on a modern stack utilizing the best design practices that make it easy to jump in and make modifications. - title: Docker to the Core details: All servers run in isolated Docker containers that limit attack vectors, provide strict resource limits, and provide environments tailored to each specific game. -footer: MIT Licensed | Copyright © 2015 - 2018 Dane Everitt +footer: MIT Licensed | Copyright © 2015 - 2018 Dane Everitt & Contributors ---