Browse Source

Improve landing page CSS and text contrast

closed-social-glitch-2
Ondřej Hruška 7 years ago
parent
commit
8925731c98
1 changed files with 43 additions and 35 deletions
  1. +43
    -35
      app/javascript/styles/about.scss

+ 43
- 35
app/javascript/styles/about.scss View File

@ -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 {

Loading…
Cancel
Save