Refactor SCSS styles in common and about templates
- Removed unused styles and nested selectors from _common.scss to streamline the code. - Cleaned up the .about section in _about.scss by eliminating redundant styles for headings and paragraphs. - Improved overall readability and maintainability of the SCSS files.
This commit is contained in:
parent
99b78797b2
commit
30fb9c0827
13 changed files with 288 additions and 323 deletions
|
|
@ -246,27 +246,6 @@ input[type="tel"] {
|
|||
.title {
|
||||
padding: 20px 0 30px;
|
||||
|
||||
h2 {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.section-title {
|
||||
margin-bottom: 20px;
|
||||
|
||||
@include tablet {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
margin: 0;
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
font-size: 1.2em; /* Noch kleinere Schriftgröße für sehr kleine Geräte */
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -46,7 +46,7 @@ h2 {
|
|||
font-style: italic;
|
||||
font-weight: 400;
|
||||
line-height: 1.4;
|
||||
margin-bottom: 1rem;
|
||||
margin-bottom: 5rem; // Erhöht den Abstand nach h2
|
||||
color: #222;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -6,8 +6,8 @@
|
|||
}
|
||||
|
||||
.hero-title {
|
||||
font-size: clamp(2.5rem, 4vw, 6rem); // skaliert stark bei kleinen Screens
|
||||
font-weight: 600;
|
||||
font-size: clamp(2.5rem, 4vw, 4rem); // skaliert stark bei kleinen Screens
|
||||
font-weight: 400;
|
||||
line-height: 1.2;
|
||||
color: #046e6e;
|
||||
word-break: normal;
|
||||
|
|
@ -81,16 +81,37 @@ section {
|
|||
|
||||
.gif-background {
|
||||
background-image: url('/images/BackgroundAnimation.svg');
|
||||
background-size: cover;
|
||||
background-position: center 50%;
|
||||
background-repeat: no-repeat;
|
||||
position: relative;
|
||||
|
||||
// Desktop
|
||||
background-size: cover;
|
||||
background-position: center 50%;
|
||||
|
||||
// Tablet
|
||||
@media (max-width: 991px) {
|
||||
background-size: 120% auto;
|
||||
background-position: center 40%;
|
||||
}
|
||||
|
||||
// Mobile
|
||||
@media (max-width: 575px) {
|
||||
background-size: 180% auto;
|
||||
background-position: center 50%;
|
||||
}
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0; left: 0; right: 0; bottom: 0;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: rgba(255, 255, 255, 0.8);
|
||||
|
||||
@media (max-width: 575px) {
|
||||
background-color: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -422,4 +443,6 @@ section {
|
|||
@media (min-width: 992px) {
|
||||
font-size: 1.35rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,24 +1,27 @@
|
|||
// Color Variables
|
||||
$color-primary: #fff;
|
||||
$color-secondary: #0AA8A7;
|
||||
$text-color: #fff;
|
||||
$text-dark: #222;
|
||||
$text-light: #737373;
|
||||
$body-bg: #fff;
|
||||
$border-color: #ECECEC;
|
||||
$black: #000;
|
||||
$white: #fff;
|
||||
$light: #EDF6F5;
|
||||
{{ with site.Params.variables }}
|
||||
$color-primary: {{.color_primary | default "#fff"}};
|
||||
$color-secondary: {{.color_secondary | default "#0AA8A7"}};
|
||||
$text-color: {{.text_color | default "#fff"}};
|
||||
$text-dark: {{.text_dark | default "#222"}};
|
||||
$text-light: {{.text_light | default "#737373"}};
|
||||
$body-bg: {{.body_color | default "#fff"}};
|
||||
$border-color: {{.border_color | default "#ECECEC"}};
|
||||
$black: {{.black | default "#000"}};
|
||||
$white: {{.white | default "#fff"}};
|
||||
$light: {{.light | default "#EDF6F5"}};
|
||||
|
||||
|
||||
// Font Variables
|
||||
$font-size: 16px;
|
||||
$font-scale: 1.25;
|
||||
$font-primary: 'Lato', sans-serif;
|
||||
$font-secondary: 'Lato', sans-serif;
|
||||
$font-tertiary: 'Dosis', sans-serif;
|
||||
$font-quaternary: 'Edu', sans-serif;
|
||||
$font-size: {{.font_size | default "16px"}};
|
||||
$font-scale: {{.font_scale | default "1.25"}};
|
||||
$font-primary: '{{replace (replaceRE ":[ital,]*[ital@]*[wght@]*[0-9,;]+" "" .font_primary | default "Lato") "+" " "}}', {{.font_primary_type | default "sans-serif"}};
|
||||
$font-secondary: '{{replace (replaceRE ":[ital,]*[ital@]*[wght@]*[0-9,;]+" "" .font_secondary | default "Lato") "+" " "}}', {{.font_secondary_type | default "sans-serif"}};
|
||||
$font-tertiary: '{{replace (replaceRE ":[ital,]*[ital@]*[wght@]*[0-9,;]+" "" .font_tertiary | default "Dosis") "+" " "}}', {{.font_tertiary_type | default "sans-serif"}};
|
||||
$font-quaternary: '{{replace (replaceRE ":[ital,]*[ital@]*[wght@]*[0-9,;]+" "" .font_quaternary | default "Edu") "+" " "}}', {{.font_quaternary_type | default "sans-serif"}};
|
||||
|
||||
$font-icon: 'Font Awesome 5 Free';
|
||||
$font-icon: '{{.font_icon | default "Font Awesome 5 Free"}}';
|
||||
{{ end }}
|
||||
|
||||
$h1: 80px;
|
||||
$h1-md: 34px;
|
||||
|
|
|
|||
|
|
@ -20,7 +20,6 @@ h2 {
|
|||
font-style: italic;
|
||||
font-weight: 400;
|
||||
line-height: 1.4;
|
||||
margin-bottom: 1rem;
|
||||
color: #222;
|
||||
}
|
||||
|
||||
|
|
@ -73,9 +72,4 @@ p {
|
|||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.section-title {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -109,10 +109,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
h2, h3 {
|
||||
margin-bottom: 10px; /* Passe den Wert nach Bedarf an */
|
||||
}
|
||||
|
||||
.center-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue