tomru/pfadi-bussle
1
0
Fork 0
mirror of https://github.com/tomru/pfadi-bussle.git synced 2026-03-02 22:17:11 +01:00
Code Issues Packages Projects Releases Wiki Activity

update tailwindcss@4

Browse Source
This commit is contained in:
Thomas Ruoff
2025-03-30 22:29:15 +02:00
parent d2b418f238
commit 9a2052fcaa
16 changed files with 488 additions and 2799 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
components/book/index.tsx
View File

@@ -39,7 +39,7 @@ function BookForm() {
<Contact />
<div className="mb-3">
<label className="form-check-label inline-block text-gray-800 cursor-pointer" htmlFor="termsAgreed">
<input className="form-check-input h-4 w-4 border border-gray-300 rounded-sm bg-white checked:bg-blue-600 checked:border-blue-600 focus:outline-none transition duration-200 mt-1 align-top bg-no-repeat bg-center bg-contain float-left mr-2 cursor-pointer" type="checkbox" value="" id="termsAgreed" name="termsAgreed" required onChange={onChangeEvent} />
<input className="form-check-input h-4 w-4 border border-gray-300 rounded-xs bg-white checked:bg-blue-600 checked:border-blue-600 focus:outline-hidden transition duration-200 mt-1 align-top bg-no-repeat bg-center bg-contain float-left mr-2 cursor-pointer" type="checkbox" value="" id="termsAgreed" name="termsAgreed" required onChange={onChangeEvent} />
Ich stimme den <Link href="./terms" target="_blank" className="underline hover:text-blue-700">Mietbedingungen</Link> zu <Required />
</label>
</div>
@@ -48,7 +48,7 @@ function BookForm() {
{postData ? 'Speichern...' : 'Absenden'}
</Button>
{postDataError && (
<div className="error-message flex-grow">{postDataError}</div>
<div className="error-message grow">{postDataError}</div>
)}
</div>
</form>

2
components/bookingTable.tsx
View File

@@ -37,7 +37,7 @@ export default function BookingTable({ booking }: { booking: IBooking }) {
return (
<div
key={booking.uuid}
className="mt-6 mb-6 bg-white border border-slate-100 shadow overflow-hidden sm:rounded-lg"
className="mt-6 mb-6 bg-white border border-slate-100 shadow-sm overflow-hidden sm:rounded-lg"
>
<div className="px-4 py-5 sm:px-6">
<h3 className="text-lg leading-6 font-medium text-gray-900">

4
components/calendar.tsx
View File

@@ -145,11 +145,11 @@ export default function MyCalendar({
</Loading>
<div className="mt-3 flex justify-center">
<div>
<div className="inline-block w-5 h-5 bg-green-200 rounded align-text-bottom"></div>
<div className="inline-block w-5 h-5 bg-green-200 rounded-sm align-text-bottom"></div>
<span className="ml-2">Frei</span>
</div>
<div>
<div className="ml-6 inline-block w-5 h-5 bg-red-200 rounded align-text-bottom"></div>
<div className="ml-6 inline-block w-5 h-5 bg-red-200 rounded-sm align-text-bottom"></div>
<span className="ml-2">Belegt</span>
</div>
</div>

2
components/footer.tsx
View File

@@ -6,7 +6,7 @@ export default function Footer() {
return (
<footer>
<div className="flex flex-col sm:flex-row max-w-7xl mx-auto px-4 sm:px-6 my-5">
<div className="flex-grow">
<div className="grow">
<Link href="/" className="underline">
<Logo className="h-12 w-auto sm:h-14" />
</Link>

2
components/input.tsx
View File

@@ -17,7 +17,7 @@ export default function Input(props: InputProps) {
} = props
const defaultClasses =
'appearance-none bg-gray-50 text-gray-500 border rounded py-2 px-3 mb-3 leading-tight disabled:bg-gray-200 disabled:cursor-not-allowed focus: outline-none focus:bg-white w-full'
'appearance-none bg-gray-50 text-gray-500 border rounded-sm py-2 px-3 mb-3 leading-tight disabled:bg-gray-200 disabled:cursor-not-allowed focus: outline-hidden focus:bg-white w-full'
const classes = `${defaultClasses} ${className}`
return (

2
components/select.tsx
View File

@@ -21,7 +21,7 @@ export default function Select({
</label>
<div className="relative">
<select
className="block appearance-none w-full bg-gray-200 border border-gray-200 text-gray-700 py-3 px-4 pr-8 rounded leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
className="block appearance-none w-full bg-gray-200 border border-gray-200 text-gray-700 py-3 px-4 pr-8 rounded-sm leading-tight focus:outline-hidden focus:bg-white focus:border-gray-500"
id={name}
name={name}
value={value}

2
components/user.tsx
View File

@@ -16,7 +16,7 @@ export default function User() {
>
Admin
</Link>
<div className="font-extrabold bg-red-400 px-2 py-1 mr-3 rounded-sm">
<div className="font-extrabold bg-red-400 px-2 py-1 mr-3 rounded-xs">
{data.user.email}
</div>
<button onClick={() => signOut()} className="btn btn-blue">

3215
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

5
package.json
View File

@@ -33,6 +33,7 @@
"react-dom": "19.1.0"
},
"devDependencies": {
"@tailwindcss/postcss": "^4.0.17",
"@types/nodemailer": "^6.4.17",
"@types/uuid": "10.0.0",
"eslint": "8.57.0",
@@ -40,11 +41,9 @@
"eslint-config-prettier": "9.1.0",
"jest": "29.7.0",
"postcss": "^8.5.3",
"postcss-flexbugs-fixes": "5.0.2",
"postcss-preset-env": "^10.1.5",
"prettier": "3.5.3",
"swr": "2.3.3",
"tailwindcss": "3.4.17",
"tailwindcss": "^4.0.17",
"ts-jest": "29.3.0"
},
"jest": {

2
pages/admin/bookings/[uuid]/index.tsx
View File

@@ -38,7 +38,7 @@ function ShowBookingAdmin({ booking: bookingProp }: { booking: IBooking }) {
<Calendar start={booking.startDate} end={booking.endDate} />
<BookingTable booking={booking} />
{storingBookingError && (
<div className="error-message flex-grow">{storingBookingError}</div>
<div className="error-message grow">{storingBookingError}</div>
)}
<div className="my-6">
<button

2
pages/bookings/[uuid]/index.tsx
View File

@@ -49,7 +49,7 @@ export default function ShowBooking({
<strong>Buchungszeitraum:</strong> {daysFormatFrontend(booking.days)}
</div>
{storingBookingError && (
<div className="error-message flex-grow">{storingBookingError}</div>
<div className="error-message grow">{storingBookingError}</div>
)}
{[BOOKING_STATUS.CONFIRMED, BOOKING_STATUS.REQUESTED].includes(
booking.status

2
pages/index.tsx
View File

@@ -33,7 +33,7 @@ export default function Home() {
</Link>
</p>
<div className="mt-5 sm:mt-8 sm:flex sm:justify-center">
<div className="rounded-md shadow">
<div className="rounded-md shadow-sm">
<Link
href="/book"
className="w-full flex items-center justify-center px-6 py-2 border border-transparent text-base font-medium rounded-md text-white bg-blue-800 hover:bg-blue-900 md:py-2 md:text-lg md:px-5"

18
postcss.config.js
View File

@@ -1,18 +0,0 @@
module.exports = {
plugins: [
'tailwindcss',
'postcss-flexbugs-fixes',
[
'postcss-preset-env',
{
autoprefixer: {
flexbox: 'no-2009',
},
stage: 3,
features: {
'custom-properties': false,
},
},
],
],
}

6
postcss.config.mjs Normal file
View File

@@ -0,0 +1,6 @@
/** @type {import('tailwindcss').Config} */
export default {
plugins: {
'@tailwindcss/postcss': {},
},
}

17
styles/index.css
View File

@@ -1,10 +1,4 @@
@tailwind base;
/* Write your own custom base styles here */
/* Start purging... */
@tailwind components;
/* Stop purging. */
@import 'tailwindcss';
/* Your own custom utilities */
@@ -102,9 +96,11 @@
.react-calendar__navigation button[disabled] {
@apply text-gray-700 cursor-not-allowed;
}
.react-calendar__month-view__weekdays {
@apply text-sm text-center uppercase font-bold;
}
.react-calendar__month-view__weekdays__weekday {
@apply p-1;
}
@@ -116,19 +112,22 @@
.react-calendar__month-view__weekNumbers {
@apply font-bold;
}
.react-calendar__month-view__weekNumbers .react-calendar__tile {
@apply flex items-center content-center;
}
.react-calendar__month-view__days__day--weekend {
@apply text-red-600;
}
.react-calendar__month-view__days__day--neighboringMonth {
@apply text-gray-600;
}
.react-calendar__year-view .react-calendar__tile,
.react-calendar__decade-view .react-calendar__tile,
.react-calendar__century-view .react-calendar__tile {
}
.react-calendar__century-view .react-calendar__tile {}
.react-calendar__tile {
@apply py-1;