AMPERION_Webpage/assets/scss/_typography.scss
2025-07-29 19:10:33 +02:00

77 lines
1.3 KiB
SCSS

// Fonts
@font-face {
font-family: 'Open Sans';
src: local('Open Sans'), local('OpenSans'), url('/static/fonts/OpenSans-SemiboldItalic.woff2') format('woff2');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Open Sans Semibold';
src: local('Open Sans Semibold'), local('OpenSansSemibold'), url('/static/fonts/OpenSans-Semibold.woff2') format('woff2');
font-weight: normal;
font-style: normal;
}
// Using Variables for Font Families
$font-primary: 'Open Sans', sans-serif;
$font-secondary: 'Open Sans Semibold', sans-serif;
$color-heading-h2: #046e6e; // Türkis für h2
body {
line-height: 1.5;
font-family: $font-primary;
-webkit-font-smoothing: antialiased;
}
h1,
h3,
h4,
h5,
h6 {
font-family: $font-secondary;
font-weight: 400;
// keine Farbe, Standardfarbe übernehmen
}
h2 {
font-family: $font-secondary;
font-weight: 400;
color: $color-heading-h2; // Nur h2 in Türkis
font-size: $h2;
@include mobile {
font-size: $h2-sm;
}
}
h1 {
font-size: $h1;
@include tablet {
font-size: $h1-md;
}
@include mobile {
font-size: $h2;
}
@include mobile-xs {
font-size: $h2-md;
}
}
h3 {
font-size: $h3;
}
h4 {
font-size: $h4;
}
p {
color: black;
font-size: $font-size;
font-family: $font-secondary;
}