new logo for dark and white website, fixed scaling for logo

This commit is contained in:
2026-03-23 11:51:25 +01:00
parent e06a4f87dd
commit 850aae3d0d
6 changed files with 9 additions and 5 deletions
Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 398 KiB

BIN
View File
Binary file not shown.

Before

Width:  |  Height:  |  Size: 12 KiB

+7 -4
View File
@@ -429,7 +429,7 @@ img, picture { display: block; max-width: 100%; height: auto; }
.site-header {
max-width: 1200px;
margin: 24px auto 12px;
padding: 14px 20px;
padding: 10px 20px;
border: 1px solid rgba(28,32,52,0.08);
border-radius: 14px;
background: rgba(255,255,255,0.9);
@@ -449,7 +449,10 @@ img, picture { display: block; max-width: 100%; height: auto; }
gap: 12px;
}
.site-header .logo { display: inline-flex; align-items: center; }
.site-header .logo img { display: block; height: clamp(28px,5vw,48px); width: auto; }
.site-header .logo img { display: block; height: clamp(56px,8vw,96px); width: auto; }
.site-header .logo .logo--dark { display: none; }
[data-theme="dark"] .site-header .logo .logo--light { display: none; }
[data-theme="dark"] .site-header .logo .logo--dark { display: block; }
.header-actions { margin-left: auto; display: inline-flex; align-items: center; gap: 10px; }
.lang-toggle {
padding: 8px 12px;
@@ -968,8 +971,8 @@ img, picture { display: block; max-width: 100%; height: auto; }
@media (max-width: 900px) {
#recipes { padding: 0 14px 40px; }
.site-header { padding: 12px 14px; gap: 10px; border-radius: 18px; }
.site-header .logo img { height: clamp(32px,12vw,56px); }
.site-header { padding: 10px 14px; gap: 10px; border-radius: 18px; }
.site-header .logo img { height: clamp(64px,20vw,112px); }
.menu-toggle { display: inline-flex !important; }
.menu-toggle__label { display: inline; }
.site-nav {
+2 -1
View File
@@ -1,7 +1,8 @@
<header class="site-header">
<div class="site-header__top">
<a class="logo" href="/index.php<?php echo $lang === 'de' ? '?lang=de' : ''; ?>">
<img src="/assets/logo.png" alt="FlixCooks">
<img class="logo--light" src="/assets/logo-white.png" alt="FlixCooks">
<img class="logo--dark" src="/assets/logo-black.png" alt="FlixCooks">
</a>
<div class="header-actions">
<a class="lang-toggle" href="<?php echo e($langSwitchHref ?? '#'); ?>"><?php echo e($langSwitchLabel ?? 'DE/EN'); ?></a>