feat: update responsive utility classes and adjust navbar logo styles

This commit is contained in:
2025-06-14 21:12:49 +02:00
parent 14d62a8e68
commit 3c5985d52f
3 changed files with 32 additions and 6 deletions
+15 -2
View File
@@ -1,5 +1,3 @@
@import url('https://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700|Roboto&display=swap');
/* ubuntu-300 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
@@ -5564,6 +5562,16 @@
height: calc(var(--spacing) * 24);
}
}
.md\:h-32 {
@media (width >= 48rem) {
height: calc(var(--spacing) * 32);
}
}
.md\:w-32 {
@media (width >= 48rem) {
width: calc(var(--spacing) * 32);
}
}
.md\:h-36 {
@media (width >= 48rem) {
height: calc(var(--spacing) * 36);
@@ -5629,6 +5637,11 @@
margin-top: calc(var(--spacing) * 24);
}
}
.md\:mt-20 {
@media (width >= 48rem) {
margin-top: calc(var(--spacing) * 20);
}
}
.lg\:block {
@media (width >= 64rem) {
display: block;
+2 -2
View File
@@ -16,13 +16,13 @@
<div class="flex h-24 items-center justify-between">
<!-- Logo (Links) -->
<a href="https://www.schachfreunde-badsteben.de/" class="flex justify-center items-center">
<div class="relative flex justify-center items-center md:mt-24">
<div class="relative flex justify-center items-center md:mt-20">
<div class="hidden absolute inset-0 w-48 h-48 md:block">
<svg width="100%" height="100%" viewBox="0 0 48 48">
<circle cx="24" cy="24" r="24" fill="#cdcdcd"/>
</svg>
</div>
<svg class="w-18 h-18 md:w-36 md:h-36 relative" viewBox="0 0 316.97 324.57" fill="none">
<svg class="w-18 h-18 md:w-32 md:h-32 relative" viewBox="0 0 316.97 324.57" fill="none">
<!-- Bestehendes SVG-Markup -->
<defs>
<style>
+15 -2
View File
@@ -1,5 +1,3 @@
@import url('https://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700|Roboto&display=swap');
/* ubuntu-300 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
@@ -5564,6 +5562,16 @@
height: calc(var(--spacing) * 24);
}
}
.md\:h-32 {
@media (width >= 48rem) {
height: calc(var(--spacing) * 32);
}
}
.md\:w-32 {
@media (width >= 48rem) {
width: calc(var(--spacing) * 32);
}
}
.md\:h-36 {
@media (width >= 48rem) {
height: calc(var(--spacing) * 36);
@@ -5629,6 +5637,11 @@
margin-top: calc(var(--spacing) * 24);
}
}
.md\:mt-20 {
@media (width >= 48rem) {
margin-top: calc(var(--spacing) * 20);
}
}
.lg\:block {
@media (width >= 64rem) {
display: block;