chore: upgrade tailwind css from 3.4 to 4.3

This commit is contained in:
fromme committed 2026-10-20 14:41:25 +02:00
1 parent 91270fdfc3
commit 88f6807399
29 files changed
+704 -1005

No files matched your search

+9 -9
View File
@@ -1,9 +1,9 @@
@import "components/button.css";
@import "components/forms.css";
@import "components/gallery.css";
@import "components/pagination.css";
@import "components/price_calendar.css";
@import "components/toast.css";
@import "components/tooltip.css";
@import "components/typography.css";
@import "components/rte-content.css";
@import "./components/button.css";
@import "./components/forms.css";
@import "./components/gallery.css";
@import "./components/pagination.css";
@import "./components/price_calendar.css";
@import "./components/toast.css";
@import "./components/tooltip.css";
@import "./components/typography.css";
@import "./components/rte-content.css";
+10 -10
View File
@@ -1,10 +1,10 @@
@import "components/autocomplete.css";
@import "components/badge.css";
@import "components/button.css";
@import "components/datatable.css";
@import "components/datepicker.css";
@import "components/forms.css";
@import "components/pagination.css";
@import "components/toast.css";
@import "components/tooltip.css";
@import "components/typography.css";
@import "./components/autocomplete.css";
@import "./components/badge.css";
@import "./components/button.css";
@import "./components/datatable.css";
@import "./components/datepicker.css";
@import "./components/forms.css";
@import "./components/pagination.css";
@import "./components/toast.css";
@import "./components/tooltip.css";
@import "./components/typography.css";
+54
View File
@@ -0,0 +1,54 @@
/* Shared by app.css and admin.css, imported right after tailwindcss */
@source "../../templates";
@source "../../src";
@source "../../assets";
@source inline("rotate-90");
@plugin "@tailwindcss/forms";
@theme {
--font-sans: Lato, sans-serif;
--color-primary: #3d8ccb;
--color-secondary: #f9c700;
--color-primary-bg: #ebf3fa;
--color-primary-light: #0070e0;
--color-primary-medium: #165883;
--color-primary-dark: #18527b;
--color-pink: #fa1a8c;
--color-sbw-primary: #B3820F;
--color-sbw-secondary: #E91C26;
--color-sbw-primary-dark: #8D7207;
--color-sbw-overlay: #c20000;
--color-snz-primary: #82c3c6;
--color-snz-secondary: #f9c33d;
--color-snz-primary-dark: #82c3c6;
--color-ser-primary: #006fb6;
--color-ser-secondary: #DE2C1B;
--color-ser-primary-light: #04A4CC;
--background-image-badge-gradient: linear-gradient(120deg, rgba(150,1,103,1) 0%, rgba(158,3,106,1) 40%, rgba(250,26,140,1) 100%);
--background-image-brand-gradient: linear-gradient(to top right, #009fff, #165883, #18527b);
}
/*
* Tailwind 3 defaults that Tailwind 4 changed: borders were gray-200 instead of currentColor,
* and buttons had a pointer cursor.
*/
@layer base {
*,
::after,
::before,
::backdrop,
::file-selector-button {
border-color: var(--color-gray-200, currentcolor);
}
button:not(:disabled),
[role="button"]:not(:disabled) {
cursor: pointer;
}
}
+4 -6
View File
@@ -1,7 +1,5 @@
@layer utilities {
/* Reserve the scrollbar gutter so content does not shift width when a
scrollbar appears (e.g. when a collapsible section is opened). */
.scroll-stable {
scrollbar-gutter: stable;
}
/* Reserve the scrollbar gutter so content does not shift width when a
scrollbar appears (e.g. when a collapsible section is opened). */
@utility scroll-stable {
scrollbar-gutter: stable;
}
+4 -7
View File
@@ -1,7 +1,4 @@
@import "tailwindcss/base";
@import "_base.css";
@import "tailwindcss/components";
@import "_components_admin.css";
@import "tailwindcss/utilities";
@import "tailwindcss" source(none);
@import "./_theme.css";
@import "./_base.css" layer(base);
@import "./_components_admin.css" layer(components);
+5 -8
View File
@@ -1,8 +1,5 @@
@import "tailwindcss/base";
@import "_base.css";
@import "tailwindcss/components";
@import "_components.css";
@import "tailwindcss/utilities";
@import "_utilities.css";
@import "tailwindcss" source(none);
@import "./_theme.css";
@import "./_base.css" layer(base);
@import "./_components.css" layer(components);
@import "./_utilities.css";
+3 -3
View File
@@ -3,15 +3,15 @@
The line height is set with each font size (text-sm/6), because text-sm's own line height would override a plain leading-6. */
@apply inline-flex items-center justify-center space-x-2 px-4 md:px-8 py-2 border border-transparent bg-origin-border cursor-pointer;
@apply uppercase text-center text-sm/6 md:text-base/6;
@apply transition-colors outline-none focus:outline-2 focus:outline-offset-2 focus:outline-primary-dark;
@apply transition-colors outline-hidden focus:outline-2 focus:outline-offset-2 focus:outline-primary-dark;
@apply rounded-md;
/* At least one line tall even when the content is only a smaller icon: line + padding + border */
min-height: calc(1lh + 2 * theme('spacing.2') + 2px);
min-height: calc(1lh + 2 * --spacing(2) + 2px);
}
.button--small {
@apply px-2 py-1 md:px-4 text-xs/6 sm:text-sm/6;
min-height: calc(1lh + 2 * theme('spacing.1') + 2px);
min-height: calc(1lh + 2 * --spacing(1) + 2px);
}
.button--primary {
+1 -1
View File
@@ -3,5 +3,5 @@
[data-vc-theme=light] .vc-date[data-vc-date-selected] .vc-date__btn,
[data-vc-theme=light] .vc-date[data-vc-date-selected] .vc-date__btn:hover {
background-color: theme('colors.secondary');
background-color: var(--color-secondary);
}
+4 -4
View File
@@ -1,5 +1,5 @@
.pc-day {
@apply relative w-full text-center py-1 px-0.5 text-sm leading-tight rounded text-white cursor-pointer;
@apply relative w-full text-center py-1 px-0.5 text-sm leading-tight rounded-sm text-white cursor-pointer;
}
.pc-day--out-of-month {
@@ -11,11 +11,11 @@
}
.pc-day[data-status="blocked-to-ok"] {
background: linear-gradient(to bottom right, theme('colors.gray.400') 50%, theme('colors.emerald.500') 50%);
background: linear-gradient(to bottom right, var(--color-gray-400) 50%, var(--color-emerald-500) 50%);
}
.pc-day[data-status="checkout-only"] {
background: linear-gradient(to bottom right, theme('colors.emerald.500') 50%, theme('colors.gray.400') 50%);
background: linear-gradient(to bottom right, var(--color-emerald-500) 50%, var(--color-gray-400) 50%);
}
.pc-day[data-status="past"] {
@@ -33,7 +33,7 @@
.pc-day.pc-day--pending-start,
.pc-day.pc-day--selected-start,
.pc-day.pc-day--selected-end {
@apply bg-none outline-none bg-secondary text-gray-700;
@apply bg-none outline-hidden bg-secondary text-gray-700;
}
.pc-day.pc-day--in-range {
+5 -5
View File
@@ -1,25 +1,25 @@
@import "toastify-js/src/toastify.css";
.toastify {
@apply shadow-lg rounded;
@apply shadow-lg rounded-sm;
}
.toastify--success {
@apply text-gray-100;
background: theme('colors.emerald.600');
background: var(--color-emerald-600);
}
.toastify--warning {
@apply text-gray-100;
background: theme('colors.red.600');
background: var(--color-red-600);
}
.toastify--error {
@apply text-gray-100;
background: theme('colors.red.700');
background: var(--color-red-700);
}
.toastify--info {
@apply text-gray-100;
background: theme('colors.primary');
background: var(--color-primary);
}
+20 -20
View File
@@ -1,71 +1,71 @@
@import "tippy.js/dist/tippy.css";
.tippy-box {
background-color: theme('colors.primary');
background-color: var(--color-primary);
}
.tippy-box[data-placement^='top'] > .tippy-arrow::before {
border-top-color: theme('colors.primary');
border-top-color: var(--color-primary);
}
.tippy-box[data-placement^='bottom'] > .tippy-arrow::before {
border-bottom-color: theme('colors.primary');
border-bottom-color: var(--color-primary);
}
.tippy-box[data-placement^='left'] > .tippy-arrow::before {
border-left-color: theme('colors.primary');
border-left-color: var(--color-primary);
}
.tippy-box[data-placement^='right'] > .tippy-arrow::before {
border-right-color: theme('colors.primary');
border-right-color: var(--color-primary);
}
.sbw {
.tippy-box {
background-color: theme('colors.sbw.secondary');
background-color: var(--color-sbw-secondary);
}
.tippy-box[data-placement^='top'] > .tippy-arrow::before {
border-top-color: theme('colors.sbw.secondary');
border-top-color: var(--color-sbw-secondary);
}
.tippy-box[data-placement^='bottom'] > .tippy-arrow::before {
border-bottom-color: theme('colors.sbw.secondary');
border-bottom-color: var(--color-sbw-secondary);
}
.tippy-box[data-placement^='left'] > .tippy-arrow::before {
border-left-color: theme('colors.sbw.secondary');
border-left-color: var(--color-sbw-secondary);
}
.tippy-box[data-placement^='right'] > .tippy-arrow::before {
border-right-color: theme('colors.sbw.secondary');
border-right-color: var(--color-sbw-secondary);
}
}
.snz {
.tippy-box {
background-color: theme('colors.snz.primary-dark');
background-color: var(--color-snz-primary-dark);
}
.tippy-box[data-placement^='top'] > .tippy-arrow::before {
border-top-color: theme('colors.snz.primary-dark');
border-top-color: var(--color-snz-primary-dark);
}
.tippy-box[data-placement^='bottom'] > .tippy-arrow::before {
border-bottom-color: theme('colors.snz.primary-dark');
border-bottom-color: var(--color-snz-primary-dark);
}
.tippy-box[data-placement^='left'] > .tippy-arrow::before {
border-left-color: theme('colors.snz.primary-dark');
border-left-color: var(--color-snz-primary-dark);
}
.tippy-box[data-placement^='right'] > .tippy-arrow::before {
border-right-color: theme('colors.snz.primary-dark');
border-right-color: var(--color-snz-primary-dark);
}
}
.ser {
.tippy-box {
background-color: theme('colors.ser.secondary');
background-color: var(--color-ser-secondary);
}
.tippy-box[data-placement^='top'] > .tippy-arrow::before {
border-top-color: theme('colors.ser.secondary');
border-top-color: var(--color-ser-secondary);
}
.tippy-box[data-placement^='bottom'] > .tippy-arrow::before {
border-bottom-color: theme('colors.ser.secondary');
border-bottom-color: var(--color-ser-secondary);
}
.tippy-box[data-placement^='left'] > .tippy-arrow::before {
border-left-color: theme('colors.ser.secondary');
border-left-color: var(--color-ser-secondary);
}
.tippy-box[data-placement^='right'] > .tippy-arrow::before {
border-right-color: theme('colors.ser.secondary');
border-right-color: var(--color-ser-secondary);
}
}
-1
View File
@@ -59,7 +59,6 @@ $rsyncOptions = [
'phpunit.xml.dist',
'public/.htaccess',
'ray.php',
'tailwind.config.js',
'webpack.config.mjs',
'bin/.phpunit',
'temp/',
+559 -851
View File
File diff suppressed because it is too large. Load diff
+2 -2
View File
@@ -7,7 +7,7 @@
"@symfony/stimulus-bridge": "^3.2.0",
"@symfony/webpack-encore": "^7.2.0",
"@tailwindcss/forms": "^0.5.9",
"autoprefixer": "^10.4.20",
"@tailwindcss/postcss": "^4.3.3",
"babel-plugin-polyfill-corejs3": "^1.0.0",
"core-js": "^3.51.0",
"cypress": "^15.5.0",
@@ -15,7 +15,7 @@
"lightningcss": "^1.33.0",
"postcss": "^8.4.49",
"postcss-loader": "^8.1.1",
"tailwindcss": "^3.4.15",
"tailwindcss": "^4.3.3",
"tippy.js": "^6.3.7",
"toastify-js": "^1.12.0",
"webpack": "^5.74.0",
+1 -3
View File
@@ -1,7 +1,5 @@
module.exports = {
plugins: {
'postcss-import': {},
tailwindcss: {},
autoprefixer: {},
'@tailwindcss/postcss': {},
}
}
-52
View File
@@ -1,52 +0,0 @@
/** @type {import('tailwindcss').Config} */
module.exports = {
content: [
'./templates/**/*.twig',
'./src/**/*.php',
],
safelist: ['rotate-90'],
theme: {
container: {
center: true,
padding: '2rem',
},
extend: {
fontFamily: {
sans: ['Lato', 'sans-serif'],
},
colors: {
primary: '#3d8ccb',
secondary: '#f9c700',
'primary-bg': '#ebf3fa',
'primary-light': '#0070e0',
'primary-medium': '#165883',
'primary-dark': '#18527b',
pink: '#fa1a8c',
sbw: {
primary: '#B3820F',
secondary: '#E91C26',
'primary-dark': '#8D7207',
overlay: '#c20000',
},
snz: {
primary: '#82c3c6',
secondary: '#f9c33d',
'primary-dark': '#82c3c6',
},
ser: {
primary: '#006fb6',
secondary: '#DE2C1B',
'primary-light': '#04A4CC',
},
},
backgroundImage: {
'badge-gradient': 'linear-gradient(120deg, rgba(150,1,103,1) 0%, rgba(158,3,106,1) 40%, rgba(250,26,140,1) 100%)',
'brand-gradient': 'linear-gradient(to top right, #009fff, #165883, #18527b)',
},
},
},
plugins: [
require('@tailwindcss/forms'),
],
}
@@ -28,7 +28,7 @@
name="q"
value="{{ filter.q }}"
placeholder="{{ form.q.vars.attr.placeholder|default('Suchen…') }}"
class="block w-64 rounded-md border-0 py-1.5 pl-9 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset focus:ring-primary text-sm">
class="block w-64 rounded-md border-0 py-1.5 pl-9 text-gray-900 shadow-xs ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset focus:ring-primary text-sm">
<div class="absolute inset-y-0 left-0 flex items-center pl-2.5 pointer-events-none">
{{ icon('search', 'w-4 h-4 text-gray-500') }}
</div>
@@ -1,4 +1,4 @@
<div id="loading-indicator"
class="invisible fixed top-0 left-0 inset-0 z-[60] backdrop-blur-sm flex items-center justify-center transition-all duration-100">
class="invisible fixed top-0 left-0 inset-0 z-[60] backdrop-blur-xs flex items-center justify-center transition-all duration-100">
{% include '_partials/_spinner.html.twig' %}
</div>
+1 -1
View File
@@ -1,5 +1,5 @@
<div class="fixed inset-0 w-full h-full z-50" {{ stimulus_controller('modal') }} {{ stimulus_action('modal', 'close', 'modal-close@window') }}>
<div class="absolute inset-0 backdrop-blur-sm" {{ stimulus_action('modal', 'close', 'click') }}></div>
<div class="absolute inset-0 backdrop-blur-xs" {{ stimulus_action('modal', 'close', 'click') }}></div>
<div class="absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 px-4 w-full max-w-3xl">
<div class="{{ html_classes('relative py-4 rounded-md', { 'bg-red-500': level == 'error', 'bg-green-500': level == 'success', 'bg-yellow-500': level == 'warning', 'bg-primary-light': level == 'info' }) }}">
<div class="flex justify-between pb-4 px-4">
@@ -21,7 +21,7 @@
<div class="py-4" id="participant-card-{{ index }}">
<div class="flex items-start space-x-4">
<div class="{{ html_classes('w-12 h-12 inline-flex flex-shrink-0 items-center justify-center rounded-full font-bold', {
<div class="{{ html_classes('w-12 h-12 inline-flex shrink-0 items-center justify-center rounded-full font-bold', {
'text-white': not showAsAttention,
'bg-yellow-500': showAsAttention,
'bg-primary-dark': not showAsError and not showAsAttention and booking_theme() == 'base',
@@ -152,7 +152,7 @@
{% import _self as macros %}
<div class="flex items-center gap-4 pb-4 mb-4 border-b border-primary-bg">
<div class="{{ html_classes('w-12 h-12 inline-flex flex-shrink-0 items-center justify-center rounded-full text-white text-2xl font-bold', {
<div class="{{ html_classes('w-12 h-12 inline-flex shrink-0 items-center justify-center rounded-full text-white text-2xl font-bold', {
'bg-primary-dark': booking_theme() == 'base',
'bg-sbw-primary': booking_theme() == 'sbw',
'bg-snz-primary-dark': booking_theme() == 'snz',
@@ -365,7 +365,7 @@
{{ form_errors(form.board) }}
{% endif %}
<div class="text-sm mt-2 px-2 flex items-start space-x-1">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5 flex-shrink-0">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5 shrink-0">
<path stroke-linecap="round" stroke-linejoin="round" d="M11.25 11.25l.041-.02a.75.75 0 011.063.852l-.708 2.836a.75.75 0 001.063.853l.041-.021M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9-3.75h.008v.008H12V8.25z" />
</svg>
<span>Bitte teile uns eventuelle Unverträglichkeiten an <a href="mailto:{{ customer_service_email }}" class="text-primary-light hover:underline">{{ customer_service_email }}</a> (inkl. der Buchungsnummer) mit.</span>
@@ -425,7 +425,7 @@
{{ form_help(form.rentals) }}
{% if is_travel_start_cutoff_reached(bookingDto) %}
<div class="text-sm mt-2 px-2 flex items-start space-x-1">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5 flex-shrink-0">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5 shrink-0">
<path stroke-linecap="round" stroke-linejoin="round" d="M11.25 11.25l.041-.02a.75.75 0 011.063.852l-.708 2.836a.75.75 0 001.063.853l.041-.021M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9-3.75h.008v.008H12V8.25z" />
</svg>
<span>Online nicht mehr buchbar. Bitte direkt über die <strong>Hausleitung vor Ort</strong> anfragen (vorbehaltlich Verfügbarkeit)</span>
@@ -440,7 +440,7 @@
{{ form_row(form.bodyDimensions.shoeSize) }}
{{ form_row(form.bodyDimensions.weight) }}
<div class="lg:col-span-3 text-sm -mt-2 px-2 flex items-start space-x-1">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5 flex-shrink-0">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5 shrink-0">
<path stroke-linecap="round" stroke-linejoin="round" d="M11.25 11.25l.041-.02a.75.75 0 011.063.852l-.708 2.836a.75.75 0 001.063.853l.041-.021M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9-3.75h.008v.008H12V8.25z" />
</svg>
<span>{{ form.bodyDimensions.vars.help }}</span>
@@ -590,7 +590,7 @@
{{ form_errors(form.insurance) }}
{{ form_help(form.insurance) }}
<div class="text-sm mt-2 px-2 flex items-start space-x-1">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5 flex-shrink-0">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5 shrink-0">
<path stroke-linecap="round" stroke-linejoin="round" d="M11.25 11.25l.041-.02a.75.75 0 011.063.852l-.708 2.836a.75.75 0 001.063.853l.041-.021M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9-3.75h.008v.008H12V8.25z" />
</svg>
<span>Eine Versicherung kann nur abgeschlossen werden, wenn Dein Wohnsitz in Deutschland ist.</span>
+1 -1
View File
@@ -59,7 +59,7 @@
{# No form_start here: this sits inside the step 2 form and nested
form tags are invalid. htmx posts the inputs enclosed below,
including the CSRF token, to the toggle route. #}
<div class="mb-6 rounded border border-gray-200 bg-white p-4"
<div class="mb-6 rounded-sm border border-gray-200 bg-white p-4"
hx-post="{{ path('app_booking_create_step_2_applicant_toggle') }}"
hx-trigger="change"
hx-include="this"
+1 -1
View File
@@ -57,7 +57,7 @@
{{ form_row(form.bankAccount.accountHolder) }}
{{ form_row(form.bankAccount.bankName) }}
<div class="mt-6 p-4 bg-blue-50 border border-blue-200 rounded">
<div class="mt-6 p-4 bg-blue-50 border border-blue-200 rounded-sm">
{{ form_row(form.bankAccount.sepaMandateAccepted, {
'label_attr': {'class': 'text-sm'}
}) }}
+1 -1
View File
@@ -17,7 +17,7 @@
{% for booking in bookings %}
<div class="grid md:grid-cols-2 gap-4 p-2 bg-white rounded-md">
<div class="flex items-start space-x-4">
<div class="w-12 h-12 inline-flex flex-shrink-0 items-center justify-center rounded-full bg-primary-dark text-white text-2xl font-bold">
<div class="w-12 h-12 inline-flex shrink-0 items-center justify-center rounded-full bg-primary-dark text-white text-2xl font-bold">
{{ loop.index }}
</div>
<div class="text-xl font-semibold">
@@ -1,6 +1,6 @@
<div class="relative inline-block text-left group cursor-pointer">
<button type="button"
class="flex items-center text-gray-400 hover:text-gray-600 focus:outline-none focus:ring-0"
class="flex items-center text-gray-400 hover:text-gray-600 focus:outline-hidden focus:ring-0"
aria-expanded="true"
aria-haspopup="true">
<span class="sr-only">Funktionen</span>
@@ -11,7 +11,7 @@
aria-orientation="vertical"
aria-labelledby="menu-button"
tabindex="-1">
<div class="rounded-md bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none">
<div class="rounded-md bg-white shadow-lg ring-1 ring-black/5 focus:outline-hidden">
<div class="py-1 menu menu--pulldown" role="none">
{% block content %}{% endblock %}
</div>
+1 -1
View File
@@ -286,7 +286,7 @@
{{- form_widget(child, {'attr': child_attr}) -}}
{% if not loop.last %}
<span class="block flex-shrink-0">.</span>
<span class="block shrink-0">.</span>
{% endif %}
{%- endfor -%}
</div>
+6 -6
View File
@@ -35,7 +35,7 @@
{%- block form_widget_simple -%}
{%- set type = type|default('text') -%}
{%- if type != 'hidden' -%}
{%- set attr = attr|merge({'class': (attr.class|default('') ~ ' block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset text-sm')|trim }) -%}
{%- set attr = attr|merge({'class': (attr.class|default('') ~ ' block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-xs ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset text-sm')|trim }) -%}
{%- if errors|length -%}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' ring-red-500 placeholder-red-500 focus:ring-red-500' }) -%}
{% else %}
@@ -49,7 +49,7 @@
{%- endblock form_widget_simple -%}
{%- block textarea_widget -%}
{%- set attr = attr|merge({'class': (attr.class|default('') ~ ' block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset text-sm')|trim }) -%}
{%- set attr = attr|merge({'class': (attr.class|default('') ~ ' block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-xs ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset text-sm')|trim }) -%}
{%- if errors|length -%}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' ring-red-500 placeholder-red-500 focus:ring-red-500' }) -%}
{% else %}
@@ -62,7 +62,7 @@
{%- endblock textarea_widget -%}
{%- block checkbox_widget -%}
{%- set attr = attr|merge({'class': (attr.class|default('') ~ ' h-4 w-4 rounded text-primary')|trim }) -%}
{%- set attr = attr|merge({'class': (attr.class|default('') ~ ' h-4 w-4 rounded-sm text-primary')|trim }) -%}
{%- if errors|length -%}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' border-red-500 text-red-500 ring-red-500 focus:ring-red-500' }) -%}
{% else %}
@@ -89,7 +89,7 @@
{% endblock %}
{%- block choice_widget_collapsed -%}
{%- set attr = attr|merge({'class': (attr.class|default('') ~ ' block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset text-sm')|trim }) -%}
{%- set attr = attr|merge({'class': (attr.class|default('') ~ ' block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-xs ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset text-sm')|trim }) -%}
{%- if errors|length -%}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' ring-red-500 placeholder-red-500 focus:ring-red-500' }) -%}
{% else %}
@@ -154,7 +154,7 @@
{%- set minDate = form.vars.min_date ? form.vars.min_date | date('Y-m-d') : null -%}
{%- set maxDate = form.vars.max_date ? form.vars.max_date | date('Y-m-d') : null -%}
{%- set displayValue = value ? value|date('d.m.Y') : '' -%}
{%- set inputClass = 'block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset text-sm' -%}
{%- set inputClass = 'block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-xs ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset text-sm' -%}
{%- if errors|length -%}
{%- set inputClass = inputClass ~ ' ring-red-500 placeholder:red-500 focus:ring-red-500' -%}
{%- else -%}
@@ -181,7 +181,7 @@
{%- endblock datepicker_widget %}
{%- block autocomplete_widget -%}
{%- set attr = attr|merge({'class': (attr.class|default('') ~ ' autocomplete-input block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset text-sm')|trim }) -%}
{%- set attr = attr|merge({'class': (attr.class|default('') ~ ' autocomplete-input block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-xs ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset text-sm')|trim }) -%}
{%- if errors|length -%}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' ring-red-500 placeholder-red-500 focus:ring-red-500' }) -%}
{% else %}
+1 -1
View File
@@ -1,6 +1,6 @@
<div id="htmx-modal"
class="fixed inset-0 w-full h-full z-50" {{ stimulus_controller('modal') }} {{ stimulus_action('modal', 'close', 'modal-close@window') }}>
<div class="absolute inset-0 w-full h-full bg-gray-300/50 backdrop-blur-sm" {{ stimulus_action('modal', 'close', 'click') }}></div>
<div class="absolute inset-0 w-full h-full bg-gray-300/50 backdrop-blur-xs" {{ stimulus_action('modal', 'close', 'click') }}></div>
<div class="absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 px-4 w-full max-w-3xl">
<div class="relative bg-white py-8 rounded-md shadow-lg">
<div class="flex justify-between pb-4 px-8">
+1 -1
View File
@@ -23,7 +23,7 @@
{% if voucherThumbnail %}
<img src="{{ asset(voucherThumbnail) }}"
alt="Motiv {{ voucher.template.label }}"
class="block w-full max-w-sm h-auto mb-4 shadow">
class="block w-full max-w-sm h-auto mb-4 shadow-sm">
{% endif %}
<div class="border border-primary-bg mb-4">