mirror of https://github.com/docusealco/docuseal
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
69 lines
2.5 KiB
69 lines
2.5 KiB
@import "tailwindcss";
|
|
|
|
@layer components {
|
|
.pagy {
|
|
/* PagyWand Generated Variables */
|
|
/* Copy from the PagyWand "CSS Override" field, and paste in YOUR own CSS to override the style */
|
|
--B: 1;
|
|
--H: 0;
|
|
--S: 0;
|
|
--L: 50;
|
|
--A: 1;
|
|
--spacing: 0.125rem;
|
|
--padding: 0.75rem;
|
|
--rounding: 1.75rem;
|
|
--border-width: 0rem;
|
|
--font-size: 0.875rem;
|
|
--font-weight: 600;
|
|
--line-height: 1.75;
|
|
|
|
/* Calculated Color Variables */
|
|
--text: hsl(var(--H) var(--S) calc(var(--L) - (25 * var(--B))) / var(--A));
|
|
--text-hover: hsl(var(--H) var(--S) calc(var(--L) - (30 * var(--B))) / var(--A));
|
|
--text-current: hsl(var(--H) var(--S) calc(100 * (var(--B) + 1)) / var(--A));
|
|
--background: hsl(var(--H) var(--S) calc(var(--L) + (30 * var(--B))) / var(--A));
|
|
--background-hover: hsl(var(--H) var(--S) calc(var(--L) + (20 * var(--B))) / var(--A));
|
|
--background-current: hsl(var(--H) var(--S) var(--L) / var(--A));
|
|
--background-input: hsl(var(--H) var(--S) calc(var(--L) + (45 * var(--B))) / var(--A));
|
|
|
|
/* Base Properties */
|
|
@apply flex gap-x-[var(--spacing)] font-[var(--font-weight)]
|
|
text-[length:var(--font-size)] text-[var(--text)]
|
|
leading-[var(--line-height)];
|
|
|
|
/* Element Rules */
|
|
|
|
a:not([role="separator"]) { /* all but gaps */
|
|
@apply block rounded-[var(--rounding)] px-[var(--padding)] py-[calc(var(--padding)/3)] bg-[var(--background)]
|
|
border-solid border-[var(--background-current)] border-[length:var(--border-width)];
|
|
}
|
|
|
|
a[href]:hover { /* all links on hover */
|
|
@apply bg-[var(--background-hover)] text-[var(--text-hover)];
|
|
}
|
|
|
|
a:not([href]) { /* all but links */
|
|
@apply cursor-default
|
|
}
|
|
|
|
a[role="link"]:not([aria-current]) { /* disabled links */
|
|
@apply opacity-[.6];
|
|
}
|
|
|
|
a[aria-current] { /* current page */
|
|
@apply bg-[var(--background-current)] text-[var(--text-current)];
|
|
}
|
|
|
|
label {
|
|
@apply inline-block whitespace-nowrap rounded-[var(--rounding)] px-[var(--padding)]
|
|
py-[calc(var(--padding)/3-var(--border-width))]
|
|
bg-[var(--background)] border-solid border-[length:var(--border-width)] border-[var(--background-current)];
|
|
|
|
input {
|
|
@apply text-[var(--text)] text-[length:var(--font-size)] leading-[var(--line-height)] rounded-[calc(var(--rounding)/2)]
|
|
font-[var(--font-weight)] bg-[var(--background-input)] border-[length:var(--border-width)] border-[var(--background-current)];
|
|
}
|
|
}
|
|
}
|
|
}
|