logo: gradient square back, dog on top; footer wording
brand-dot is back to the blue→yellow gradient rounded square, and the didi image sits centered inside it (span wrapper, flex-centered, 88% inner size). The dog's transparent background lets the gradient peek through around him. Footer: "Programmiert für Annika ♥" → "Mit ♥ programmiert für Annika". Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
d3e803beee
commit
e8aa0e6e24
3 changed files with 9 additions and 5 deletions
|
|
@ -7,7 +7,7 @@
|
||||||
<header class="border-b border-soft bg-white/70 backdrop-blur sticky top-0 z-10">
|
<header class="border-b border-soft bg-white/70 backdrop-blur sticky top-0 z-10">
|
||||||
<div class="max-w-6xl mx-auto px-6 py-3 flex items-center justify-between">
|
<div class="max-w-6xl mx-auto px-6 py-3 flex items-center justify-between">
|
||||||
<div class="flex items-center gap-3">
|
<div class="flex items-center gap-3">
|
||||||
<img src="/static/didi.webp" alt="" class="brand-dot">
|
<span class="brand-dot"><img src="/static/didi.webp" alt=""></span>
|
||||||
<h1 class="text-xl font-semibold">wohnungsdidi</h1>
|
<h1 class="text-xl font-semibold">wohnungsdidi</h1>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex items-center gap-4 text-sm">
|
<div class="flex items-center gap-4 text-sm">
|
||||||
|
|
@ -30,6 +30,6 @@
|
||||||
{% block content %}{% endblock %}
|
{% block content %}{% endblock %}
|
||||||
</main>
|
</main>
|
||||||
<footer class="text-center text-xs text-slate-500 py-6">
|
<footer class="text-center text-xs text-slate-500 py-6">
|
||||||
Programmiert für Annika ♥
|
Mit ♥ programmiert für Annika
|
||||||
</footer>
|
</footer>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
|
||||||
|
|
@ -124,9 +124,13 @@
|
||||||
.map-popup-actions form { margin: 0; }
|
.map-popup-actions form { margin: 0; }
|
||||||
.brand-dot {
|
.brand-dot {
|
||||||
width: 2.25rem; height: 2.25rem; border-radius: 10px;
|
width: 2.25rem; height: 2.25rem; border-radius: 10px;
|
||||||
object-fit: contain; display: block;
|
background: linear-gradient(135deg, #66b7f2 0%, #2f8ae0 60%, #fbd76b 100%);
|
||||||
background: #fff;
|
|
||||||
box-shadow: 0 1px 4px rgba(47, 138, 224, 0.35);
|
box-shadow: 0 1px 4px rgba(47, 138, 224, 0.35);
|
||||||
|
display: inline-flex; align-items: center; justify-content: center;
|
||||||
|
overflow: hidden; flex-shrink: 0;
|
||||||
|
}
|
||||||
|
.brand-dot img {
|
||||||
|
width: 88%; height: 88%; object-fit: contain; display: block;
|
||||||
}
|
}
|
||||||
a { color: var(--primary); }
|
a { color: var(--primary); }
|
||||||
a:hover { text-decoration: underline; }
|
a:hover { text-decoration: underline; }
|
||||||
|
|
|
||||||
|
|
@ -3,7 +3,7 @@
|
||||||
<main class="flex min-h-screen items-center justify-center p-4">
|
<main class="flex min-h-screen items-center justify-center p-4">
|
||||||
<div class="card w-full max-w-sm p-8">
|
<div class="card w-full max-w-sm p-8">
|
||||||
<div class="flex items-center gap-3 mb-6">
|
<div class="flex items-center gap-3 mb-6">
|
||||||
<img src="/static/didi.webp" alt="" class="brand-dot">
|
<span class="brand-dot"><img src="/static/didi.webp" alt=""></span>
|
||||||
<div>
|
<div>
|
||||||
<h1 class="text-2xl font-semibold leading-tight">wohnungsdidi</h1>
|
<h1 class="text-2xl font-semibold leading-tight">wohnungsdidi</h1>
|
||||||
<p class="text-sm text-slate-500">Anmeldung erforderlich</p>
|
<p class="text-sm text-slate-500">Anmeldung erforderlich</p>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue