knso/preview-auto-rueger-gmbh
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Anreicherung: Bilder, Logo, Text-Feinarbeit (Cloud-Routine)

Browse Source
This commit is contained in:
webklar-automation
2026-07-16 09:17:02 +00:00
parent 002351af73
commit 2a0c054460
2 changed files with 11 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
assets/logo-placeholder.svg
View File

@@ -1,5 +1,5 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 260 48" role="img" aria-label="Logo-Platzhalter"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 64" role="img" aria-label="Auto Rüger GmbH">
<rect x="1" y="1" width="258" height="46" rx="8" fill="none" stroke="#f0f0ec" stroke-opacity="0.35" stroke-width="1.5" stroke-dasharray="6 5"/> <polygon points="8,52 26,12 39,12 21,52" fill="#E30613"/>
<text x="130" y="25" text-anchor="middle" font-family="Archivo, system-ui, sans-serif" font-weight="800" font-size="20" letter-spacing="1" fill="#f0f0ec">IHR&#160;LOGO</text> <polygon points="28,52 46,12 59,12 41,52" fill="#E30613"/>
<text x="130" y="39" text-anchor="middle" font-family="Archivo, system-ui, sans-serif" font-weight="600" font-size="8" letter-spacing="2" fill="#f0f0ec" fill-opacity="0.55">HIER EIGENES LOGO EINSETZEN</text> <text x="70" y="44" font-family="Arial, Helvetica, sans-serif" font-size="34" font-weight="700" letter-spacing="0.3" fill="#F2F2EE">Auto Rüger</text>
</svg> </svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 643 B

After

Width:  |  Height:  |  Size: 384 B

14
index.html
View File

