Add responsive styles and improve FAQ script handling

Introduced mobile and medium responsiveness in stylesheets for better layout on smaller screens. Adjusted FAQ script to properly remove duplicate event listeners and ensure functionality remains smooth on initialization.
This commit is contained in:
tfw
2025-05-08 16:04:42 +02:00
parent d36051a03d
commit 1717057e56
30 changed files with 510 additions and 261 deletions
+62 -3
View File
@@ -1,4 +1,5 @@
document.addEventListener('DOMContentLoaded', function() {
// Funktion zur Initialisierung der FAQ-Funktionalität
function initFAQ() {
// Finde alle FAQ-Fragen
const faqQuestions = document.querySelectorAll('.custom-faq-question');
@@ -9,8 +10,18 @@ document.addEventListener('DOMContentLoaded', function() {
console.log('Benutzerdefinierte FAQ-Elemente gefunden:', faqQuestions.length);
// Füge Event-Listener zu jeder Frage hinzu
// Entferne zuerst alle bestehenden Event-Listener, um Duplikate zu vermeiden
faqQuestions.forEach(question => {
// Klonen des Elements, um alle Event-Listener zu entfernen
const newQuestion = question.cloneNode(true);
question.parentNode.replaceChild(newQuestion, question);
});
// Hole die aktualisierten Elemente nach dem Klonen
const updatedFaqQuestions = document.querySelectorAll('.custom-faq-question');
// Füge Event-Listener zu jeder Frage hinzu
updatedFaqQuestions.forEach(question => {
question.addEventListener('click', function() {
// Toggle active class auf der Frage
this.classList.toggle('active');
@@ -21,7 +32,7 @@ document.addEventListener('DOMContentLoaded', function() {
// Wenn diese Frage geöffnet wurde, schließe alle anderen
if (this.classList.contains('active')) {
faqQuestions.forEach(otherQuestion => {
updatedFaqQuestions.forEach(otherQuestion => {
if (otherQuestion !== this && otherQuestion.classList.contains('active')) {
otherQuestion.classList.remove('active');
otherQuestion.nextElementSibling.classList.remove('active');
@@ -32,4 +43,52 @@ document.addEventListener('DOMContentLoaded', function() {
});
console.log('Benutzerdefinierte FAQ-Funktionalität initialisiert');
}
// Führe die Initialisierung beim ersten Laden der Seite aus
document.addEventListener('DOMContentLoaded', initFAQ);
// Führe die Initialisierung aus, wenn der Inhalt der Seite durch MkDocs aktualisiert wird
document.addEventListener('DOMContentSwap', initFAQ);
// Führe die Initialisierung aus, wenn die Seite über den Material for MkDocs-Router aktualisiert wird
document.addEventListener('mdContentChanged', initFAQ);
// Führe die Initialisierung aus, wenn der Inhalt der Seite durch andere Frameworks aktualisiert wird
// MutationObserver, um Änderungen im DOM zu überwachen
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
if (mutation.addedNodes && mutation.addedNodes.length > 0) {
// Prüfe, ob FAQ-Elemente hinzugefügt wurden
for (let i = 0; i < mutation.addedNodes.length; i++) {
const node = mutation.addedNodes[i];
if (node.nodeType === 1 && (node.classList?.contains('custom-faq-item') ||
node.querySelector?.('.custom-faq-item'))) {
// FAQ-Elemente gefunden, initialisiere die Funktionalität
setTimeout(initFAQ, 100); // Kurze Verzögerung, um sicherzustellen, dass alles geladen ist
break;
}
}
}
});
});
// Starte die Beobachtung des Dokuments
observer.observe(document.body, {
childList: true,
subtree: true
});
// Zusätzlicher Event-Listener für dynamisch geladene Inhalte
window.addEventListener('load', function() {
// Verzögerte Initialisierung, um sicherzustellen, dass alle Inhalte geladen sind
setTimeout(initFAQ, 500);
});
// Für Material for MkDocs spezifische Ereignisse
if (typeof document$.subscribe === 'function') {
document$.subscribe(function() {
// Verzögerte Initialisierung, um sicherzustellen, dass alle Inhalte geladen sind
setTimeout(initFAQ, 100);
});
}
-27
View File
@@ -16,34 +16,7 @@ hide:
</div>
</div>
<div class="custom-faq-item">
<div class="custom-faq-question">Fragen zur Datensicherheit und Privatsphäre</div>
<div class="custom-faq-answer">
<p>Wir bieten verschiedene spezialisierte KI-Agenten an, darunter Jane Alesi, Amira Alesi, Bastian Alesi, Bea Alesi, Justus Alesi, Lara Alesi, Luna Alesi, Marco Alesi, Olu Alesi und Theo Alesi. Jeder Agent ist auf bestimmte Aufgabenbereiche spezialisiert.</p>
</div>
</div>
<div class="custom-faq-item">
<div class="custom-faq-question">Fragen zu Funktionen und Anpassungsmöglichkeiten</div>
<div class="custom-faq-answer">
<p>Die Integration von satware® AI in Ihr Unternehmen erfolgt in mehreren Schritten. Zunächst analysieren wir Ihre bestehenden Prozesse, identifizieren Optimierungspotenziale und entwickeln dann eine maßgeschneiderte Lösung. Unsere Experten begleiten Sie während des gesamten Implementierungsprozesses.</p>
</div>
</div>
<div class="custom-faq-item">
<div class="custom-faq-question">Fragen zu Preisgestaltung und Support</div>
<div class="custom-faq-answer">
<p>satware® AI bietet zahlreiche Vorteile, darunter:</p>
<ul>
<li>Höhere Effizienz durch Automatisierung wiederkehrender Aufgaben</li>
<li>Verbesserte Datenanalyse und Entscheidungsfindung</li>
<li>Maßgeschneiderte Lösungen für Ihre spezifischen Anforderungen</li>
<li>Skalierbarkeit und Anpassungsfähigkeit an wachsende Unternehmen</li>
<li>Reduzierung von Fehlern und Verbesserung der Qualität</li>
<li>Kosteneinsparungen durch optimierte Prozesse</li>
</ul>
</div>
</div>
<h2>Fragen zur Datensicherheit und Privatsphäre</h2>
+1
View File
@@ -26,6 +26,7 @@
<!-- End Matomo Code -->
{% endblock %}
{% block footer %}
File diff suppressed because one or more lines are too long
+16 -3
View File
@@ -17,6 +17,11 @@
@import 'modules/testimonials';
@import "modules/faq";
//Responsive Design
@import "responsive/medium";
@import "responsive/mobile";
@mixin transition {
transition: all 0.5s ease;
}
@@ -32,6 +37,7 @@
src: url('../assets/fonts/assistant-v19-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
url('../assets/fonts/assistant-v19-latin-300.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* assistant-regular - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
@@ -41,6 +47,7 @@
src: url('../assets/fonts/assistant-v19-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
url('../assets/fonts/assistant-v19-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* assistant-700 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
@@ -56,6 +63,7 @@ html{
font-size: 100% !important;
}
// Schriftart auf "Assistant" setzen
:root {
--md-text-font: "Assistant";
@@ -88,6 +96,7 @@ html{
background: var(--md-primary-fg-color);;
color: #fff;
}
::selection {
background: var(--md-primary-fg-color);;
color: #fff;
@@ -109,11 +118,11 @@ html{
}
body {
font-weight: 300;
font-size: 1.3rem;
line-height: 2rem;
.md-typeset,
.md-nav {
font-size: 1.3rem;
@@ -123,6 +132,7 @@ body{
h1, h2, h3, h4, h5, h6 {
color: #fff;
a {
color: #fff !important;
}
@@ -145,6 +155,7 @@ h1,h2,h3{
.md-typeset ul {
list-style-type: none;
padding: 0 0 0 2rem;
li {
&:before {
@@ -184,6 +195,7 @@ h1{
h2 {
line-height: 3rem;
font-size: 2.7rem;
&:after {
margin-top: .6rem;
height: 7px;
@@ -278,7 +290,6 @@ h3{
}
.md-search-result__meta {
background-color: #000;
}
@@ -375,12 +386,12 @@ a.headerlink{
.md-footer-meta.md-typeset a {
color: #fff !important;
}
.md-footer-meta {
background-color: #000;
}
// Füge zusätzliche Navigation im Footer hinzu
.md-footer-custom-links {
display: flex;
@@ -441,10 +452,12 @@ a.headerlink{
top: 4vh !important;
font-size: 100%;
padding: 0.8rem 1rem;
svg {
vertical-align: -.15rem;
}
}
// Buttons im CI-Design
.md-button {
+3
View File
@@ -21,11 +21,14 @@ body{
}
/* Für den Fall, dass du die Seitenleiste verwendest */
@media (min-width: 768px){
.md-sidebar {
top: 0 !important;
height: auto !important;
}
}
label.md-search__icon.md-icon {
+37 -16
View File
@@ -19,14 +19,9 @@
padding-top: 1.6rem;
}
//@include ohne-balken;
h1{
//font-size: 6rem;
margin-bottom: 1.75rem;
text-align: left;
//line-height: 114%;
&:after{
height: 12px;
width: 85px;
@@ -41,10 +36,7 @@
margin-bottom: 0;
}
//text-align: center;
.screenshot-container{
text-align: center;
}
@@ -52,7 +44,6 @@
border: 1px solid var(--md-primary-fg-color--light);
width: 100%;
}
}
.satag--home-companies{
@@ -73,21 +64,34 @@
margin: 0 auto;
}
//@include ohne-balken;
text-align: center;
.satag--home-companies-logo-container{
display: flex;
max-width: 61rem;
margin: 0 auto;
flex-wrap: wrap; // Erlaubt Umbruch bei kleinen Bildschirmen
.satag--home-companies-logo{
flex: auto;
flex: 0 0 25%;
img{
width: 80%;
float:left;
}
}
// Responsive Anpassung für die Logos
@media screen and (max-width: 768px) {
.satag--home-companies-logo {
flex: 0 0 50%; // 2 Logos pro Zeile
margin-bottom: 1rem;
}
}
@media screen and (max-width: 480px) {
.satag--home-companies-logo {
flex: 0 0 100%; // 1 Logo pro Zeile
}
}
}
}
@@ -95,7 +99,6 @@
width: 100%;
h2{
padding-bottom: 1rem;
}
@@ -105,9 +108,13 @@
text-align: center;
.satag--home-counters-container{
display: flex;
flex-wrap: wrap; // Erlaubt Umbruch bei kleinen Bildschirmen
.satag--home-counter{
flex: auto;
flex: 1 0 auto;
display: block;
padding: 1rem;
.satag--home-counter-icon{
display: block;
font-size: 2rem;
@@ -120,9 +127,21 @@
line-height: 1.6;
}
}
// Responsive Breakpoints für die Counter
@media screen and (max-width: 768px) {
.satag--home-counter {
flex: 0 0 50%; // 2 Counter pro Zeile
}
}
@media screen and (max-width: 480px) {
.satag--home-counter {
flex: 0 0 100%; // 1 Counter pro Zeile
}
}
}
}
}
body{
@@ -135,12 +154,14 @@ body{
background-size: 60%;
background-position-y: 2rem;
.md-header, .md-tabs {
background-color: transparent;
box-shadow: none;
}
// Responsive Anpassung für den Hintergrund
@media screen and (max-width: 768px) {
background-size: 100%;
}
}
}
+86 -18
View File
@@ -1,8 +1,8 @@
// Testimonials Section
.satag--home-testimonials-container {
max-width: 1200px;
margin: 0 auto;
padding: 0 1rem;
h2 {
text-align: left;
@@ -31,6 +31,10 @@
@media (min-width: 768px) {
flex: 0 0 60%;
}
@media (max-width: 767px) {
min-height: 400px; // Mehr Platz für den Text auf mobilen Geräten
}
}
.satag--home-testimonials-text {
@@ -48,38 +52,61 @@
}
blockquote {
font-style: normal;
margin-bottom: 1.5rem;
color: #fff;
border-left: none !important;
//border-left: 4px solid var(--md-primary-fg-color, #9c27b0);
padding-left: 0 !important;
//font-size: 1.2rem;
//line-height: 2rem;
//padding-bottom: 1.6rem;
//padding-top: 1.6rem;
@media (max-width: 767px) {
font-size: 1rem; // Etwas kleinere Schrift auf mobilen Geräten
line-height: 1.5;
margin-top: 70px; // Platz für das Logo über dem Text
}
}
}
.satag--home-testimonial-author {
margin-top: 1rem;
@media (max-width: 767px) {
margin-top: 1.5rem; // Mehr Abstand nach oben auf mobilen Geräten
margin-bottom: 2rem; // Mehr Abstand nach unten auf mobilen Geräten
}
}
.satag--home-testimonial-text-logo {
max-width: 120px !important;
filter: grayscale(1);
@media (max-width: 767px) {
display: none;
position: absolute;
top: 0;
left: 0;
max-width: 80px !important; // Kleineres Logo
margin-bottom: 1rem;
}
}
.satag--home-testimonial-name {
font-weight: bold;
margin-bottom: 0.25rem;
@media (max-width: 767px) {
font-size: 1.2rem; // Größerer Name auf mobilen Geräten
margin-bottom: 0.1rem;
}
}
.satag--home-testimonial-title {
font-size: 0.9rem;
color: #666;
@media (max-width: 767px) {
font-size: 1rem; // Etwas größerer Titel auf mobilen Geräten
margin-top: 0; // Kein negativer Abstand mehr
}
}
// Bilder-Container (rechts)
@@ -92,6 +119,22 @@
flex: 0 0 40%;
justify-content: flex-end;
}
@media (max-width: 767px) {
flex-wrap: nowrap; // Keine Umbrüche, damit die Bilder horizontal scrollbar sind
overflow-x: auto; // Horizontales Scrollen ermöglichen
-webkit-overflow-scrolling: touch; // Für besseres Scrolling auf iOS
scrollbar-width: none; // Firefox: Scrollbar ausblenden
-ms-overflow-style: none; // IE/Edge: Scrollbar ausblenden
padding-bottom: 1rem; // Platz für die Scrollbar
margin-top: 1rem; // Weniger Abstand nach oben
justify-content: flex-start; // Links ausrichten
// Webkit: Scrollbar ausblenden
&::-webkit-scrollbar {
display: none;
}
}
}
.satag--home-testimonial-image-wrapper {
@@ -103,21 +146,19 @@
opacity: 0.6;
transition: all 0.3s ease;
border: 1px solid transparent;
border-radius: 0; // Leicht abgerundete Ecken statt Kreis
border-radius: 0;
border-color: var(--md-primary-fg-color--dark);
img {
filter: grayscale(1);
//@include transition;
}
&.active {
opacity: 1;
border-color: var(--md-primary-fg-color, #9c27b0);
transform: scale(1.05);
img {
filter: grayscale(0);
//@include transition;
}
}
@@ -126,8 +167,14 @@
}
@media (max-width: 767px) {
width: 100px;
height: 150px;
width: 120px; // Etwas größer als zuvor
height: 180px; // Etwas größer als zuvor
flex: 0 0 auto; // Verhindert Schrumpfen
margin-right: 0.5rem; // Abstand zwischen den Bildern
&:last-child {
margin-right: 1rem; // Extra Platz am Ende für besseres Scrollen
}
}
}
@@ -156,15 +203,36 @@
img {
max-width: 60px;
}
@media (max-width: 767px) {
bottom: 15px; // Näher am unteren Rand
width: 30px; // Etwas kleiner
height: 30px; // Etwas kleiner
background: rgba(0, 0, 0, 0.5); // Halbdurchsichtiger Hintergrund für bessere Sichtbarkeit
img {
max-width: 40px;
}
}
}
// Responsive Anpassungen
@media (max-width: 767px) {
.satag--home-testimonials-text-container {
min-height: 300px;
// Verbessertes Layout für mobile Geräte
.satag--home-testimonials-container {
h2 {
margin-bottom: 1.5rem;
font-size: 1.5rem;
}
}
.satag--home-testimonials-images {
flex-wrap: wrap;
// Entfernung der Scrollklasse für die Bilder
.satag--home-testimonials-images.scroll {
scrollbar-width: none;
-ms-overflow-style: none;
&::-webkit-scrollbar {
display: none;
}
}
}
+70
View File
@@ -0,0 +1,70 @@
@media (max-width: 1219px) {
body{
.md-grid {
padding: 2rem;
}
.md-grid .md-content,
.md-footer-container,
.md-footer-custom-links{
padding: 4rem;
}
.md-typeset h1,
h1 {
font-size: 3rem;
}
.md-typeset h2,
h2 {
font-size: 2rem;
}
}
}
@media (max-width: 959px) {
label.md-header__button.md-icon:last-of-type{
svg{
display: none;
}
&:after {
content: "\f002";
font-family: 'Font Awesome 6 Pro';
font-weight: 100;
font-size: 1rem;
}
}
body{
.satag--padding-container{
padding: 4rem 2rem;
}
.satag--home-companies{
padding: 4rem 3rem;
.satag--home-companies-logo-container{
.satag--home-companies-logo{
img {
float: none !important;
}
}
}
}
.md-button{
padding: 1em 2.3em !important;
margin-bottom: 1em;
}
}
}
+24
View File
@@ -0,0 +1,24 @@
@media (max-width: 479px) {
body{
.md-grid {
padding: 2rem;
}
.md-grid .md-content,
.md-footer-container,
.md-footer-custom-links{
padding: 1rem;
}
.md-typeset h1,
h1 {
font-size: 3rem;
}
.md-typeset h2,
h2 {
font-size: 2rem;
}
}
}
+3
View File
@@ -16,6 +16,7 @@ copyright: Copyright &copy; 2025 satware AG
# Konfiguration
theme:
name: material
font: false
custom_dir: docs/overrides
language: de
@@ -47,6 +48,8 @@ theme:
- search.suggest
- toc.follow
#font:
# text: Roboto
#code: Roboto Mono
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+1
View File
@@ -26,6 +26,7 @@
<!-- End Matomo Code -->
{% endblock %}
{% block footer %}
File diff suppressed because one or more lines are too long
+25 -25
View File
@@ -2,102 +2,102 @@
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>https://satware.ai/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/faq/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/webinare/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/zugang/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/blog/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/blog/ki-innovationen-im-februar-2025-ein-umfassender-%C3%BCberblick/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/blog/roboterliebe-20-mein-herzensprojekt-zur-globalen-ki-musikrevolution/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/blog/satware-ai-der-launch-unserer-bahnbrechenden-ki-plattform/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/ki-agenten/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/ki-agenten/amira/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/ki-agenten/bastian/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/ki-agenten/bea/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/ki-agenten/jane/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/ki-agenten/justus/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/ki-agenten/lara/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/ki-agenten/luna/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/ki-agenten/marco/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/ki-agenten/olu/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/ki-agenten/theo/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/blog/archive/2025/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/blog/category/projekte/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/blog/category/ki/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/blog/category/musik/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/blog/category/technologie/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
<url>
<loc>https://satware.ai/blog/category/innovation/</loc>
<lastmod>2025-05-07</lastmod>
<lastmod>2025-05-08</lastmod>
</url>
</urlset>
Binary file not shown.
File diff suppressed because one or more lines are too long
+16 -3
View File
@@ -17,6 +17,11 @@
@import 'modules/testimonials';
@import "modules/faq";
//Responsive Design
@import "responsive/medium";
@import "responsive/mobile";
@mixin transition {
transition: all 0.5s ease;
}
@@ -32,6 +37,7 @@
src: url('../assets/fonts/assistant-v19-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
url('../assets/fonts/assistant-v19-latin-300.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* assistant-regular - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
@@ -41,6 +47,7 @@
src: url('../assets/fonts/assistant-v19-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
url('../assets/fonts/assistant-v19-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* assistant-700 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
@@ -56,6 +63,7 @@ html{
font-size: 100% !important;
}
// Schriftart auf "Assistant" setzen
:root {
--md-text-font: "Assistant";
@@ -88,6 +96,7 @@ html{
background: var(--md-primary-fg-color);;
color: #fff;
}
::selection {
background: var(--md-primary-fg-color);;
color: #fff;
@@ -109,11 +118,11 @@ html{
}
body {
font-weight: 300;
font-size: 1.3rem;
line-height: 2rem;
.md-typeset,
.md-nav {
font-size: 1.3rem;
@@ -123,6 +132,7 @@ body{
h1, h2, h3, h4, h5, h6 {
color: #fff;
a {
color: #fff !important;
}
@@ -145,6 +155,7 @@ h1,h2,h3{
.md-typeset ul {
list-style-type: none;
padding: 0 0 0 2rem;
li {
&:before {
@@ -184,6 +195,7 @@ h1{
h2 {
line-height: 3rem;
font-size: 2.7rem;
&:after {
margin-top: .6rem;
height: 7px;
@@ -278,7 +290,6 @@ h3{
}
.md-search-result__meta {
background-color: #000;
}
@@ -375,12 +386,12 @@ a.headerlink{
.md-footer-meta.md-typeset a {
color: #fff !important;
}
.md-footer-meta {
background-color: #000;
}
// Füge zusätzliche Navigation im Footer hinzu
.md-footer-custom-links {
display: flex;
@@ -441,10 +452,12 @@ a.headerlink{
top: 4vh !important;
font-size: 100%;
padding: 0.8rem 1rem;
svg {
vertical-align: -.15rem;
}
}
// Buttons im CI-Design
.md-button {