mw/agent0_homepage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Enhance accessibility and style adjustments

Browse Source 
Added WCAG-compliant scrolling behavior for search wrapper and updated styles for testimonials and team sections. Integrated alt attributes for images to improve accessibility and made minor layout refinements.
This commit is contained in:
tfw
2025-04-29 08:39:05 +02:00
parent d814f14897
commit a81c5ee28b
8 changed files with 78 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/assets/javascript/testimonials.js
+3
View File
@@ -41,3 +41,6 @@ document.addEventListener('DOMContentLoaded', function() {
});
});
});
docs/assets/javascript/wcag.js
+30
View File
@@ -0,0 +1,30 @@
document.addEventListener('DOMContentLoaded', function() {
const scrollWrap = document.querySelector('.md-search__scrollwrap');
if (scrollWrap) {
scrollWrap.setAttribute('tabindex', '0');
scrollWrap.addEventListener('keydown', function(e) {
// Pfeiltasten für Scrolling
if (e.key === 'ArrowDown') {
e.preventDefault();
this.scrollTop += 30;
} else if (e.key === 'ArrowUp') {
e.preventDefault();
this.scrollTop -= 30;
} else if (e.key === 'PageDown') {
e.preventDefault();
this.scrollTop += this.clientHeight;
} else if (e.key === 'PageUp') {
e.preventDefault();
this.scrollTop -= this.clientHeight;
} else if (e.key === 'Home') {
e.preventDefault();
this.scrollTop = 0;
} else if (e.key === 'End') {
e.preventDefault();
this.scrollTop = this.scrollHeight;
}
});
}
});
docs/index.md
+24 -21
View File
@@ -23,7 +23,7 @@ Technologien sind darauf ausgerichtet, Ihren Geschäftserfolg durch moderne, KI-
<p class="screenshot-container">
<img src="../assets/images/home/satware-ai-chat-screenshot.jpg" />
<img src="../assets/images/home/satware-ai-chat-screenshot.jpg" alt="Screenshot von satware AI chat" />
</p>
@@ -42,31 +42,31 @@ Technologien sind darauf ausgerichtet, Ihren Geschäftserfolg durch moderne, KI-
<div class="satag--home-companies-logo-container">
<div class="satag--home-companies-logo">
<img src="../assets/images/home/company-logos/hammel.png" />
<img src="../assets/images/home/company-logos/hammel.png" alt="Hammel Steuerbüro Logo" />
</div>
<div class="satag--home-companies-logo">
<img src="../assets/images/home/company-logos/ocupro.png" />
<img src="../assets/images/home/company-logos/ocupro.png" alt="Ocu Pro Logo" />
</div>
<div class="satag--home-companies-logo">
<img src="../assets/images/home/company-logos/satware-ag.png" />
<img src="../assets/images/home/company-logos/satware-ag.png" alt="satware AG Logo" />
</div>
<div class="satag--home-companies-logo">
<img src="../assets/images/home/company-logos/klinikum-worms.png" />
<img src="../assets/images/home/company-logos/klinikum-worms.png" alt="Klinikum Worms Logo" />
</div>
</div>
<br />
<div class="satag--home-companies-logo-container">
<div class="satag--home-companies-logo">
<img src="../assets/images/home/company-logos/hammel.png" />
<img src="../assets/images/home/company-logos/hammel.png" alt="Hammel Steuerbüro Logo" />
</div>
<div class="satag--home-companies-logo">
<img src="../assets/images/home/company-logos/ocupro.png" />
<img src="../assets/images/home/company-logos/ocupro.png" alt="Ocu Pro Logo" />
</div>
<div class="satag--home-companies-logo">
<img src="../assets/images/home/company-logos/satware-ag.png" />
<img src="../assets/images/home/company-logos/satware-ag.png" alt="satware AG Logo" />
</div>
<div class="satag--home-companies-logo">
<img src="../assets/images/home/company-logos/klinikum-worms.png" />
<img src="../assets/images/home/company-logos/klinikum-worms.png" alt="Klinikum Worms Logo" />
</div>
</div>
@@ -115,18 +115,20 @@ Technologien sind darauf ausgerichtet, Ihren Geschäftserfolg durch moderne, KI-
<div class="satag--home-testimonials-text-container">
<!-- Testimonial-Texte mit IDs zur Identifizierung -->
<div class="satag--home-testimonials-text active" data-testimonial-id="1">
<img class="satag--home-testimonial-text-logo" src="../../assets/images/home/testimonials/satware-ag.png" alt="Traffic Builders Logo">
<img class="satag--home-testimonial-text-logo" src="../../assets/images/home/testimonials/silentwaves_logo.png" alt="Silent Waves Logo">
<blockquote>
"We try to incorporate supporting our consultants with their specific tasks into TypingMind Custom by creating custom plugins to help with some of our more time-consuming tasks so TypingMind becomes more of a one-stop-shop for us."
"Die KI-Agenten der satware sind für mich wertvoller Sparringspartner für Konzeptentwicklung & Reflektion.
Vor allem bieten sie mir einen sicheren Raum für sensible Daten.
Für mich als Coach & Mediator ist Vertraulichkeit der Schlüssel. Top!"
</blockquote>
<div class="satag--home-testimonial-author">
<span class="satag--home-testimonial-name">Amber Swier</span><br />
<span class="satag--home-testimonial-title">Copywriter/Content Marketer at Traffic Builders</span>
<span class="satag--home-testimonial-name">Jens Emrich von Kajdacsy</span><br />
<span class="satag--home-testimonial-title">Silent Waves</span>
</div>
</div>
<div class="satag--home-testimonials-text" data-testimonial-id="2">
<img class="satag--home-testimonial-text-logo" src="../../assets/images/home/testimonials/satware-ag.png" alt="Traffic Builders Logo">
<img class="satag--home-testimonial-text-logo" src="../../assets/images/home/testimonials/satware-ag.png" alt="satware AG Logo">
<blockquote>
"satware AI has transformed how our team collaborates on complex projects. The ability to have specialized AI agents for different tasks has cut our research and documentation time in half."
@@ -138,7 +140,7 @@ Technologien sind darauf ausgerichtet, Ihren Geschäftserfolg durch moderne, KI-
</div>
<div class="satag--home-testimonials-text" data-testimonial-id="3">
<img class="satag--home-testimonial-text-logo" src="../../assets/images/home/testimonials/satware-ag.png" alt="Traffic Builders Logo">
<img class="satag--home-testimonial-text-logo" src="../../assets/images/home/testimonials/satware-ag.png" alt="satware AG Logo">
<blockquote>
"The integration capabilities of satware AI with our existing tools made adoption seamless. Our team productivity has increased by 35% since implementation, and the custom agents continue to learn our specific needs."
@@ -153,27 +155,28 @@ Technologien sind darauf ausgerichtet, Ihren Geschäftserfolg durch moderne, KI-
<div class="satag--home-testimonials-images">
<!-- Bilder mit data-testimonial-id Attribut zur Identifizierung -->
<div class="satag--home-testimonial-image-wrapper active" data-testimonial-id="1">
<img src="../../assets/images/team/jane-alesi.jpg" alt="Person 1" class="satag--home-testimonial-image">
<img src="../../assets/images/home/testimonials/silentwaves.jpg" alt="Jens Emrich von Kajdacsy" class="satag--home-testimonial-image">
<div class="satag--home-testimonial-logo">
<img src="../../assets/images/home/company-logos/satware-ag.png" alt="Traffic Builders Logo">
<img src="../../assets/images/home/testimonials/silentwaves_logo.png" alt="Silent Waves Logo">
</div>
</div>
<div class="satag--home-testimonial-image-wrapper" data-testimonial-id="2">
<img src="../../assets/images/team/eddi-alesi.jpg" alt="Person 2" class="satag--home-testimonial-image">
<img src="../../assets/images/team/eddi-alesi.jpg" alt="Eddi Alesi" class="satag--home-testimonial-image">
<div class="satag--home-testimonial-logo">
<img src="../../assets/images/home/company-logos/satware-ag.png" alt="Company 2 Logo">
<img src="../../assets/images/home/company-logos/satware-ag.png" alt="satware AG Logo">
</div>
</div>
<div class="satag--home-testimonial-image-wrapper" data-testimonial-id="3">
<img src="../../assets/images/team/luna-alesi.jpg" alt="Person 3" class="satag--home-testimonial-image">
<img src="../../assets/images/team/luna-alesi.jpg" alt="Luna Alesi" class="satag--home-testimonial-image">
<div class="satag--home-testimonial-logo">
<img src="../../assets/images/home/company-logos/satware-ag.png" alt="Company 3 Logo">
<img src="../../assets/images/home/company-logos/satware-ag.png" alt="satware AG Logo">
</div>
</div>
</div>
</div>
</div>
<!-- end section testimonials -->
docs/stylesheets/extra.css
+1 -1
View File
File diff suppressed because one or more lines are too long
docs/stylesheets/extra.scss
+8
View File
@@ -69,6 +69,10 @@
--md-typeset-a-color: #9d65cf; // Helleres Violett für Links
}
.md-search__scrollwrap {
tabindex: 0; /* Macht das Element fokussierbar */
}
::-moz-selection {
background: var(--md-primary-fg-color);;
color: #fff;
@@ -141,6 +145,10 @@ h1,h2,h3{
background-color: #000;
}
.md-source-file{
display: none;
}
h1{
&:after{
docs/stylesheets/modules/team.scss
+1 -1
View File
@@ -99,7 +99,7 @@ h1, h2, h3, h4, h5, h6 {
font-size: 0.7rem;
font-weight: 400;
opacity: .9;
color: var(--md-typeset-a-color);
color: #fff;
margin-bottom: 0.1rem;
text-align: left;
text-transform: uppercase;
docs/stylesheets/modules/testimonials.scss
+2 -3
View File
@@ -138,7 +138,7 @@
.satag--home-testimonial-logo {
position: absolute;
bottom: 10px;
bottom: 30px;
left: 50%;
transform: translateX(-50%);
background: transparent;
@@ -152,8 +152,7 @@
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
img {
max-width: 100px;
max-height: 100px;
max-width: 60px;
}
}
mkdocs.yml
+1
View File
@@ -150,6 +150,7 @@ extra_javascript:
- assets/javascript/counter-animation.js
- assets/javascript/body-classes.js
- assets/javascript/testimonials.js
- assets/javascript/wcag.js
# Navigation