@@ -253,7 +253,7 @@
</div> </div>
<p style="margin-top: clamp(28px, 4vh, 44px); text-align: center; font-size: 15px; color: #c9d6e2; font-weight: 500;">Mehr laufende Projekte gibt es auf unserer <a href="" target="_blank" rel="noopener" style="color: #9FD1F5; font-weight: 700;">Facebook-Seite</a>.</p> <p style="margin-top: clamp(28px, 4vh, 44px); text-align: center; font-size: 15px; color: #c9d6e2; font-weight: 500;">Mehr laufende Projekte gibt es auf unserer <a href="https://www.facebook.com/AutoRuger/" target="_blank" rel="noopener" style="color: #9FD1F5; font-weight: 700;">Facebook-Seite</a>.</p>
</div> </div>
</section> </section>
@@ -276,7 +276,7 @@
<div class="lw-about" style="display: grid; grid-template-columns: 1.1fr 0.9fr; gap: clamp(28px, 4vw, 64px); align-items: center; margin-bottom: clamp(50px, 8vh, 90px);"> <div class="lw-about" style="display: grid; grid-template-columns: 1.1fr 0.9fr; gap: clamp(28px, 4vw, 64px); align-items: center; margin-bottom: clamp(50px, 8vh, 90px);">
<div style="display: flex; flex-direction: column; gap: 16px;"> <div style="display: flex; flex-direction: column; gap: 16px;">
<h3 style="font-family: 'Source Serif 4', Georgia, serif; font-weight: 600; font-size: clamp(24px, 2.2vw, 32px); line-height: 1.2; color: #f5f4f0;">Hallo, ich bin<br>Christian Sager,</h3> <h3 style="font-family: 'Source Serif 4', Georgia, serif; font-weight: 600; font-size: clamp(24px, 2.2vw, 32px); line-height: 1.2; color: #f5f4f0;">Hallo, ich bin<br>Christian Sager,</h3>
<p style="font-size: clamp(15px, 1.3vw, 18px); line-height: 1.6; color: #c9d6e2; font-weight: 500;">Lack- und Karosserie-Experte und Inhaber der Auto Rüger GmbH in Hohenbrunn.</p> <p style="font-size: clamp(15px, 1.3vw, 18px); line-height: 1.6; color: #c9d6e2; font-weight: 500;">Lack- und Karosserie-Experte und Inhaber der Auto Rüger GmbH in Hohenbrunn — einem Familienbetrieb seit 1972.</p>
<p style="font-size: clamp(15px, 1.3vw, 18px); line-height: 1.6; color: #c9d6e2; font-weight: 500;">Mit meinem Werkstatt-Team aus professionellen Fachkräften erfülle ich Ihre individuellen Wünsche zum bestmöglichen Preis — von der Smart-Repair bis zur kompletten Restauration.</p> <p style="font-size: clamp(15px, 1.3vw, 18px); line-height: 1.6; color: #c9d6e2; font-weight: 500;">Mit meinem Werkstatt-Team aus professionellen Fachkräften erfülle ich Ihre individuellen Wünsche zum bestmöglichen Preis — von der Smart-Repair bis zur kompletten Restauration.</p>
</div> </div>
<div style="justify-self: center; width: min(340px, 100%);"> <div style="justify-self: center; width: min(340px, 100%);">
@@ -331,7 +331,7 @@
</div> </div>
<div style="display: flex; flex-direction: column; gap: 4px;"> <div style="display: flex; flex-direction: column; gap: 4px;">
<span style="font-size: 12.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #9FD1F5;">Telefon</span> <span style="font-size: 12.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #9FD1F5;">Telefon</span>
<p style="font-size: 16px; line-height: 1.5; color: #e7ecf1; font-weight: 600;"><a href="tel:tel:+49896094224" style="color: #e7ecf1;">089 6094224</a><br><span style="font-weight: 500; color: #b8c4d0;">Fax: </span></p> <p style="font-size: 16px; line-height: 1.5; color: #e7ecf1; font-weight: 600;"><a href="tel:+49896094224" style="color: #e7ecf1;">089 6094224</a></p>
</div> </div>
<div style="display: flex; flex-direction: column; gap: 4px;"> <div style="display: flex; flex-direction: column; gap: 4px;">
<span style="font-size: 12.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #9FD1F5;">E-Mail</span> <span style="font-size: 12.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #9FD1F5;">E-Mail</span>
@@ -342,7 +342,7 @@
<p style="font-size: 16px; line-height: 1.6; color: #e7ecf1; font-weight: 600;">Mo–Do<br><span style="font-weight: 500; color: #b8c4d0;">08:00–17:30</span><br>Fr<br><span style="font-weight: 500; color: #b8c4d0;">08:00–13:00</span></p> <p style="font-size: 16px; line-height: 1.6; color: #e7ecf1; font-weight: 600;">Mo–Do<br><span style="font-weight: 500; color: #b8c4d0;">08:00–17:30</span><br>Fr<br><span style="font-weight: 500; color: #b8c4d0;">08:00–13:00</span></p>
</div> </div>
<div style="display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px;"> <div style="display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px;">
<a href="tel:tel:+49896094224" style="display: inline-flex; align-items: center; gap: 8px; font-size: 14.5px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: #0d0f12; background: var(--accent, #2FA4F0); padding: 13px 22px; border-radius: 44px; transition: transform .2s ease, box-shadow .2s ease;" style-hover="transform: translateY(-2px); box-shadow: 0 10px 26px rgba(47,164,240,.4);">Jetzt anrufen</a> <a href="tel:+49896094224" style="display: inline-flex; align-items: center; gap: 8px; font-size: 14.5px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: #0d0f12; background: var(--accent, #2FA4F0); padding: 13px 22px; border-radius: 44px; transition: transform .2s ease, box-shadow .2s ease;" style-hover="transform: translateY(-2px); box-shadow: 0 10px 26px rgba(47,164,240,.4);">Jetzt anrufen</a>
<a href="mailto:info@auto-rueger.com" style="display: inline-flex; align-items: center; font-size: 14.5px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: #f4f3ef; padding: 13px 22px; border-radius: 44px; border: 1.5px solid rgba(255,255,255,.3); transition: border-color .2s ease, background .2s ease;" style-hover="border-color: var(--accent, #2FA4F0); background: rgba(255,255,255,.05);">E-Mail schreiben</a> <a href="mailto:info@auto-rueger.com" style="display: inline-flex; align-items: center; font-size: 14.5px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: #f4f3ef; padding: 13px 22px; border-radius: 44px; border: 1.5px solid rgba(255,255,255,.3); transition: border-color .2s ease, background .2s ease;" style-hover="border-color: var(--accent, #2FA4F0); background: rgba(255,255,255,.05);">E-Mail schreiben</a>
</div> </div>
</div> </div>
@@ -384,7 +384,7 @@
<div style="display: flex; flex-direction: column; gap: 9px;"> <div style="display: flex; flex-direction: column; gap: 9px;">
<h3 style="font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #7f97ac; border-bottom: 1px solid rgba(255,255,255,.12); padding-bottom: 7px; margin-bottom: 6px;">Kontakt</h3> <h3 style="font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #7f97ac; border-bottom: 1px solid rgba(255,255,255,.12); padding-bottom: 7px; margin-bottom: 6px;">Kontakt</h3>
<span style="font-size: 14px; color: #c9d6e2; font-weight: 500;">Otto-Hahn-Str. 20-22<br>85521 Hohenbrunn</span> <span style="font-size: 14px; color: #c9d6e2; font-weight: 500;">Otto-Hahn-Str. 20-22<br>85521 Hohenbrunn</span>
<a href="tel:tel:+49896094224" style="font-size: 14px; color: #c9d6e2; font-weight: 500;">089 6094224</a> <a href="tel:+49896094224" style="font-size: 14px; color: #c9d6e2; font-weight: 500;">089 6094224</a>
<a href="mailto:info@auto-rueger.com" style="font-size: 14px; color: #c9d6e2; font-weight: 500;">info@auto-rueger.com</a> <a href="mailto:info@auto-rueger.com" style="font-size: 14px; color: #c9d6e2; font-weight: 500;">info@auto-rueger.com</a>
</div> </div>
<div style="display: flex; flex-direction: column; gap: 9px;"> <div style="display: flex; flex-direction: column; gap: 9px;">
@@ -400,13 +400,13 @@
<img src="assets/logo-placeholder.svg" alt="Auto Rüger GmbH" style="width: min(46vw, 360px); height: auto; display: block; opacity: .95;"> <img src="assets/logo-placeholder.svg" alt="Auto Rüger GmbH" style="width: min(46vw, 360px); height: auto; display: block; opacity: .95;">
<div style="display: flex; align-items: center; gap: 14px; margin-top: 16px;"> <div style="display: flex; align-items: center; gap: 14px; margin-top: 16px;">
<span style="width: 44px; height: 2px; background: linear-gradient(90deg, #2FA4F0, transparent);"></span> <span style="width: 44px; height: 2px; background: linear-gradient(90deg, #2FA4F0, transparent);"></span>
<span style="font-size: 13.5px; color: #8fa4b8; font-weight: 500;">Autolackiererei &amp; Karosserie · Hohenbrunn</span> <span style="font-size: 13.5px; color: #8fa4b8; font-weight: 500;">Autolackiererei &amp; Karosserie-Fachbetrieb · ISO-zertifiziert · Hohenbrunn</span>
</div> </div>
</div> </div>
<div style="text-align: right; flex-shrink: 0;"> <div style="text-align: right; flex-shrink: 0;">
<p style="font-size: 13px; color: #8fa4b8; font-weight: 500; margin-bottom: 12px;">© 2026 Auto Rüger GmbH · Alle Rechte vorbehalten</p> <p style="font-size: 13px; color: #8fa4b8; font-weight: 500; margin-bottom: 12px;">© 2026 Auto Rüger GmbH · Alle Rechte vorbehalten</p>
<div style="display: flex; justify-content: flex-end; align-items: center; gap: 14px;"> <div style="display: flex; justify-content: flex-end; align-items: center; gap: 14px;">
<a href="" target="_blank" rel="noopener" aria-label="Facebook" style="width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); display: inline-flex; align-items: center; justify-content: center; color: #c9d6e2; font-weight: 800; font-size: 15px; transition: background .2s ease, transform .2s ease;" style-hover="background: var(--accent, #2FA4F0); color: #0a1526; transform: scale(1.1);">f</a> <a href="https://www.facebook.com/AutoRuger/" target="_blank" rel="noopener" aria-label="Facebook" style="width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); display: inline-flex; align-items: center; justify-content: center; color: #c9d6e2; font-weight: 800; font-size: 15px; transition: background .2s ease, transform .2s ease;" style-hover="background: var(--accent, #2FA4F0); color: #0a1526; transform: scale(1.1);">f</a>
<a href="#impressum" style="font-size: 13px; color: #8fa4b8; font-weight: 500;">Impressum</a> <a href="#impressum" style="font-size: 13px; color: #8fa4b8; font-weight: 500;">Impressum</a>
<a href="#datenschutz" style="font-size: 13px; color: #8fa4b8; font-weight: 500;">Datenschutz</a> <a href="#datenschutz" style="font-size: 13px; color: #8fa4b8; font-weight: 500;">Datenschutz</a>
</div> </div>