diff options
| -rw-r--r-- | app/javascript/styles/about.scss | 78 | ||||
| -rw-r--r-- | app/views/about/more.html.haml | 5 | ||||
| -rw-r--r-- | app/views/about/show.html.haml | 5 |
3 files changed, 51 insertions, 37 deletions
diff --git a/app/javascript/styles/about.scss b/app/javascript/styles/about.scss index af1d45a09..deab66ff2 100644 --- a/app/javascript/styles/about.scss +++ b/app/javascript/styles/about.scss @@ -272,6 +272,8 @@ } .landing-page { + $lp-par-color: lighten($ui-base-color, 36%); + .header-wrapper { padding-top: 15px; background: $ui-base-color; @@ -284,6 +286,14 @@ .hero .heading { padding-bottom: 30px; + + p, li { + color: lighten($ui-base-color, 50%); + } + + li { + margin: 2px 0; + } } } @@ -307,13 +317,6 @@ } } - p, - li { - font: inherit; - font-weight: inherit; - margin-bottom: 0; - } - .header { line-height: 30px; overflow: hidden; @@ -410,28 +413,24 @@ } } - ul { - list-style: none; - margin: 0; + .links { + position: relative; + z-index: 4; - li { - display: inline-block; - vertical-align: bottom; + ul { + list-style: none; margin: 0; - &:first-child a { - padding-left: 0; - } + li { + display: inline-block; + vertical-align: bottom; + margin: 0; - &:last-child a { - padding-right: 0; + &:last-child a { + padding-right: 0; + } } } - } - - .links { - position: relative; - z-index: 4; a { display: flex; @@ -480,13 +479,11 @@ padding: 0; } - .learn-more-cta { - background: darken($ui-base-color, 4%); - padding: 50px 0; - } - - .extended-description { + .learn-more-cta, .extended-description { padding: 50px 0; + font-weight: 400; + color: $lp-par-color; + font: 16px/1.6 'mastodon-font-sans-serif', sans-serif; ul, ol { @@ -509,16 +506,27 @@ p, li { - font: 16px/28px 'mastodon-font-sans-serif', sans-serif; - font-weight: 400; - margin-bottom: 12px; - color: $ui-base-lighter-color; + color: $lp-par-color; + margin-bottom: 6px; a { color: $ui-highlight-color; text-decoration: underline; } } + + li { + margin: 2px 0; + } + } + + .learn-more-cta { + background: darken($ui-base-color, 4%); + padding: 50px 0; + p { + font-size: 16px; + line-height: 28px; + } } h3 { @@ -532,8 +540,8 @@ p { font-size: 16px; - line-height: 30px; - color: $ui-base-lighter-color; + line-height: 28px; + color: $lp-par-color; } .features { diff --git a/app/views/about/more.html.haml b/app/views/about/more.html.haml index ed491495b..6d621ce8b 100644 --- a/app/views/about/more.html.haml +++ b/app/views/about/more.html.haml @@ -29,7 +29,10 @@ - else = link_to t('auth.login'), new_user_session_path, class: 'webapp-btn' %li= link_to t('about.about_this'), about_more_path - %li= link_to t('about.other_instances'), 'https://joinmastodon.org/' + %li + = link_to 'https://joinmastodon.org/' do + = "#{t('about.other_instances')}" + %i.fa.fa-external-link{ style: 'padding-left: 5px;' } .container.hero .heading diff --git a/app/views/about/show.html.haml b/app/views/about/show.html.haml index b78e181ec..3e04dd038 100644 --- a/app/views/about/show.html.haml +++ b/app/views/about/show.html.haml @@ -33,7 +33,10 @@ - else = link_to t('auth.login'), new_user_session_path, class: 'webapp-btn' %li= link_to t('about.about_this'), about_more_path - %li= link_to t('about.other_instances'), 'https://joinmastodon.org/' + %li + = link_to 'https://joinmastodon.org/' do + = "#{t('about.other_instances')}" + %i.fa.fa-external-link{ style: 'padding-left: 5px;' } .container.hero .floats |