lbry.tech/content/.vuepress/scss/_layout.scss

132 lines
2.1 KiB
SCSS
Raw Normal View History

2018-05-02 00:45:31 +02:00
html,
body {
width: 100%; height: 100%;
}
html {
background-color: $white;
}
body {
@include font-sans;
2018-05-08 22:55:33 +02:00
color: $black;
2018-05-02 00:45:31 +02:00
font-size: 12px;
2018-05-08 22:55:33 +02:00
min-width: 320px;
2018-05-02 00:45:31 +02:00
overflow-x: hidden;
position: relative;
z-index: 0;
}
main {
2018-05-08 21:07:47 +02:00
display: flex;
flex-direction: column;
min-height: 100vh;
padding-top: 4rem;
2018-05-18 07:39:36 +02:00
&:not(.home) {
> div:first-of-type {
flex: 1;
}
}
&.home {
@media (min-width: 1001px) {
> div:first-of-type {
display: grid;
grid-gap: 0;
grid-template-areas:
"header header header"
"features features features"
"intro intro github"
"docs docs github"
"contribute contribute contribute"
"develop develop develop"
"community community community";
}
}
2018-05-08 21:07:47 +02:00
}
2018-05-02 00:45:31 +02:00
}
.inner-wrap {
margin-right: auto;
margin-left: auto;
max-width: 1200px;
@media (min-width: 901px) {
padding-right: 1rem;
padding-left: 1rem;
}
@media (max-width: 900px) {
padding-right: 2rem;
padding-left: 2rem;
}
&::after {
@include clearfix;
}
}
h1, h2, h3, h4, h5 {
.header-anchor {
display: none;
}
}
.alert {
2018-05-25 18:22:24 +02:00
bottom: 0; left: 0;
2018-05-24 18:39:10 +02:00
background-color: $yellow;
line-height: 1.33;
padding-top: 1rem;
padding-right: env(safe-area-inset-right);
padding-bottom: 1rem;
padding-left: env(safe-area-inset-left);
2018-05-25 18:22:24 +02:00
position: fixed;
2018-05-31 23:25:48 +02:00
text-align: left;
2018-05-24 18:39:10 +02:00
width: 100%;
2018-05-25 18:22:24 +02:00
z-index: 1;
2018-05-24 18:39:10 +02:00
> div:first-of-type {
position: relative;
}
@media (min-width: 901px) {
font-size: 1rem;
}
@media (max-width: 900px) {
font-size: 0.8rem;
}
2018-05-24 18:39:10 +02:00
p, button {
display: inline-block;
}
p {
padding-right: 1rem;
width: calc(100% - 2.25rem);
}
a {
font-weight: 600;
2018-05-24 18:39:10 +02:00
text-decoration: underline;
}
button {
width: 1.25rem; height: 1.25rem;
top: 0; right: 0;
background-color: $white;
border-radius: 50%;
display: block;
font-size: 1rem;
line-height: 1;
margin-right: 1rem;
margin-left: 1rem;
padding-left: 1px;
position: absolute;
text-align: center;
}
}