added leagues

This commit is contained in:
2026-02-10 23:32:48 +11:00
parent dd382faa08
commit c05ecb66fe
28 changed files with 1544 additions and 89 deletions

View File

@@ -12,9 +12,12 @@
--breakpoint-lg: 64rem;
--breakpoint-xl: 80rem;
--breakpoint-2xl: 96rem;
--container-xs: 20rem;
--container-sm: 24rem;
--container-md: 28rem;
--container-lg: 32rem;
--container-2xl: 42rem;
--container-5xl: 64rem;
--container-7xl: 80rem;
--text-xs: 0.75rem;
--text-xs--line-height: calc(1 / 0.75);
@@ -41,10 +44,42 @@
--leading-relaxed: 1.625;
--radius-lg: 0.5rem;
--radius-xl: 0.75rem;
--ease-in: cubic-bezier(0.4, 0, 1, 1);
--ease-out: cubic-bezier(0, 0, 0.2, 1);
--default-transition-duration: 150ms;
--default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
--default-font-family: var(--font-sans);
--default-mono-font-family: var(--font-mono);
--color-rosewater: var(--rosewater);
--color-flamingo: var(--flamingo);
--color-pink: var(--pink);
--color-mauve: var(--mauve);
--color-red: var(--red);
--color-dark-red: var(--dark-red);
--color-maroon: var(--maroon);
--color-peach: var(--peach);
--color-yellow: var(--yellow);
--color-dark-yellow: var(--dark-yellow);
--color-green: var(--green);
--color-dark-green: var(--dark-green);
--color-teal: var(--teal);
--color-sky: var(--sky);
--color-sapphire: var(--sapphire);
--color-blue: var(--blue);
--color-dark-blue: var(--dark-blue);
--color-lavender: var(--lavender);
--color-text: var(--text);
--color-subtext1: var(--subtext1);
--color-subtext0: var(--subtext0);
--color-overlay2: var(--overlay2);
--color-overlay1: var(--overlay1);
--color-overlay0: var(--overlay0);
--color-surface2: var(--surface2);
--color-surface1: var(--surface1);
--color-surface0: var(--surface0);
--color-base: var(--base);
--color-mantle: var(--mantle);
--color-crust: var(--crust);
}
}
@layer base {
@@ -243,6 +278,9 @@
.top-0 {
top: calc(var(--spacing) * 0);
}
.top-1 {
top: calc(var(--spacing) * 1);
}
.top-1\/2 {
top: calc(1/2 * 100%);
}
@@ -267,6 +305,12 @@
.left-0 {
left: calc(var(--spacing) * 0);
}
.z-4 {
z-index: 4;
}
.z-7 {
z-index: 7;
}
.z-10 {
z-index: 10;
}
@@ -276,6 +320,24 @@
.z-50 {
z-index: 50;
}
.container {
width: 100%;
@media (width >= 40rem) {
max-width: 40rem;
}
@media (width >= 48rem) {
max-width: 48rem;
}
@media (width >= 64rem) {
max-width: 64rem;
}
@media (width >= 80rem) {
max-width: 80rem;
}
@media (width >= 96rem) {
max-width: 96rem;
}
}
.mx-auto {
margin-inline: auto;
}
@@ -291,6 +353,9 @@
.mt-2 {
margin-top: calc(var(--spacing) * 2);
}
.mt-3 {
margin-top: calc(var(--spacing) * 3);
}
.mt-4 {
margin-top: calc(var(--spacing) * 4);
}
@@ -318,6 +383,12 @@
.mt-25 {
margin-top: calc(var(--spacing) * 25);
}
.mt-auto {
margin-top: auto;
}
.mb-1 {
margin-bottom: calc(var(--spacing) * 1);
}
.mb-2 {
margin-bottom: calc(var(--spacing) * 2);
}
@@ -336,9 +407,18 @@
.mb-auto {
margin-bottom: auto;
}
.ml-1 {
margin-left: calc(var(--spacing) * 1);
}
.ml-2 {
margin-left: calc(var(--spacing) * 2);
}
.line-clamp-2 {
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.block {
display: block;
}
@@ -370,9 +450,21 @@
.h-1 {
height: calc(var(--spacing) * 1);
}
.h-2 {
height: calc(var(--spacing) * 2);
}
.h-4 {
height: calc(var(--spacing) * 4);
}
.h-5 {
height: calc(var(--spacing) * 5);
}
.h-6 {
height: calc(var(--spacing) * 6);
}
.h-12 {
height: calc(var(--spacing) * 12);
}
.h-16 {
height: calc(var(--spacing) * 16);
}
@@ -391,9 +483,21 @@
.min-h-\[calc\(100vh-200px\)\] {
min-height: calc(100vh - 200px);
}
.min-h-full {
min-height: 100%;
}
.w-4 {
width: calc(var(--spacing) * 4);
}
.w-5 {
width: calc(var(--spacing) * 5);
}
.w-6 {
width: calc(var(--spacing) * 6);
}
.w-12 {
width: calc(var(--spacing) * 12);
}
.w-26 {
width: calc(var(--spacing) * 26);
}
@@ -412,6 +516,9 @@
.max-w-2xl {
max-width: var(--container-2xl);
}
.max-w-5xl {
max-width: var(--container-5xl);
}
.max-w-7xl {
max-width: var(--container-7xl);
}
@@ -439,19 +546,49 @@
.max-w-sm {
max-width: var(--container-sm);
}
.max-w-xs {
max-width: var(--container-xs);
}
.min-w-0 {
min-width: calc(var(--spacing) * 0);
}
.flex-1 {
flex: 1;
}
.flex-shrink {
flex-shrink: 1;
}
.flex-shrink-0 {
flex-shrink: 0;
}
.shrink-0 {
flex-shrink: 0;
}
.flex-grow {
flex-grow: 1;
}
.grow {
flex-grow: 1;
}
.border-collapse {
border-collapse: collapse;
}
.-translate-y-1 {
--tw-translate-y: calc(var(--spacing) * -1);
translate: var(--tw-translate-x) var(--tw-translate-y);
}
.-translate-y-1\/2 {
--tw-translate-y: calc(calc(1/2 * 100%) * -1);
translate: var(--tw-translate-x) var(--tw-translate-y);
}
.translate-y-0 {
--tw-translate-y: calc(var(--spacing) * 0);
translate: var(--tw-translate-x) var(--tw-translate-y);
}
.translate-y-4 {
--tw-translate-y: calc(var(--spacing) * 4);
translate: var(--tw-translate-x) var(--tw-translate-y);
}
.transform {
transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
}
@@ -464,6 +601,12 @@
.resize {
resize: both;
}
.resize-none {
resize: none;
}
.appearance-none {
appearance: none;
}
.grid-cols-1 {
grid-template-columns: repeat(1, minmax(0, 1fr));
}
@@ -556,6 +699,11 @@
border-color: var(--surface2);
}
}
.truncate {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.overflow-hidden {
overflow: hidden;
}
@@ -620,6 +768,12 @@
.bg-base {
background-color: var(--base);
}
.bg-base\/75 {
background-color: var(--base);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, var(--base) 75%, transparent);
}
}
.bg-blue {
background-color: var(--blue);
}
@@ -662,6 +816,12 @@
.bg-mauve {
background-color: var(--mauve);
}
.bg-peach {
background-color: var(--peach);
}
.bg-red {
background-color: var(--red);
}
.bg-red\/10 {
background-color: var(--red);
@supports (color: color-mix(in lab, red, red)) {
@@ -689,6 +849,9 @@
background-color: color-mix(in oklab, var(--yellow) 10%, transparent);
}
}
.bg-no-repeat {
background-repeat: no-repeat;
}
.p-1 {
padding: calc(var(--spacing) * 1);
}
@@ -722,6 +885,12 @@
.px-6 {
padding-inline: calc(var(--spacing) * 6);
}
.py-0 {
padding-block: calc(var(--spacing) * 0);
}
.py-0\.5 {
padding-block: calc(var(--spacing) * 0.5);
}
.py-1 {
padding-block: calc(var(--spacing) * 1);
}
@@ -737,12 +906,27 @@
.py-8 {
padding-block: calc(var(--spacing) * 8);
}
.pt-5 {
padding-top: calc(var(--spacing) * 5);
}
.pr-2 {
padding-right: calc(var(--spacing) * 2);
}
.pr-8 {
padding-right: calc(var(--spacing) * 8);
}
.pr-10 {
padding-right: calc(var(--spacing) * 10);
}
.pb-4 {
padding-bottom: calc(var(--spacing) * 4);
}
.pb-6 {
padding-bottom: calc(var(--spacing) * 6);
}
.pl-3 {
padding-left: calc(var(--spacing) * 3);
}
.text-center {
text-align: center;
}
@@ -787,6 +971,10 @@
font-size: var(--text-xs);
line-height: var(--tw-leading, var(--text-xs--line-height));
}
.leading-6 {
--tw-leading: calc(var(--spacing) * 6);
line-height: calc(var(--spacing) * 6);
}
.leading-relaxed {
--tw-leading: var(--leading-relaxed);
line-height: var(--leading-relaxed);
@@ -858,9 +1046,18 @@
.italic {
font-style: italic;
}
.underline {
text-decoration-line: underline;
}
.opacity-0 {
opacity: 0%;
}
.opacity-50 {
opacity: 50%;
}
.opacity-100 {
opacity: 100%;
}
.shadow-lg {
--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -873,6 +1070,10 @@
--tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.outline {
outline-style: var(--tw-outline-style);
outline-width: 1px;
}
.filter {
filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
}
@@ -881,11 +1082,37 @@
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration));
}
.transition-all {
transition-property: all;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration));
}
.transition-colors {
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration));
}
.transition-opacity {
transition-property: opacity;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration));
}
.duration-200 {
--tw-duration: 200ms;
transition-duration: 200ms;
}
.duration-300 {
--tw-duration: 300ms;
transition-duration: 300ms;
}
.ease-in {
--tw-ease: var(--ease-in);
transition-timing-function: var(--ease-in);
}
.ease-out {
--tw-ease: var(--ease-out);
transition-timing-function: var(--ease-out);
}
.outline-none {
--tw-outline-style: none;
outline-style: none;
@@ -955,6 +1182,16 @@
}
}
}
.hover\:bg-red\/75 {
&:hover {
@media (hover: hover) {
background-color: var(--red);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, var(--red) 75%, transparent);
}
}
}
}
.hover\:bg-sapphire\/75 {
&:hover {
@media (hover: hover) {
@@ -1013,6 +1250,16 @@
}
}
}
.hover\:text-red\/75 {
&:hover {
@media (hover: hover) {
color: var(--red);
@supports (color: color-mix(in lab, red, red)) {
color: color-mix(in oklab, var(--red) 75%, transparent);
}
}
}
}
.hover\:text-subtext1 {
&:hover {
@media (hover: hover) {
@@ -1100,6 +1347,21 @@
inset-inline-end: calc(var(--spacing) * 6);
}
}
.sm\:mx-0 {
@media (width >= 40rem) {
margin-inline: calc(var(--spacing) * 0);
}
}
.sm\:mt-0 {
@media (width >= 40rem) {
margin-top: calc(var(--spacing) * 0);
}
}
.sm\:ml-4 {
@media (width >= 40rem) {
margin-left: calc(var(--spacing) * 4);
}
}
.sm\:block {
@media (width >= 40rem) {
display: block;
@@ -1120,16 +1382,78 @@
display: inline;
}
}
.sm\:h-10 {
@media (width >= 40rem) {
height: calc(var(--spacing) * 10);
}
}
.sm\:w-10 {
@media (width >= 40rem) {
width: calc(var(--spacing) * 10);
}
}
.sm\:w-auto {
@media (width >= 40rem) {
width: auto;
}
}
.sm\:w-full {
@media (width >= 40rem) {
width: 100%;
}
}
.sm\:max-w-lg {
@media (width >= 40rem) {
max-width: var(--container-lg);
}
}
.sm\:translate-y-0 {
@media (width >= 40rem) {
--tw-translate-y: calc(var(--spacing) * 0);
translate: var(--tw-translate-x) var(--tw-translate-y);
}
}
.sm\:scale-95 {
@media (width >= 40rem) {
--tw-scale-x: 95%;
--tw-scale-y: 95%;
--tw-scale-z: 95%;
scale: var(--tw-scale-x) var(--tw-scale-y);
}
}
.sm\:scale-100 {
@media (width >= 40rem) {
--tw-scale-x: 100%;
--tw-scale-y: 100%;
--tw-scale-z: 100%;
scale: var(--tw-scale-x) var(--tw-scale-y);
}
}
.sm\:grid-cols-2 {
@media (width >= 40rem) {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
.sm\:flex-row {
@media (width >= 40rem) {
flex-direction: row;
}
}
.sm\:flex-row-reverse {
@media (width >= 40rem) {
flex-direction: row-reverse;
}
}
.sm\:items-center {
@media (width >= 40rem) {
align-items: center;
}
}
.sm\:items-start {
@media (width >= 40rem) {
align-items: flex-start;
}
}
.sm\:justify-between {
@media (width >= 40rem) {
justify-content: space-between;
@@ -1140,6 +1464,11 @@
gap: calc(var(--spacing) * 2);
}
}
.sm\:p-6 {
@media (width >= 40rem) {
padding: calc(var(--spacing) * 6);
}
}
.sm\:p-7 {
@media (width >= 40rem) {
padding: calc(var(--spacing) * 7);
@@ -1155,6 +1484,16 @@
padding-inline: calc(var(--spacing) * 6);
}
}
.sm\:pb-4 {
@media (width >= 40rem) {
padding-bottom: calc(var(--spacing) * 4);
}
}
.sm\:text-left {
@media (width >= 40rem) {
text-align: left;
}
}
.sm\:text-4xl {
@media (width >= 40rem) {
font-size: var(--text-4xl);
@@ -1166,6 +1505,11 @@
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
.md\:grid-cols-3 {
@media (width >= 48rem) {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
}
.md\:gap-8 {
@media (width >= 48rem) {
gap: calc(var(--spacing) * 8);
@@ -1206,6 +1550,11 @@
grid-template-columns: repeat(3, minmax(0, 1fr));
}
}
.lg\:grid-cols-4 {
@media (width >= 64rem) {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
}
.lg\:items-end {
@media (width >= 64rem) {
align-items: flex-end;
@@ -1457,6 +1806,11 @@
inherits: false;
initial-value: 0 0 #0000;
}
@property --tw-outline-style {
syntax: "*";
inherits: false;
initial-value: solid;
}
@property --tw-blur {
syntax: "*";
inherits: false;
@@ -1510,6 +1864,29 @@
syntax: "*";
inherits: false;
}
@property --tw-duration {
syntax: "*";
inherits: false;
}
@property --tw-ease {
syntax: "*";
inherits: false;
}
@property --tw-scale-x {
syntax: "*";
inherits: false;
initial-value: 1;
}
@property --tw-scale-y {
syntax: "*";
inherits: false;
initial-value: 1;
}
@property --tw-scale-z {
syntax: "*";
inherits: false;
initial-value: 1;
}
@layer properties {
@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
*, ::before, ::after, ::backdrop {
@@ -1541,6 +1918,7 @@
--tw-ring-offset-width: 0px;
--tw-ring-offset-color: #fff;
--tw-ring-offset-shadow: 0 0 #0000;
--tw-outline-style: solid;
--tw-blur: initial;
--tw-brightness: initial;
--tw-contrast: initial;
@@ -1554,6 +1932,11 @@
--tw-drop-shadow-color: initial;
--tw-drop-shadow-alpha: 100%;
--tw-drop-shadow-size: initial;
--tw-duration: initial;
--tw-ease: initial;
--tw-scale-x: 1;
--tw-scale-y: 1;
--tw-scale-z: 1;
}
}
}