bunteshaus.de/themes/buha/assets/scss/font.scss
2022-06-12 19:32:33 +02:00

53 lines
1.1 KiB
SCSS

@font-face {
font-family: 'Nanum'; /*a name to be used later*/
src: url('/fonts/NanumGothic-Regular.ttf'); /*URL to font*/
}
* {
font-family: 'Nanum';
}
// Breakpoints
$bp-small: 48em; // 768px
$bp-medium: 64em; // 1024px
$bp-large: 85.375em; // 1366px
$bp-xlarge: 120em; // 1920px
$bp-xxlarge: 160em; // 2560px
// Media Queries
$mq-small: "(min-width: #{$bp-small})";
$mq-medium: "(min-width: #{$bp-medium})";
$mq-large: "(min-width: #{$bp-large})";
$mq-xlarge: "(min-width: #{$bp-xlarge})";
$mq-xxlarge: "(min-width: #{$bp-xxlarge})";
$mq-retina: "(-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi)";
// Font-Size
$base-font-size: 1em;
// Line-Height
$base-line-height: 1.5;
$header-line-height: 1.25;
body {
font-size: $base-font-size;
line-height: $base-line-height;
@media #{$mq-medium} {
font-size: $base-font-size*1.2;
line-height: $base-line-height*1.2;
}
@media #{$mq-large} {
font-size: $base-font-size*1.3;
}
@media #{$mq-xlarge} {
font-size: $base-font-size*1.4;
}
@media #{$mq-xxlarge} {
font-size: $base-font-size*1.6;
}
}