SFBadSteben/schachfreunde-badsteben
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: update responsive utility classes and adjust navbar logo styles

Browse Source
This commit is contained in:
Tobias Feigel
2025-06-14 21:12:49 +02:00
parent 14d62a8e68
commit 3c5985d52f
3 changed files with 32 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/styles.css
+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 */ /* ubuntu-300 - latin */
@font-face { @font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ 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); 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 { .md\:h-36 {
@media (width >= 48rem) { @media (width >= 48rem) {
height: calc(var(--spacing) * 36); height: calc(var(--spacing) * 36);
@@ -5629,6 +5637,11 @@
margin-top: calc(var(--spacing) * 24); margin-top: calc(var(--spacing) * 24);
} }
} }
.md\:mt-20 {
@media (width >= 48rem) {
margin-top: calc(var(--spacing) * 20);
}
}
.lg\:block { .lg\:block {
@media (width >= 64rem) { @media (width >= 64rem) {
display: block; display: block;
site/snippets/navbar.php
+2 -2
View File
@@ -16,13 +16,13 @@
<div class="flex h-24 items-center justify-between"> <div class="flex h-24 items-center justify-between">
<!-- Logo (Links) --> <!-- Logo (Links) -->
<a href="https://www.schachfreunde-badsteben.de/" class="flex justify-center items-center"> <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"> <div class="hidden absolute inset-0 w-48 h-48 md:block">
<svg width="100%" height="100%" viewBox="0 0 48 48"> <svg width="100%" height="100%" viewBox="0 0 48 48">
<circle cx="24" cy="24" r="24" fill="#cdcdcd"/> <circle cx="24" cy="24" r="24" fill="#cdcdcd"/>
</svg> </svg>
</div> </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 --> <!-- Bestehendes SVG-Markup -->
<defs> <defs>
<style> <style>
src/css/input.css
+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 */ /* ubuntu-300 - latin */
@font-face { @font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ 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); 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 { .md\:h-36 {
@media (width >= 48rem) { @media (width >= 48rem) {
height: calc(var(--spacing) * 36); height: calc(var(--spacing) * 36);
@@ -5629,6 +5637,11 @@
margin-top: calc(var(--spacing) * 24); margin-top: calc(var(--spacing) * 24);
} }
} }
.md\:mt-20 {
@media (width >= 48rem) {
margin-top: calc(var(--spacing) * 20);
}
}
.lg\:block { .lg\:block {
@media (width >= 64rem) { @media (width >= 64rem) {
display: block; display: block;