86 lines
1.8 KiB
SCSS
86 lines
1.8 KiB
SCSS
.site-title {
|
|
font-family: $font-serif;
|
|
line-height: 0.7;
|
|
|
|
strong {
|
|
font-size: rem(30px);
|
|
font-weight: 300;
|
|
|
|
&:first-child {
|
|
display: block;
|
|
color: $color-lilas-bright;
|
|
}
|
|
&:last-child {
|
|
display: inline-block;
|
|
margin-left: -6px;
|
|
}
|
|
}
|
|
span {
|
|
position: relative;
|
|
top: -4px;
|
|
font-size: rem(14px);
|
|
color: $color-lightpurple;
|
|
text-transform: uppercase;
|
|
font-weight: 600;
|
|
letter-spacing: 1px;
|
|
}
|
|
|
|
&__pink {
|
|
color: $color-secondary;
|
|
}
|
|
|
|
// Large variant
|
|
&--large {
|
|
display: flex;
|
|
align-items: baseline;
|
|
justify-content: center;
|
|
color: $color-lightpurple;
|
|
margin: 0 auto;
|
|
line-height: 1;
|
|
|
|
strong {
|
|
display: block;
|
|
font-size: rem(96px);
|
|
color: $color-secondary !important;
|
|
}
|
|
span {
|
|
display: block;
|
|
top: 0;
|
|
margin: 0 16px 0 24px;
|
|
font-size: rem(32px);
|
|
}
|
|
}
|
|
|
|
// Inline Variant
|
|
&--inline {
|
|
display: block;
|
|
align-items: baseline;
|
|
color: $color-lightpurple;
|
|
justify-content: center;
|
|
|
|
@include bp (sm) {
|
|
display: flex;
|
|
}
|
|
|
|
strong {
|
|
color: $color-secondary !important;
|
|
font-size: rem(64px);
|
|
|
|
@include bp (sm) {
|
|
font-size: rem(96px);
|
|
}
|
|
}
|
|
|
|
span {
|
|
display: block;
|
|
top: 0;
|
|
margin: 10px 0;
|
|
font-size: rem(20px);
|
|
|
|
@include bp (sm) {
|
|
font-size: rem(32px);
|
|
margin: 0 16px 0 20px;
|
|
}
|
|
}
|
|
}
|
|
} |