diff --git a/homepage/home/static/home/css/styles.css b/homepage/home/static/home/css/styles.css index 28a7897..5a74c7e 100644 --- a/homepage/home/static/home/css/styles.css +++ b/homepage/home/static/home/css/styles.css @@ -1,5 +1,5 @@ /* -! tailwindcss v3.2.4 | MIT License | https://tailwindcss.com +! tailwindcss v3.4.3 | MIT License | https://tailwindcss.com */ /* @@ -31,9 +31,12 @@ 3. Use a more readable tab size. 4. Use the user's configured `sans` font-family by default. 5. Use the user's configured `sans` font-feature-settings by default. +6. Use the user's configured `sans` font-variation-settings by default. +7. Disable tap highlights on iOS */ -html { +html, +:host { line-height: 1.5; /* 1 */ -webkit-text-size-adjust: 100%; @@ -47,6 +50,10 @@ html { /* 4 */ font-feature-settings: normal; /* 5 */ + font-variation-settings: normal; + /* 6 */ + -webkit-tap-highlight-color: transparent; + /* 7 */ } /* @@ -118,8 +125,10 @@ strong { } /* -1. Use the user's configured `mono` font family by default. -2. Correct the odd `em` font sizing in all browsers. +1. Use the user's configured `mono` font-family by default. +2. Use the user's configured `mono` font-feature-settings by default. +3. Use the user's configured `mono` font-variation-settings by default. +4. Correct the odd `em` font sizing in all browsers. */ code, @@ -128,8 +137,12 @@ samp, pre { font-family: VictorMono, "Liberation Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Courier New", monospace; /* 1 */ - font-size: 1em; + font-feature-settings: normal; /* 2 */ + font-variation-settings: normal; + /* 3 */ + font-size: 1em; + /* 4 */ } /* @@ -188,12 +201,18 @@ select, textarea { font-family: inherit; /* 1 */ + font-feature-settings: inherit; + /* 1 */ + font-variation-settings: inherit; + /* 1 */ font-size: 100%; /* 1 */ font-weight: inherit; /* 1 */ line-height: inherit; /* 1 */ + letter-spacing: inherit; + /* 1 */ color: inherit; /* 1 */ margin: 0; @@ -217,9 +236,9 @@ select { */ button, -[type='button'], -[type='reset'], -[type='submit'] { +input:where([type='button']), +input:where([type='reset']), +input:where([type='submit']) { -webkit-appearance: button; /* 1 */ background-color: transparent; @@ -338,6 +357,14 @@ menu { padding: 0; } +/* +Reset default styling for dialogs. +*/ + +dialog { + padding: 0; +} + /* Prevent resizing textareas horizontally by default. */ @@ -433,6 +460,9 @@ video { --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; + --tw-gradient-from-position: ; + --tw-gradient-via-position: ; + --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; @@ -464,6 +494,10 @@ video { --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; + --tw-contain-size: ; + --tw-contain-layout: ; + --tw-contain-paint: ; + --tw-contain-style: ; } ::backdrop { @@ -480,6 +514,9 @@ video { --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; + --tw-gradient-from-position: ; + --tw-gradient-via-position: ; + --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; @@ -511,6 +548,10 @@ video { --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; + --tw-contain-size: ; + --tw-contain-layout: ; + --tw-contain-paint: ; + --tw-contain-style: ; } .container { @@ -568,18 +609,18 @@ video { right: 0px; } -.inset-y-20 { - top: 5rem; - bottom: 5rem; -} - .inset-y-0 { top: 0px; bottom: 0px; } -.top-\[68px\] { - top: 68px; +.inset-y-20 { + top: 5rem; + bottom: 5rem; +} + +.bottom-10 { + bottom: 2.5rem; } .bottom-2 { @@ -594,77 +635,77 @@ video { right: 0px; } -.bottom-10 { - bottom: 2.5rem; +.right-2 { + right: 0.5rem; } .top-0 { top: 0px; } -.right-2 { - right: 0.5rem; +.top-\[68px\] { + top: 68px; } .z-10 { z-index: 10; } -.col-span-3 { - grid-column: span 3 / span 3; -} - .col-span-2 { grid-column: span 2 / span 2; } +.col-span-3 { + grid-column: span 3 / span 3; +} + .mx-auto { margin-left: auto; margin-right: auto; } -.ml-4 { - margin-left: 1rem; +.mb-1 { + margin-bottom: 0.25rem; } .mb-2 { margin-bottom: 0.5rem; } -.mt-4 { - margin-top: 1rem; +.ml-10 { + margin-left: 2.5rem; } -.mr-4 { - margin-right: 1rem; -} - -.mt-2 { - margin-top: 0.5rem; -} - -.mt-10 { - margin-top: 2.5rem; +.ml-4 { + margin-left: 1rem; } .mr-1 { margin-right: 0.25rem; } -.mb-1 { - margin-bottom: 0.25rem; +.mr-2 { + margin-right: 0.5rem; +} + +.mr-4 { + margin-right: 1rem; } .mt-1 { margin-top: 0.25rem; } -.ml-10 { - margin-left: 2.5rem; +.mt-10 { + margin-top: 2.5rem; } -.mr-2 { - margin-right: 0.5rem; +.mt-2 { + margin-top: 0.5rem; +} + +.mt-4 { + margin-top: 1rem; } .block { @@ -691,42 +732,10 @@ video { aspect-ratio: 3/5; } -.h-\[calc\(100vh\)\] { - height: calc(100vh); -} - -.h-6 { - height: 1.5rem; -} - -.h-\[15px\] { - height: 15px; -} - -.h-\[12px\] { - height: 12px; -} - -.h-full { - height: 100%; -} - .h-0 { height: 0px; } -.h-32 { - height: 8rem; -} - -.h-4 { - height: 1rem; -} - -.h-8 { - height: 2rem; -} - .h-28 { height: 7rem; } @@ -735,20 +744,53 @@ video { height: 0.75rem; } -.max-h-\[646px\] { - max-height: 646px; +.h-32 { + height: 8rem; } -.max-h-\[calc\(100vh-75px\)\] { - max-height: calc(100vh - 75px); +.h-4 { + height: 1rem; +} + +.h-6 { + height: 1.5rem; +} + +.h-8 { + height: 2rem; +} + +.h-\[12px\] { + height: 12px; +} + +.h-\[15px\] { + height: 15px; +} + +.h-\[calc\(100vh\)\] { + height: calc(100vh); +} + +.h-full { + height: 100%; +} + +.h-fit { + height: -moz-fit-content; + height: fit-content; +} + +.max-h-\[646px\] { + max-height: 646px; } .max-h-\[750px\] { max-height: 750px; } -.min-h-\[calc\(100vh-88px\)\] { - min-height: calc(100vh - 88px); +.max-h-\[calc\(100vh-75px\)\] { + max-height: calc(100vh - 75px); } .min-h-\[400px\] { @@ -759,16 +801,13 @@ video { min-height: 50vh; } -.w-6 { - width: 1.5rem; +.min-h-\[calc\(100vh-88px\)\] { + min-height: calc(100vh - 88px); } -.w-\[12px\] { - width: 12px; -} - -.w-full { - width: 100%; +.min-h-fit { + min-height: -moz-fit-content; + min-height: fit-content; } .w-1\/2 { @@ -779,27 +818,43 @@ video { width: 6rem; } +.w-3 { + width: 0.75rem; +} + .w-4 { width: 1rem; } +.w-6 { + width: 1.5rem; +} + +.w-8 { + width: 2rem; +} + +.w-\[12px\] { + width: 12px; +} + .w-fit { width: -moz-fit-content; width: fit-content; } -.w-8 { - width: 2rem; -} - -.w-3 { - width: 0.75rem; +.w-full { + width: 100%; } .min-w-\[5rem\] { min-width: 5rem; } +.max-w-\[300px\] { + max-width: 300px; +} + .max-w-lg { max-width: 32rem; } @@ -812,14 +867,6 @@ video { max-width: 768px; } -.max-w-\[400px\] { - max-width: 400px; -} - -.max-w-\[300px\] { - max-width: 300px; -} - .grow { flex-grow: 1; } @@ -858,66 +905,10 @@ video { grid-template-columns: 12px 1fr; } -.grid-cols-\[minmax\(fit_1fr\)_1fr\] { - grid-template-columns: minmax(fit 1fr) 1fr; -} - -.grid-cols-\[minmax\(fit\2c _1fr\)_1fr\] { - grid-template-columns: minmax(fit, 1fr) 1fr; -} - -.grid-cols-\[minmax\(fit-content\2c _1fr\)_1fr\] { - grid-template-columns: minmax(fit-content, 1fr) 1fr; -} - -.grid-cols-\[minmax\(auto\2c _1fr\)_1fr\] { - grid-template-columns: minmax(auto, 1fr) 1fr; -} - -.grid-cols-\[minmin\(auto\2c _1fr\)_1fr\] { - grid-template-columns: minmin(auto, 1fr) 1fr; -} - -.grid-cols-\[maxmin\(auto\2c _1fr\)_1fr\] { - grid-template-columns: maxmin(auto, 1fr) 1fr; -} - -.grid-cols-\[minmax\(100px\2c _1fr\)_1fr\] { - grid-template-columns: minmax(100px, 1fr) 1fr; -} - -.grid-cols-\[minmax\(200px\2c _1fr\)_1fr\] { - grid-template-columns: minmax(200px, 1fr) 1fr; -} - -.grid-cols-\[maxmin\(200px\2c _1fr\)_1fr\] { - grid-template-columns: maxmin(200px, 1fr) 1fr; -} - -.grid-cols-\[maxmin\(100px\2c _1fr\)_1fr\] { - grid-template-columns: maxmin(100px, 1fr) 1fr; -} - -.grid-cols-\[maxmin\(400px\2c _1fr\)_1fr\] { - grid-template-columns: maxmin(400px, 1fr) 1fr; -} - -.grid-cols-\[minmax\(400px\2c _1fr\)_1fr\] { - grid-template-columns: minmax(400px, 1fr) 1fr; -} - -.grid-cols-\[max\(200px\2c _1fr\)_1fr\] { - grid-template-columns: max(200px, 1fr) 1fr; -} - .grid-cols-\[max\(1fr\)_1fr\] { grid-template-columns: max(1fr) 1fr; } -.flex-row-reverse { - flex-direction: row-reverse; -} - .flex-col { flex-direction: column; } @@ -954,10 +945,6 @@ video { justify-content: space-around; } -.gap-4 { - gap: 1rem; -} - .gap-1 { gap: 0.25rem; } @@ -970,10 +957,8 @@ video { gap: 0.5rem; } -.space-y-8 > :not([hidden]) ~ :not([hidden]) { - --tw-space-y-reverse: 0; - margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse))); - margin-bottom: calc(2rem * var(--tw-space-y-reverse)); +.gap-4 { + gap: 1rem; } .space-x-1 > :not([hidden]) ~ :not([hidden]) { @@ -982,40 +967,40 @@ video { margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse))); } -.space-x-4 > :not([hidden]) ~ :not([hidden]) { - --tw-space-x-reverse: 0; - margin-right: calc(1rem * var(--tw-space-x-reverse)); - margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse))); -} - .space-x-3 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(0.75rem * var(--tw-space-x-reverse)); margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse))); } +.space-x-4 > :not([hidden]) ~ :not([hidden]) { + --tw-space-x-reverse: 0; + margin-right: calc(1rem * var(--tw-space-x-reverse)); + margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse))); +} + .space-y-1 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(0.25rem * var(--tw-space-y-reverse)); } -.space-y-4 > :not([hidden]) ~ :not([hidden]) { - --tw-space-y-reverse: 0; - margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse))); - margin-bottom: calc(1rem * var(--tw-space-y-reverse)); -} - .space-y-10 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(2.5rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(2.5rem * var(--tw-space-y-reverse)); } -.space-x-2 > :not([hidden]) ~ :not([hidden]) { - --tw-space-x-reverse: 0; - margin-right: calc(0.5rem * var(--tw-space-x-reverse)); - margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse))); +.space-y-4 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(1rem * var(--tw-space-y-reverse)); +} + +.space-y-8 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(2rem * var(--tw-space-y-reverse)); } .self-center { @@ -1026,13 +1011,12 @@ video { overflow-y: auto; } -.rounded-lg { - border-radius: 0.5rem; +.overflow-y-scroll { + overflow-y: scroll; } -.rounded-r { - border-top-right-radius: 0.25rem; - border-bottom-right-radius: 0.25rem; +.rounded-lg { + border-radius: 0.5rem; } .rounded-l { @@ -1040,6 +1024,11 @@ video { border-bottom-left-radius: 0.25rem; } +.rounded-r { + border-top-right-radius: 0.25rem; + border-bottom-right-radius: 0.25rem; +} + .border-2 { border-width: 2px; } @@ -1053,22 +1042,32 @@ video { border-bottom-width: 2px; } -.border-t { - border-top-width: 1px; +.border-b-2 { + border-bottom-width: 2px; } .border-l-4 { border-left-width: 4px; } -.border-b-2 { - border-bottom-width: 2px; +.border-t { + border-top-width: 1px; } .border-solid { border-style: solid; } +.border-gray-600 { + --tw-border-opacity: 1; + border-color: rgb(75 85 99 / var(--tw-border-opacity)); +} + +.border-petrol-500 { + --tw-border-opacity: 1; + border-color: rgb(2 82 83 / var(--tw-border-opacity)); +} + .border-red-700 { --tw-border-opacity: 1; border-color: rgb(185 28 28 / var(--tw-border-opacity)); @@ -1079,14 +1078,19 @@ video { border-color: rgb(100 116 139 / var(--tw-border-opacity)); } -.border-petrol-500 { - --tw-border-opacity: 1; - border-color: rgb(2 82 83 / var(--tw-border-opacity)); +.bg-black { + --tw-bg-opacity: 1; + background-color: rgb(0 0 0 / var(--tw-bg-opacity)); } -.border-gray-600 { - --tw-border-opacity: 1; - border-color: rgb(75 85 99 / var(--tw-border-opacity)); +.bg-celeste-300 { + --tw-bg-opacity: 1; + background-color: rgb(181 248 254 / var(--tw-bg-opacity)); +} + +.bg-gray-100 { + --tw-bg-opacity: 1; + background-color: rgb(243 244 246 / var(--tw-bg-opacity)); } .bg-lime-300 { @@ -1094,33 +1098,18 @@ video { background-color: rgb(240 255 214 / var(--tw-bg-opacity)); } -.bg-black { - --tw-bg-opacity: 1; - background-color: rgb(0 0 0 / var(--tw-bg-opacity)); -} - -.bg-white { - --tw-bg-opacity: 1; - background-color: rgb(255 255 255 / var(--tw-bg-opacity)); -} - .bg-petrol-100 { --tw-bg-opacity: 1; background-color: rgb(204 220 220 / var(--tw-bg-opacity)); } -.bg-petrol-500\/20 { - background-color: rgb(2 82 83 / 0.2); -} - .bg-petrol-500 { --tw-bg-opacity: 1; background-color: rgb(2 82 83 / var(--tw-bg-opacity)); } -.bg-celeste-300 { - --tw-bg-opacity: 1; - background-color: rgb(181 248 254 / var(--tw-bg-opacity)); +.bg-petrol-500\/20 { + background-color: rgb(2 82 83 / 0.2); } .bg-petrol-500\/40 { @@ -1132,9 +1121,9 @@ video { background-color: rgb(254 202 202 / var(--tw-bg-opacity)); } -.bg-gray-100 { +.bg-white { --tw-bg-opacity: 1; - background-color: rgb(243 244 246 / var(--tw-bg-opacity)); + background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .object-cover { @@ -1142,6 +1131,11 @@ video { object-fit: cover; } +.object-\[50\%20\%\] { + -o-object-position: 50%20%; + object-position: 50%20%; +} + .object-\[50\%40\%\] { -o-object-position: 50%40%; object-position: 50%40%; @@ -1152,9 +1146,12 @@ video { object-position: 50%50%; } -.object-\[50\%20\%\] { - -o-object-position: 50%20%; - object-position: 50%20%; +.p-1 { + padding: 0.25rem; +} + +.p-10 { + padding: 2.5rem; } .p-2 { @@ -1165,17 +1162,9 @@ video { padding: 1.5rem; } -.p-10 { - padding: 2.5rem; -} - -.p-1 { - padding: 0.25rem; -} - -.px-2 { - padding-left: 0.5rem; - padding-right: 0.5rem; +.px-0 { + padding-left: 0px; + padding-right: 0px; } .px-10 { @@ -1183,29 +1172,14 @@ video { padding-right: 2.5rem; } -.py-10 { - padding-top: 2.5rem; - padding-bottom: 2.5rem; -} - -.py-1 { - padding-top: 0.25rem; - padding-bottom: 0.25rem; -} - -.py-4 { - padding-top: 1rem; - padding-bottom: 1rem; -} - .px-12 { padding-left: 3rem; padding-right: 3rem; } -.px-0 { - padding-left: 0px; - padding-right: 0px; +.px-2 { + padding-left: 0.5rem; + padding-right: 0.5rem; } .px-4 { @@ -1213,40 +1187,39 @@ video { padding-right: 1rem; } -.py-2 { - padding-top: 0.5rem; - padding-bottom: 0.5rem; -} - .px-6 { padding-left: 1.5rem; padding-right: 1.5rem; } -.py-0\.5 { - padding-top: 0.125rem; - padding-bottom: 0.125rem; -} - .py-0 { padding-top: 0px; padding-bottom: 0px; } -.pt-10 { +.py-0\.5 { + padding-top: 0.125rem; + padding-bottom: 0.125rem; +} + +.py-1 { + padding-top: 0.25rem; + padding-bottom: 0.25rem; +} + +.py-10 { padding-top: 2.5rem; + padding-bottom: 2.5rem; } -.pb-\[100px\] { - padding-bottom: 100px; +.py-2 { + padding-top: 0.5rem; + padding-bottom: 0.5rem; } -.pb-16 { - padding-bottom: 4rem; -} - -.pt-6 { - padding-top: 1.5rem; +.py-4 { + padding-top: 1rem; + padding-bottom: 1rem; } .pb-1 { @@ -1257,10 +1230,26 @@ video { padding-bottom: 3rem; } +.pb-16 { + padding-bottom: 4rem; +} + +.pb-\[100px\] { + padding-bottom: 100px; +} + .pb-\[80px\] { padding-bottom: 80px; } +.pt-10 { + padding-top: 2.5rem; +} + +.pt-6 { + padding-top: 1.5rem; +} + .text-left { text-align: left; } @@ -1281,6 +1270,16 @@ video { font-family: futura, "Noto Sans Light", Roboto, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica Neue, Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; } +.text-2xl { + font-size: 1.5rem; + line-height: 2rem; +} + +.text-3xl { + font-size: 1.875rem; + line-height: 2.25rem; +} + .text-4xl { font-size: 2.25rem; line-height: 2.5rem; @@ -1291,19 +1290,14 @@ video { line-height: 1.5rem; } -.text-sm { - font-size: 0.875rem; - line-height: 1.25rem; -} - .text-lg { font-size: 1.125rem; line-height: 1.75rem; } -.text-2xl { - font-size: 1.5rem; - line-height: 2rem; +.text-sm { + font-size: 0.875rem; + line-height: 1.25rem; } .text-xl { @@ -1316,11 +1310,6 @@ video { line-height: 1rem; } -.text-3xl { - font-size: 1.875rem; - line-height: 2.25rem; -} - .font-bold { font-weight: 700; } @@ -1333,9 +1322,24 @@ video { line-height: 1.625; } -.text-slate-600 { +.text-\[\#ccc\] { --tw-text-opacity: 1; - color: rgb(71 85 105 / var(--tw-text-opacity)); + color: rgb(204 204 204 / var(--tw-text-opacity)); +} + +.text-gray-400 { + --tw-text-opacity: 1; + color: rgb(156 163 175 / var(--tw-text-opacity)); +} + +.text-gray-600 { + --tw-text-opacity: 1; + color: rgb(75 85 99 / var(--tw-text-opacity)); +} + +.text-lime-500 { + --tw-text-opacity: 1; + color: rgb(103 185 85 / var(--tw-text-opacity)); } .text-petrol-500 { @@ -1343,6 +1347,26 @@ video { color: rgb(2 82 83 / var(--tw-text-opacity)); } +.text-red-600 { + --tw-text-opacity: 1; + color: rgb(220 38 38 / var(--tw-text-opacity)); +} + +.text-red-700 { + --tw-text-opacity: 1; + color: rgb(185 28 28 / var(--tw-text-opacity)); +} + +.text-slate-500 { + --tw-text-opacity: 1; + color: rgb(100 116 139 / var(--tw-text-opacity)); +} + +.text-slate-600 { + --tw-text-opacity: 1; + color: rgb(71 85 105 / var(--tw-text-opacity)); +} + .text-slate-800 { --tw-text-opacity: 1; color: rgb(30 41 59 / var(--tw-text-opacity)); @@ -1353,46 +1377,6 @@ video { color: rgb(255 255 255 / var(--tw-text-opacity)); } -.text-slate-500 { - --tw-text-opacity: 1; - color: rgb(100 116 139 / var(--tw-text-opacity)); -} - -.text-red-700 { - --tw-text-opacity: 1; - color: rgb(185 28 28 / var(--tw-text-opacity)); -} - -.text-\[\#ccc\] { - --tw-text-opacity: 1; - color: rgb(204 204 204 / var(--tw-text-opacity)); -} - -.text-lime-500 { - --tw-text-opacity: 1; - color: rgb(103 185 85 / var(--tw-text-opacity)); -} - -.text-gray-600 { - --tw-text-opacity: 1; - color: rgb(75 85 99 / var(--tw-text-opacity)); -} - -.text-gray-400 { - --tw-text-opacity: 1; - color: rgb(156 163 175 / var(--tw-text-opacity)); -} - -.text-lime-700 { - --tw-text-opacity: 1; - color: rgb(77 124 15 / var(--tw-text-opacity)); -} - -.text-red-600 { - --tw-text-opacity: 1; - color: rgb(220 38 38 / var(--tw-text-opacity)); -} - .underline { text-decoration-line: underline; } @@ -1539,33 +1523,21 @@ ul.referenz { transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } -.hover\:bg-petrol-500:hover { - --tw-bg-opacity: 1; - background-color: rgb(2 82 83 / var(--tw-bg-opacity)); -} - .hover\:bg-gray-200:hover { --tw-bg-opacity: 1; background-color: rgb(229 231 235 / var(--tw-bg-opacity)); } +.hover\:bg-petrol-500:hover { + --tw-bg-opacity: 1; + background-color: rgb(2 82 83 / var(--tw-bg-opacity)); +} + .hover\:text-white:hover { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } -@media (prefers-color-scheme: dark) { - .dark\:bg-mastodon-dark-bg { - --tw-bg-opacity: 1; - background-color: rgb(40 44 55 / var(--tw-bg-opacity)); - } - - .dark\:text-white { - --tw-text-opacity: 1; - color: rgb(255 255 255 / var(--tw-text-opacity)); - } -} - @media (min-width: 640px) { .sm\:relative { position: relative; @@ -1595,24 +1567,24 @@ ul.referenz { width: 100%; } - .sm\:grid-cols-\[minmax\(300px\2c _1fr\)_3fr\] { - grid-template-columns: minmax(300px, 1fr) 3fr; - } - - .sm\:grid-cols-\[7fr_5fr_3fr\] { - grid-template-columns: 7fr 5fr 3fr; - } - - .sm\:grid-cols-\[3fr_5fr_3fr\] { - grid-template-columns: 3fr 5fr 3fr; + .sm\:grid-cols-3 { + grid-template-columns: repeat(3, minmax(0, 1fr)); } .sm\:grid-cols-\[3fr_3fr_2fr\] { grid-template-columns: 3fr 3fr 2fr; } - .sm\:grid-cols-3 { - grid-template-columns: repeat(3, minmax(0, 1fr)); + .sm\:grid-cols-\[3fr_5fr_3fr\] { + grid-template-columns: 3fr 5fr 3fr; + } + + .sm\:grid-cols-\[7fr_5fr_3fr\] { + grid-template-columns: 7fr 5fr 3fr; + } + + .sm\:grid-cols-\[minmax\(300px\2c _1fr\)_3fr\] { + grid-template-columns: minmax(300px, 1fr) 3fr; } .sm\:flex-row { @@ -1630,16 +1602,16 @@ ul.referenz { background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } - .sm\:py-2 { - padding-top: 0.5rem; - padding-bottom: 0.5rem; - } - .sm\:px-0 { padding-left: 0px; padding-right: 0px; } + .sm\:py-2 { + padding-top: 0.5rem; + padding-bottom: 0.5rem; + } + .sm\:pl-0 { padding-left: 0px; } @@ -1667,3 +1639,15 @@ ul.referenz { padding-right: 0.25rem; } } + +@media (prefers-color-scheme: dark) { + .dark\:bg-mastodon-dark-bg { + --tw-bg-opacity: 1; + background-color: rgb(40 44 55 / var(--tw-bg-opacity)); + } + + .dark\:text-white { + --tw-text-opacity: 1; + color: rgb(255 255 255 / var(--tw-text-opacity)); + } +} diff --git a/homepage/home/templates/kontakt.html b/homepage/home/templates/kontakt.html index 9267410..12df793 100644 --- a/homepage/home/templates/kontakt.html +++ b/homepage/home/templates/kontakt.html @@ -94,6 +94,7 @@ Besten Gruß
Tobias Gerwin

+