mirror of
https://github.com/mastermindzh/rickvanlieshout.com
synced 2024-10-23 17:19:30 +02:00
70 lines
1.7 KiB
SCSS
70 lines
1.7 KiB
SCSS
@import "../../assets/scss/variables";
|
|
@import "../../assets/scss/mixins";
|
|
|
|
.sidebar {
|
|
width: 100%;
|
|
&__inner {
|
|
position: relative;
|
|
padding: 25px 20px 0;
|
|
}
|
|
&__author {
|
|
&-photo {
|
|
display: inline-block;
|
|
margin-bottom: 0;
|
|
border-radius: 50%;
|
|
background-clip: padding-box;
|
|
}
|
|
&-title {
|
|
font-size: $typographic-base-font-size * 1.125;
|
|
font-weight: 500;
|
|
@include line-height(1.125);
|
|
@include margin(.5, 0, .5, 0);
|
|
&-link {
|
|
color: $color-base;
|
|
&:hover,
|
|
&:focus {
|
|
color: $color-base;
|
|
}
|
|
}
|
|
}
|
|
&-subtitle {
|
|
color: $color-gray;
|
|
@include line-height(1);
|
|
@include margin-bottom(1);
|
|
}
|
|
}
|
|
&__copyright {
|
|
color: lighten($color-gray, 18%);
|
|
font-size: $typographic-small-font-size;
|
|
}
|
|
}
|
|
|
|
@include breakpoint-sm {
|
|
.sidebar {
|
|
lost-column: 5/12;
|
|
&__inner {
|
|
padding: 30px 20px 0;
|
|
&:after {
|
|
background: $color-gray-border;
|
|
background: linear-gradient(to bottom, $color-gray-border 0%, $color-gray-border 48%, $color-white 100%);
|
|
position: absolute;
|
|
content: "";
|
|
width: 1px;
|
|
height: 540px;
|
|
top: 30px;
|
|
right: -10px;
|
|
bottom: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
@include breakpoint-md {
|
|
.sidebar {
|
|
lost-column: 1/3;
|
|
&__inner {
|
|
padding: 40px;
|
|
}
|
|
}
|
|
}
|