rf-web/_sass/layouts/default.scss

106 lines
1.4 KiB
SCSS
Raw Normal View History

2020-02-21 11:44:13 +00:00
.text-container {
p,
2020-02-26 07:55:02 +00:00
h1,
2020-02-21 11:44:13 +00:00
h2,
h3,
ul {
max-width: $size-512 + $size-128;
background-color: $white;
padding: $size-16 $size-32;
margin: 0;
&:last-of-type:not(ul) {
margin-bottom: $size-32;
}
@include touch {
padding: $size-16;
}
}
h2 {
display: inline-block;
margin-top: $size-64;
margin-bottom: $size-32;
}
2020-02-21 11:44:13 +00:00
ul {
font-size: $size-14;
li {
list-style: inside;
@include padding-horizontal($size-12);
line-height: $size-24;
&:last-of-type {
margin-bottom: 0;
}
}
}
sup a {
text-decoration: none;
2020-02-26 07:55:02 +00:00
// color: $turquoise;
}
a {
2020-02-21 11:44:13 +00:00
color: $true-blue;
2020-02-26 07:55:02 +00:00
&:visited {
color: $turquoise;
}
2020-02-21 11:44:13 +00:00
}
}
h2 {
margin-top: $size-32;
2020-02-21 11:44:13 +00:00
@include touch {
margin-top: 0;
}
}
.page-content {
@include touch {
@include margin-horizontal($size-32);
}
}
2020-02-21 11:44:13 +00:00
.side-title {
position: fixed;
transition: all 0.2s ease-in-out;
2020-02-26 07:55:02 +00:00
color: $text;
2020-02-21 11:44:13 +00:00
margin: 0;
width: 100vh;
bottom: 0;
text-align: center;
&.side-title--left {
transform: rotate(270deg);
left: 5%;
transform-origin: left;
@include touch {
left: 15px;
}
}
&.side-title--right {
transform: rotate(90deg);
right: 5%;
transform-origin: right;
@include touch {
right: 15px;
}
}
&.hidden {
opacity: 0.0001;
}
a {
2020-02-26 07:55:02 +00:00
color: $text;
2020-02-21 11:44:13 +00:00
}
}