mirror of
https://github.com/anna-sara/filament_inventory
synced 2026-09-03 11:14:43 +02:00
Update to Tailwind CSS 4
This commit is contained in:
parent
fed392164e
commit
8c777ae294
22 changed files with 754 additions and 1612 deletions
2219
package-lock.json
generated
2219
package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
|
@ -9,15 +9,15 @@
|
||||||
"@headlessui/react": "^2.0.0",
|
"@headlessui/react": "^2.0.0",
|
||||||
"@inertiajs/react": "^2.0.0",
|
"@inertiajs/react": "^2.0.0",
|
||||||
"@tailwindcss/forms": "^0.5.3",
|
"@tailwindcss/forms": "^0.5.3",
|
||||||
|
"@tailwindcss/postcss": "^4.3.0",
|
||||||
"@vitejs/plugin-react": "^4.2.0",
|
"@vitejs/plugin-react": "^4.2.0",
|
||||||
"autoprefixer": "^10.4.12",
|
|
||||||
"axios": "^1.7.4",
|
"axios": "^1.7.4",
|
||||||
"concurrently": "^9.0.1",
|
"concurrently": "^9.0.1",
|
||||||
"laravel-vite-plugin": "^1.0",
|
"laravel-vite-plugin": "^1.0",
|
||||||
"postcss": "^8.4.31",
|
"postcss": "^8.4.31",
|
||||||
"react": "^18.2.0",
|
"react": "^18.2.0",
|
||||||
"react-dom": "^18.2.0",
|
"react-dom": "^18.2.0",
|
||||||
"tailwindcss": "^3.2.1",
|
"tailwindcss": "^4.3.0",
|
||||||
"vite": "^6.0"
|
"vite": "^6.0"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,5 @@
|
||||||
export default {
|
export default {
|
||||||
plugins: {
|
plugins: {
|
||||||
tailwindcss: {},
|
'@tailwindcss/postcss': {},
|
||||||
autoprefixer: {},
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,33 @@
|
||||||
@tailwind base;
|
@import 'tailwindcss';
|
||||||
@tailwind components;
|
|
||||||
@tailwind utilities;
|
|
||||||
|
|
||||||
|
@plugin '@tailwindcss/forms';
|
||||||
|
|
||||||
|
@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
|
||||||
|
@source '../../storage/framework/views/*.php';
|
||||||
|
|
||||||
|
@theme {
|
||||||
|
--font-sans:
|
||||||
|
Figtree, ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji',
|
||||||
|
'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
The default border color has changed to `currentcolor` in Tailwind CSS v4,
|
||||||
|
so we've added these compatibility styles to make sure everything still
|
||||||
|
looks the same as it did with Tailwind CSS v3.
|
||||||
|
|
||||||
|
If we ever want to remove these styles, we need to add an explicit border
|
||||||
|
color utility to any element that depends on these defaults.
|
||||||
|
*/
|
||||||
|
@layer base {
|
||||||
|
*,
|
||||||
|
::after,
|
||||||
|
::before,
|
||||||
|
::backdrop,
|
||||||
|
::file-selector-button {
|
||||||
|
border-color: var(--color-gray-200, currentcolor);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
#reserve-form-container {
|
#reserve-form-container {
|
||||||
max-width: 1400px !important;
|
max-width: 1400px !important;
|
||||||
|
|
|
||||||
|
|
@ -4,7 +4,7 @@ export default function Checkbox({ className = '', ...props }) {
|
||||||
{...props}
|
{...props}
|
||||||
type="checkbox"
|
type="checkbox"
|
||||||
className={
|
className={
|
||||||
'rounded border-gray-300 text-indigo-600 shadow-sm focus:ring-indigo-500 ' +
|
'rounded-sm border-gray-300 text-indigo-600 shadow-xs focus:ring-indigo-500 ' +
|
||||||
className
|
className
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,7 @@ export default function DangerButton({
|
||||||
<button
|
<button
|
||||||
{...props}
|
{...props}
|
||||||
className={
|
className={
|
||||||
`inline-flex items-center rounded-md border border-transparent bg-red-600 px-4 py-2 text-xs font-semibold uppercase tracking-widest text-white transition duration-150 ease-in-out hover:bg-red-500 focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-2 active:bg-red-700 ${
|
`inline-flex items-center rounded-md border border-transparent bg-red-600 px-4 py-2 text-xs font-semibold uppercase tracking-widest text-white transition duration-150 ease-in-out hover:bg-red-500 focus:outline-hidden focus:ring-2 focus:ring-red-500 focus:ring-offset-2 active:bg-red-700 ${
|
||||||
disabled && 'opacity-25'
|
disabled && 'opacity-25'
|
||||||
} ` + className
|
} ` + className
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -46,9 +46,9 @@ const Content = ({
|
||||||
let alignmentClasses = 'origin-top';
|
let alignmentClasses = 'origin-top';
|
||||||
|
|
||||||
if (align === 'left') {
|
if (align === 'left') {
|
||||||
alignmentClasses = 'ltr:origin-top-left rtl:origin-top-right start-0';
|
alignmentClasses = 'ltr:origin-top-left rtl:origin-top-right inset-s-0';
|
||||||
} else if (align === 'right') {
|
} else if (align === 'right') {
|
||||||
alignmentClasses = 'ltr:origin-top-right rtl:origin-top-left end-0';
|
alignmentClasses = 'ltr:origin-top-right rtl:origin-top-left inset-e-0';
|
||||||
}
|
}
|
||||||
|
|
||||||
let widthClasses = '';
|
let widthClasses = '';
|
||||||
|
|
@ -91,7 +91,7 @@ const DropdownLink = ({ className = '', children, ...props }) => {
|
||||||
<Link
|
<Link
|
||||||
{...props}
|
{...props}
|
||||||
className={
|
className={
|
||||||
'block w-full px-4 py-2 text-start text-sm leading-5 text-gray-700 transition duration-150 ease-in-out hover:bg-gray-100 focus:bg-gray-100 focus:outline-none ' +
|
'block w-full px-4 py-2 text-start text-sm leading-5 text-gray-700 transition duration-150 ease-in-out hover:bg-gray-100 focus:bg-gray-100 focus:outline-hidden ' +
|
||||||
className
|
className
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,7 @@ export default function NavLink({
|
||||||
<Link
|
<Link
|
||||||
{...props}
|
{...props}
|
||||||
className={
|
className={
|
||||||
'inline-flex items-center border-b-2 px-1 pt-1 text-sm font-medium leading-5 transition duration-150 ease-in-out focus:outline-none ' +
|
'inline-flex items-center border-b-2 px-1 pt-1 text-sm font-medium leading-5 transition duration-150 ease-in-out focus:outline-hidden ' +
|
||||||
(active
|
(active
|
||||||
? 'border-indigo-400 text-gray-900 focus:border-indigo-700'
|
? 'border-indigo-400 text-gray-900 focus:border-indigo-700'
|
||||||
: 'border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 focus:border-gray-300 focus:text-gray-700') +
|
: 'border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 focus:border-gray-300 focus:text-gray-700') +
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,7 @@ export default function PrimaryButton({
|
||||||
<button
|
<button
|
||||||
{...props}
|
{...props}
|
||||||
className={
|
className={
|
||||||
`inline-flex items-center rounded-md border border-transparent bg-gray-800 px-4 py-2 text-xs font-semibold uppercase tracking-widest text-white transition duration-150 ease-in-out hover:bg-gray-700 focus:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 active:bg-gray-900 ${
|
`inline-flex items-center rounded-md border border-transparent bg-gray-800 px-4 py-2 text-xs font-semibold uppercase tracking-widest text-white transition duration-150 ease-in-out hover:bg-gray-700 focus:bg-gray-700 focus:outline-hidden focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 active:bg-gray-900 ${
|
||||||
disabled && 'opacity-25'
|
disabled && 'opacity-25'
|
||||||
} ` + className
|
} ` + className
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -13,7 +13,7 @@ export default function ResponsiveNavLink({
|
||||||
active
|
active
|
||||||
? 'border-indigo-400 bg-indigo-50 text-indigo-700 focus:border-indigo-700 focus:bg-indigo-100 focus:text-indigo-800'
|
? 'border-indigo-400 bg-indigo-50 text-indigo-700 focus:border-indigo-700 focus:bg-indigo-100 focus:text-indigo-800'
|
||||||
: 'border-transparent text-gray-600 hover:border-gray-300 hover:bg-gray-50 hover:text-gray-800 focus:border-gray-300 focus:bg-gray-50 focus:text-gray-800'
|
: 'border-transparent text-gray-600 hover:border-gray-300 hover:bg-gray-50 hover:text-gray-800 focus:border-gray-300 focus:bg-gray-50 focus:text-gray-800'
|
||||||
} text-base font-medium transition duration-150 ease-in-out focus:outline-none ${className}`}
|
} text-base font-medium transition duration-150 ease-in-out focus:outline-hidden ${className}`}
|
||||||
>
|
>
|
||||||
{children}
|
{children}
|
||||||
</Link>
|
</Link>
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,7 @@ export default function SecondaryButton({
|
||||||
{...props}
|
{...props}
|
||||||
type={type}
|
type={type}
|
||||||
className={
|
className={
|
||||||
`inline-flex items-center rounded-md border border-gray-300 bg-white px-4 py-2 text-xs font-semibold uppercase tracking-widest text-gray-700 shadow-sm transition duration-150 ease-in-out hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 disabled:opacity-25 ${
|
`inline-flex items-center rounded-md border border-gray-300 bg-white px-4 py-2 text-xs font-semibold uppercase tracking-widest text-gray-700 shadow-xs transition duration-150 ease-in-out hover:bg-gray-50 focus:outline-hidden focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 disabled:opacity-25 ${
|
||||||
disabled && 'opacity-25'
|
disabled && 'opacity-25'
|
||||||
} ` + className
|
} ` + className
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -21,7 +21,7 @@ export default forwardRef(function TextInput(
|
||||||
{...props}
|
{...props}
|
||||||
type={type}
|
type={type}
|
||||||
className={
|
className={
|
||||||
'rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 ' +
|
'rounded-md border-gray-300 shadow-xs focus:border-indigo-500 focus:ring-indigo-500 ' +
|
||||||
className
|
className
|
||||||
}
|
}
|
||||||
ref={localRef}
|
ref={localRef}
|
||||||
|
|
|
||||||
|
|
@ -40,7 +40,7 @@ export default function AuthenticatedLayout({ header, children }) {
|
||||||
<span className="inline-flex rounded-md">
|
<span className="inline-flex rounded-md">
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
className="inline-flex items-center rounded-md border border-transparent bg-white px-3 py-2 text-sm font-medium leading-4 text-gray-500 transition duration-150 ease-in-out hover:text-gray-700 focus:outline-none"
|
className="inline-flex items-center rounded-md border border-transparent bg-white px-3 py-2 text-sm font-medium leading-4 text-gray-500 transition duration-150 ease-in-out hover:text-gray-700 focus:outline-hidden"
|
||||||
>
|
>
|
||||||
{user.name}
|
{user.name}
|
||||||
|
|
||||||
|
|
@ -85,7 +85,7 @@ export default function AuthenticatedLayout({ header, children }) {
|
||||||
(previousState) => !previousState,
|
(previousState) => !previousState,
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
className="inline-flex items-center justify-center rounded-md p-2 text-gray-400 transition duration-150 ease-in-out hover:bg-gray-100 hover:text-gray-500 focus:bg-gray-100 focus:text-gray-500 focus:outline-none"
|
className="inline-flex items-center justify-center rounded-md p-2 text-gray-400 transition duration-150 ease-in-out hover:bg-gray-100 hover:text-gray-500 focus:bg-gray-100 focus:text-gray-500 focus:outline-hidden"
|
||||||
>
|
>
|
||||||
<svg
|
<svg
|
||||||
className="h-6 w-6"
|
className="h-6 w-6"
|
||||||
|
|
@ -163,7 +163,7 @@ export default function AuthenticatedLayout({ header, children }) {
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
{header && (
|
{header && (
|
||||||
<header className="bg-white shadow">
|
<header className="bg-white shadow-sm">
|
||||||
<div className="mx-auto max-w-7xl px-4 py-6 sm:px-6 lg:px-8">
|
<div className="mx-auto max-w-7xl px-4 py-6 sm:px-6 lg:px-8">
|
||||||
{header}
|
{header}
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -84,7 +84,7 @@ export default function Login({ status, canResetPassword }) {
|
||||||
{canResetPassword && (
|
{canResetPassword && (
|
||||||
<Link
|
<Link
|
||||||
href={route('password.request')}
|
href={route('password.request')}
|
||||||
className="rounded-md text-sm text-gray-600 underline hover:text-gray-900 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
|
className="rounded-md text-sm text-gray-600 underline hover:text-gray-900 focus:outline-hidden focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
|
||||||
>
|
>
|
||||||
Forgot your password?
|
Forgot your password?
|
||||||
</Link>
|
</Link>
|
||||||
|
|
|
||||||
|
|
@ -105,7 +105,7 @@ export default function Register() {
|
||||||
<div className="mt-4 flex items-center justify-end">
|
<div className="mt-4 flex items-center justify-end">
|
||||||
<Link
|
<Link
|
||||||
href={route('login')}
|
href={route('login')}
|
||||||
className="rounded-md text-sm text-gray-600 underline hover:text-gray-900 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
|
className="rounded-md text-sm text-gray-600 underline hover:text-gray-900 focus:outline-hidden focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
|
||||||
>
|
>
|
||||||
Already registered?
|
Already registered?
|
||||||
</Link>
|
</Link>
|
||||||
|
|
|
||||||
|
|
@ -39,7 +39,7 @@ export default function VerifyEmail({ status }) {
|
||||||
href={route('logout')}
|
href={route('logout')}
|
||||||
method="post"
|
method="post"
|
||||||
as="button"
|
as="button"
|
||||||
className="rounded-md text-sm text-gray-600 underline hover:text-gray-900 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
|
className="rounded-md text-sm text-gray-600 underline hover:text-gray-900 focus:outline-hidden focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
|
||||||
>
|
>
|
||||||
Log Out
|
Log Out
|
||||||
</Link>
|
</Link>
|
||||||
|
|
|
||||||
|
|
@ -14,7 +14,7 @@ export default function Dashboard() {
|
||||||
|
|
||||||
<div className="py-12">
|
<div className="py-12">
|
||||||
<div className="mx-auto max-w-7xl sm:px-6 lg:px-8">
|
<div className="mx-auto max-w-7xl sm:px-6 lg:px-8">
|
||||||
<div className="overflow-hidden bg-white shadow-sm sm:rounded-lg">
|
<div className="overflow-hidden bg-white shadow-xs sm:rounded-lg">
|
||||||
<div className="p-6 text-gray-900">
|
<div className="p-6 text-gray-900">
|
||||||
You're logged in!
|
You're logged in!
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -17,7 +17,7 @@ export default function Edit({ mustVerifyEmail, status }) {
|
||||||
|
|
||||||
<div className="py-12">
|
<div className="py-12">
|
||||||
<div className="mx-auto max-w-7xl space-y-6 sm:px-6 lg:px-8">
|
<div className="mx-auto max-w-7xl space-y-6 sm:px-6 lg:px-8">
|
||||||
<div className="bg-white p-4 shadow sm:rounded-lg sm:p-8">
|
<div className="bg-white p-4 shadow-sm sm:rounded-lg sm:p-8">
|
||||||
<UpdateProfileInformationForm
|
<UpdateProfileInformationForm
|
||||||
mustVerifyEmail={mustVerifyEmail}
|
mustVerifyEmail={mustVerifyEmail}
|
||||||
status={status}
|
status={status}
|
||||||
|
|
@ -25,11 +25,11 @@ export default function Edit({ mustVerifyEmail, status }) {
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="bg-white p-4 shadow sm:rounded-lg sm:p-8">
|
<div className="bg-white p-4 shadow-sm sm:rounded-lg sm:p-8">
|
||||||
<UpdatePasswordForm className="max-w-xl" />
|
<UpdatePasswordForm className="max-w-xl" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="bg-white p-4 shadow sm:rounded-lg sm:p-8">
|
<div className="bg-white p-4 shadow-sm sm:rounded-lg sm:p-8">
|
||||||
<DeleteUserForm className="max-w-xl" />
|
<DeleteUserForm className="max-w-xl" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -77,7 +77,7 @@ export default function UpdateProfileInformation({
|
||||||
href={route('verification.send')}
|
href={route('verification.send')}
|
||||||
method="post"
|
method="post"
|
||||||
as="button"
|
as="button"
|
||||||
className="rounded-md text-sm text-gray-600 underline hover:text-gray-900 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
|
className="rounded-md text-sm text-gray-600 underline hover:text-gray-900 focus:outline-hidden focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
|
||||||
>
|
>
|
||||||
Click here to re-send the verification email.
|
Click here to re-send the verification email.
|
||||||
</Link>
|
</Link>
|
||||||
|
|
|
||||||
|
|
@ -4,12 +4,12 @@ export default function Welcome({ auth, laravelVersion, phpVersion }) {
|
||||||
const handleImageError = () => {
|
const handleImageError = () => {
|
||||||
document
|
document
|
||||||
.getElementById('screenshot-container')
|
.getElementById('screenshot-container')
|
||||||
?.classList.add('!hidden');
|
?.classList.add('hidden!');
|
||||||
document.getElementById('docs-card')?.classList.add('!row-span-1');
|
document.getElementById('docs-card')?.classList.add('row-span-1!');
|
||||||
document
|
document
|
||||||
.getElementById('docs-card-content')
|
.getElementById('docs-card-content')
|
||||||
?.classList.add('!flex-row');
|
?.classList.add('flex-row!');
|
||||||
document.getElementById('background')?.classList.add('!hidden');
|
document.getElementById('background')?.classList.add('hidden!');
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
@ -41,7 +41,7 @@ export default function Welcome({ auth, laravelVersion, phpVersion }) {
|
||||||
{auth.user ? (
|
{auth.user ? (
|
||||||
<Link
|
<Link
|
||||||
href={route('dashboard')}
|
href={route('dashboard')}
|
||||||
className="rounded-md px-3 py-2 text-black ring-1 ring-transparent transition hover:text-black/70 focus:outline-none focus-visible:ring-[#FF2D20] dark:text-white dark:hover:text-white/80 dark:focus-visible:ring-white"
|
className="rounded-md px-3 py-2 text-black ring-1 ring-transparent transition hover:text-black/70 focus:outline-hidden focus-visible:ring-[#FF2D20] dark:text-white dark:hover:text-white/80 dark:focus-visible:ring-white"
|
||||||
>
|
>
|
||||||
Dashboard
|
Dashboard
|
||||||
</Link>
|
</Link>
|
||||||
|
|
@ -49,13 +49,13 @@ export default function Welcome({ auth, laravelVersion, phpVersion }) {
|
||||||
<>
|
<>
|
||||||
<Link
|
<Link
|
||||||
href={route('login')}
|
href={route('login')}
|
||||||
className="rounded-md px-3 py-2 text-black ring-1 ring-transparent transition hover:text-black/70 focus:outline-none focus-visible:ring-[#FF2D20] dark:text-white dark:hover:text-white/80 dark:focus-visible:ring-white"
|
className="rounded-md px-3 py-2 text-black ring-1 ring-transparent transition hover:text-black/70 focus:outline-hidden focus-visible:ring-[#FF2D20] dark:text-white dark:hover:text-white/80 dark:focus-visible:ring-white"
|
||||||
>
|
>
|
||||||
Log in
|
Log in
|
||||||
</Link>
|
</Link>
|
||||||
<Link
|
<Link
|
||||||
href={route('register')}
|
href={route('register')}
|
||||||
className="rounded-md px-3 py-2 text-black ring-1 ring-transparent transition hover:text-black/70 focus:outline-none focus-visible:ring-[#FF2D20] dark:text-white dark:hover:text-white/80 dark:focus-visible:ring-white"
|
className="rounded-md px-3 py-2 text-black ring-1 ring-transparent transition hover:text-black/70 focus:outline-hidden focus-visible:ring-[#FF2D20] dark:text-white dark:hover:text-white/80 dark:focus-visible:ring-white"
|
||||||
>
|
>
|
||||||
Register
|
Register
|
||||||
</Link>
|
</Link>
|
||||||
|
|
@ -69,7 +69,7 @@ export default function Welcome({ auth, laravelVersion, phpVersion }) {
|
||||||
<a
|
<a
|
||||||
href="https://laravel.com/docs"
|
href="https://laravel.com/docs"
|
||||||
id="docs-card"
|
id="docs-card"
|
||||||
className="flex flex-col items-start gap-6 overflow-hidden rounded-lg bg-white p-6 shadow-[0px_14px_34px_0px_rgba(0,0,0,0.08)] ring-1 ring-white/[0.05] transition duration-300 hover:text-black/70 hover:ring-black/20 focus:outline-none focus-visible:ring-[#FF2D20] md:row-span-3 lg:p-10 lg:pb-10 dark:bg-zinc-900 dark:ring-zinc-800 dark:hover:text-white/70 dark:hover:ring-zinc-700 dark:focus-visible:ring-[#FF2D20]"
|
className="flex flex-col items-start gap-6 overflow-hidden rounded-lg bg-white p-6 shadow-[0px_14px_34px_0px_rgba(0,0,0,0.08)] ring-1 ring-white/5 transition duration-300 hover:text-black/70 hover:ring-black/20 focus:outline-hidden focus-visible:ring-[#FF2D20] md:row-span-3 lg:p-10 lg:pb-10 dark:bg-zinc-900 dark:ring-zinc-800 dark:hover:text-white/70 dark:hover:ring-zinc-700 dark:focus-visible:ring-[#FF2D20]"
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
id="screenshot-container"
|
id="screenshot-container"
|
||||||
|
|
@ -86,7 +86,7 @@ export default function Welcome({ auth, laravelVersion, phpVersion }) {
|
||||||
alt="Laravel documentation screenshot"
|
alt="Laravel documentation screenshot"
|
||||||
className="hidden aspect-video h-full w-full flex-1 rounded-[10px] object-cover object-top drop-shadow-[0px_4px_34px_rgba(0,0,0,0.25)] dark:block"
|
className="hidden aspect-video h-full w-full flex-1 rounded-[10px] object-cover object-top drop-shadow-[0px_4px_34px_rgba(0,0,0,0.25)] dark:block"
|
||||||
/>
|
/>
|
||||||
<div className="absolute -bottom-16 -left-16 h-40 w-[calc(100%+8rem)] bg-gradient-to-b from-transparent via-white to-white dark:via-zinc-900 dark:to-zinc-900"></div>
|
<div className="absolute -bottom-16 -left-16 h-40 w-[calc(100%+8rem)] bg-linear-to-b from-transparent via-white to-white dark:via-zinc-900 dark:to-zinc-900"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="relative flex items-center gap-6 lg:items-end">
|
<div className="relative flex items-center gap-6 lg:items-end">
|
||||||
|
|
@ -148,7 +148,7 @@ export default function Welcome({ auth, laravelVersion, phpVersion }) {
|
||||||
|
|
||||||
<a
|
<a
|
||||||
href="https://laracasts.com"
|
href="https://laracasts.com"
|
||||||
className="flex items-start gap-4 rounded-lg bg-white p-6 shadow-[0px_14px_34px_0px_rgba(0,0,0,0.08)] ring-1 ring-white/[0.05] transition duration-300 hover:text-black/70 hover:ring-black/20 focus:outline-none focus-visible:ring-[#FF2D20] lg:pb-10 dark:bg-zinc-900 dark:ring-zinc-800 dark:hover:text-white/70 dark:hover:ring-zinc-700 dark:focus-visible:ring-[#FF2D20]"
|
className="flex items-start gap-4 rounded-lg bg-white p-6 shadow-[0px_14px_34px_0px_rgba(0,0,0,0.08)] ring-1 ring-white/5 transition duration-300 hover:text-black/70 hover:ring-black/20 focus:outline-hidden focus-visible:ring-[#FF2D20] lg:pb-10 dark:bg-zinc-900 dark:ring-zinc-800 dark:hover:text-white/70 dark:hover:ring-zinc-700 dark:focus-visible:ring-[#FF2D20]"
|
||||||
>
|
>
|
||||||
<div className="flex size-12 shrink-0 items-center justify-center rounded-full bg-[#FF2D20]/10 sm:size-16">
|
<div className="flex size-12 shrink-0 items-center justify-center rounded-full bg-[#FF2D20]/10 sm:size-16">
|
||||||
<svg
|
<svg
|
||||||
|
|
@ -195,7 +195,7 @@ export default function Welcome({ auth, laravelVersion, phpVersion }) {
|
||||||
|
|
||||||
<a
|
<a
|
||||||
href="https://laravel-news.com"
|
href="https://laravel-news.com"
|
||||||
className="flex items-start gap-4 rounded-lg bg-white p-6 shadow-[0px_14px_34px_0px_rgba(0,0,0,0.08)] ring-1 ring-white/[0.05] transition duration-300 hover:text-black/70 hover:ring-black/20 focus:outline-none focus-visible:ring-[#FF2D20] lg:pb-10 dark:bg-zinc-900 dark:ring-zinc-800 dark:hover:text-white/70 dark:hover:ring-zinc-700 dark:focus-visible:ring-[#FF2D20]"
|
className="flex items-start gap-4 rounded-lg bg-white p-6 shadow-[0px_14px_34px_0px_rgba(0,0,0,0.08)] ring-1 ring-white/5 transition duration-300 hover:text-black/70 hover:ring-black/20 focus:outline-hidden focus-visible:ring-[#FF2D20] lg:pb-10 dark:bg-zinc-900 dark:ring-zinc-800 dark:hover:text-white/70 dark:hover:ring-zinc-700 dark:focus-visible:ring-[#FF2D20]"
|
||||||
>
|
>
|
||||||
<div className="flex size-12 shrink-0 items-center justify-center rounded-full bg-[#FF2D20]/10 sm:size-16">
|
<div className="flex size-12 shrink-0 items-center justify-center rounded-full bg-[#FF2D20]/10 sm:size-16">
|
||||||
<svg
|
<svg
|
||||||
|
|
@ -242,7 +242,7 @@ export default function Welcome({ auth, laravelVersion, phpVersion }) {
|
||||||
</svg>
|
</svg>
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<div className="flex items-start gap-4 rounded-lg bg-white p-6 shadow-[0px_14px_34px_0px_rgba(0,0,0,0.08)] ring-1 ring-white/[0.05] lg:pb-10 dark:bg-zinc-900 dark:ring-zinc-800">
|
<div className="flex items-start gap-4 rounded-lg bg-white p-6 shadow-[0px_14px_34px_0px_rgba(0,0,0,0.08)] ring-1 ring-white/5 lg:pb-10 dark:bg-zinc-900 dark:ring-zinc-800">
|
||||||
<div className="flex size-12 shrink-0 items-center justify-center rounded-full bg-[#FF2D20]/10 sm:size-16">
|
<div className="flex size-12 shrink-0 items-center justify-center rounded-full bg-[#FF2D20]/10 sm:size-16">
|
||||||
<svg
|
<svg
|
||||||
className="size-5 sm:size-6"
|
className="size-5 sm:size-6"
|
||||||
|
|
@ -267,35 +267,35 @@ export default function Welcome({ auth, laravelVersion, phpVersion }) {
|
||||||
such as{' '}
|
such as{' '}
|
||||||
<a
|
<a
|
||||||
href="https://forge.laravel.com"
|
href="https://forge.laravel.com"
|
||||||
className="rounded-sm underline hover:text-black focus:outline-none focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white dark:focus-visible:ring-[#FF2D20]"
|
className="rounded-xs underline hover:text-black focus:outline-hidden focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white dark:focus-visible:ring-[#FF2D20]"
|
||||||
>
|
>
|
||||||
Forge
|
Forge
|
||||||
</a>
|
</a>
|
||||||
,{' '}
|
,{' '}
|
||||||
<a
|
<a
|
||||||
href="https://vapor.laravel.com"
|
href="https://vapor.laravel.com"
|
||||||
className="rounded-sm underline hover:text-black focus:outline-none focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
className="rounded-xs underline hover:text-black focus:outline-hidden focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
||||||
>
|
>
|
||||||
Vapor
|
Vapor
|
||||||
</a>
|
</a>
|
||||||
,{' '}
|
,{' '}
|
||||||
<a
|
<a
|
||||||
href="https://nova.laravel.com"
|
href="https://nova.laravel.com"
|
||||||
className="rounded-sm underline hover:text-black focus:outline-none focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
className="rounded-xs underline hover:text-black focus:outline-hidden focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
||||||
>
|
>
|
||||||
Nova
|
Nova
|
||||||
</a>
|
</a>
|
||||||
,{' '}
|
,{' '}
|
||||||
<a
|
<a
|
||||||
href="https://envoyer.io"
|
href="https://envoyer.io"
|
||||||
className="rounded-sm underline hover:text-black focus:outline-none focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
className="rounded-xs underline hover:text-black focus:outline-hidden focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
||||||
>
|
>
|
||||||
Envoyer
|
Envoyer
|
||||||
</a>
|
</a>
|
||||||
, and{' '}
|
, and{' '}
|
||||||
<a
|
<a
|
||||||
href="https://herd.laravel.com"
|
href="https://herd.laravel.com"
|
||||||
className="rounded-sm underline hover:text-black focus:outline-none focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
className="rounded-xs underline hover:text-black focus:outline-hidden focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
||||||
>
|
>
|
||||||
Herd
|
Herd
|
||||||
</a>{' '}
|
</a>{' '}
|
||||||
|
|
@ -304,42 +304,42 @@ export default function Welcome({ auth, laravelVersion, phpVersion }) {
|
||||||
open source libraries like{' '}
|
open source libraries like{' '}
|
||||||
<a
|
<a
|
||||||
href="https://laravel.com/docs/billing"
|
href="https://laravel.com/docs/billing"
|
||||||
className="rounded-sm underline hover:text-black focus:outline-none focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
className="rounded-xs underline hover:text-black focus:outline-hidden focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
||||||
>
|
>
|
||||||
Cashier
|
Cashier
|
||||||
</a>
|
</a>
|
||||||
,{' '}
|
,{' '}
|
||||||
<a
|
<a
|
||||||
href="https://laravel.com/docs/dusk"
|
href="https://laravel.com/docs/dusk"
|
||||||
className="rounded-sm underline hover:text-black focus:outline-none focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
className="rounded-xs underline hover:text-black focus:outline-hidden focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
||||||
>
|
>
|
||||||
Dusk
|
Dusk
|
||||||
</a>
|
</a>
|
||||||
,{' '}
|
,{' '}
|
||||||
<a
|
<a
|
||||||
href="https://laravel.com/docs/broadcasting"
|
href="https://laravel.com/docs/broadcasting"
|
||||||
className="rounded-sm underline hover:text-black focus:outline-none focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
className="rounded-xs underline hover:text-black focus:outline-hidden focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
||||||
>
|
>
|
||||||
Echo
|
Echo
|
||||||
</a>
|
</a>
|
||||||
,{' '}
|
,{' '}
|
||||||
<a
|
<a
|
||||||
href="https://laravel.com/docs/horizon"
|
href="https://laravel.com/docs/horizon"
|
||||||
className="rounded-sm underline hover:text-black focus:outline-none focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
className="rounded-xs underline hover:text-black focus:outline-hidden focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
||||||
>
|
>
|
||||||
Horizon
|
Horizon
|
||||||
</a>
|
</a>
|
||||||
,{' '}
|
,{' '}
|
||||||
<a
|
<a
|
||||||
href="https://laravel.com/docs/sanctum"
|
href="https://laravel.com/docs/sanctum"
|
||||||
className="rounded-sm underline hover:text-black focus:outline-none focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
className="rounded-xs underline hover:text-black focus:outline-hidden focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
||||||
>
|
>
|
||||||
Sanctum
|
Sanctum
|
||||||
</a>
|
</a>
|
||||||
,{' '}
|
,{' '}
|
||||||
<a
|
<a
|
||||||
href="https://laravel.com/docs/telescope"
|
href="https://laravel.com/docs/telescope"
|
||||||
className="rounded-sm underline hover:text-black focus:outline-none focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
className="rounded-xs underline hover:text-black focus:outline-hidden focus-visible:ring-1 focus-visible:ring-[#FF2D20] dark:hover:text-white"
|
||||||
>
|
>
|
||||||
Telescope
|
Telescope
|
||||||
</a>
|
</a>
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
|
|
||||||
|
|
||||||
<div id="reserve-form-container">
|
<div id="reserve-form-container">
|
||||||
<nav class="py-2 flex h-16 items-center align-items gap-x-4 bg-white px-4 shadow-sm ring-1 ring-gray-950/5 dark:bg-gray-900 dark:ring-white/10 md:px-6 lg:px-8">
|
<nav class="py-2 flex h-16 items-center align-items gap-x-4 bg-white px-4 shadow-xs ring-1 ring-gray-950/5 dark:bg-gray-900 dark:ring-white/10 md:px-6 lg:px-8">
|
||||||
<img class=" w-auto h-full" src="/img/logo.png" alt="logo">
|
<img class=" w-auto h-full" src="/img/logo.png" alt="logo">
|
||||||
<h1 class="fi-logo flex text-xl font-bold leading-5 tracking-tight text-gray-950 dark:text-white">vBytes</h1>
|
<h1 class="fi-logo flex text-xl font-bold leading-5 tracking-tight text-gray-950 dark:text-white">vBytes</h1>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
|
||||||
|
|
@ -1,22 +0,0 @@
|
||||||
import defaultTheme from 'tailwindcss/defaultTheme';
|
|
||||||
import forms from '@tailwindcss/forms';
|
|
||||||
|
|
||||||
/** @type {import('tailwindcss').Config} */
|
|
||||||
export default {
|
|
||||||
content: [
|
|
||||||
'./vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php',
|
|
||||||
'./storage/framework/views/*.php',
|
|
||||||
'./resources/views/**/*.blade.php',
|
|
||||||
'./resources/js/**/*.jsx',
|
|
||||||
],
|
|
||||||
|
|
||||||
theme: {
|
|
||||||
extend: {
|
|
||||||
fontFamily: {
|
|
||||||
sans: ['Figtree', ...defaultTheme.fontFamily.sans],
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
plugins: [forms],
|
|
||||||
};
|
|
||||||
Loading…
Reference in a new issue