responsive /features

This commit is contained in:
Thibault Duplessis 2019-05-01 10:05:47 +07:00
parent 6645d56444
commit 94b63f55de
2 changed files with 59 additions and 36 deletions

View file

@ -158,7 +158,7 @@ object features {
strong("all features are free for everybody, forever!"),
br,
"If you love Lichess, ",
a(cls := "button", href := routes.Plan.index)("support us with a Patron account!")
a(cls := "button", href := routes.Plan.index)("Support us with a Patron account!")
)
)
}

View file

@ -7,41 +7,34 @@
table {
width: 100%;
}
h1 {
margin: 0;
}
h1::before {
h1 {
margin: 0;
&::before {
margin-right: 10px;
}
}
td,
th {
padding: 10px 20px;
border-bottom: $border;
}
td,
th {
padding: 10px 20px;
border-bottom: $border;
}
td { white-space: nowrap }
thead th {
padding-top: 30px;
color: #d59120;
font-weight: bold;
padding-bottom: 20px;
}
thead:first-child th {
padding-top: 10px;
}
thead th {
padding-top: 30px;
color: #d59120;
font-weight: bold;
padding-bottom: 20px;
}
thead:first-child th {
padding-top: 10px;
}
tbody td .is::before {
font-size: 1.4em;
}
tbody th {
opacity: 0.9;
}
tbody td {
whitespace: nowrap;
}
.is::before {
font-size: 1.4em;
}
.price {
@ -53,19 +46,49 @@
}
.explanation {
@extend %box-radius;
margin: 60px 10% 20px 10%;
padding: 30px 40px 40px 40px;
text-shadow: 1px 1px 1px #000;
margin: 3em 10% 1em 10%;
padding: 2em 3em 3em 3em;
background: $c-good;
color: $c-good-over;
font-size: 1.3em;
}
.explanation strong {
display: block;
text-align: center;
strong {
display: block;
}
.button {
margin-top: 1em;
display: block;
}
}
.button {
color: #fff;
text-transform: none;
}
@include breakpoint($mq-not-small) {
.is {
font-size: 0;
&::before {
font-size: 1.3rem;
}
}
h1::before {
display: none;
}
td,
th {
padding: .8em 0 .8em .5em;
}
thead th:first-child {
min-width: 180px;
}
thead th { font-weight: normal }
.price { display: none }
.explanation {
font-size: 1.1em;
margin: 3em 0 1em 0;
padding: 2em 1em 3em 1em;
}
}
}