Warning banner
This commit is contained in:
Alphonse Paix
@@ -24,7 +24,11 @@
|
||||
--color-amber-200: oklch(92.4% 0.12 95.746);
|
||||
--color-amber-600: oklch(66.6% 0.179 58.318);
|
||||
--color-amber-800: oklch(47.3% 0.137 46.201);
|
||||
--color-yellow-50: oklch(98.7% 0.026 102.212);
|
||||
--color-yellow-200: oklch(94.5% 0.129 101.54);
|
||||
--color-yellow-500: oklch(79.5% 0.184 86.047);
|
||||
--color-yellow-600: oklch(68.1% 0.162 75.834);
|
||||
--color-yellow-800: oklch(47.6% 0.114 61.907);
|
||||
--color-green-50: oklch(98.2% 0.018 155.826);
|
||||
--color-green-100: oklch(96.2% 0.044 156.743);
|
||||
--color-green-200: oklch(92.5% 0.084 155.995);
|
||||
@@ -44,6 +48,7 @@
|
||||
--color-indigo-600: oklch(51.1% 0.262 276.966);
|
||||
--color-indigo-700: oklch(45.7% 0.24 277.023);
|
||||
--color-purple-100: oklch(94.6% 0.033 307.174);
|
||||
--color-purple-200: oklch(90.2% 0.063 306.703);
|
||||
--color-purple-500: oklch(62.7% 0.265 303.9);
|
||||
--color-purple-600: oklch(55.8% 0.288 302.321);
|
||||
--color-purple-700: oklch(49.6% 0.265 301.924);
|
||||
@@ -298,6 +303,424 @@
|
||||
.my-12 {
|
||||
margin-block: calc(var(--spacing) * 12);
|
||||
}
|
||||
.prose {
|
||||
color: var(--tw-prose-body);
|
||||
max-width: 65ch;
|
||||
:where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
:where([class~="lead"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-lead);
|
||||
font-size: 1.25em;
|
||||
line-height: 1.6;
|
||||
margin-top: 1.2em;
|
||||
margin-bottom: 1.2em;
|
||||
}
|
||||
:where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-links);
|
||||
text-decoration: underline;
|
||||
font-weight: 500;
|
||||
}
|
||||
:where(strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-bold);
|
||||
font-weight: 600;
|
||||
}
|
||||
:where(a strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
:where(blockquote strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
:where(thead th strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
:where(ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: decimal;
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
padding-inline-start: 1.625em;
|
||||
}
|
||||
:where(ol[type="A"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: upper-alpha;
|
||||
}
|
||||
:where(ol[type="a"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: lower-alpha;
|
||||
}
|
||||
:where(ol[type="A" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: upper-alpha;
|
||||
}
|
||||
:where(ol[type="a" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: lower-alpha;
|
||||
}
|
||||
:where(ol[type="I"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: upper-roman;
|
||||
}
|
||||
:where(ol[type="i"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: lower-roman;
|
||||
}
|
||||
:where(ol[type="I" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: upper-roman;
|
||||
}
|
||||
:where(ol[type="i" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: lower-roman;
|
||||
}
|
||||
:where(ol[type="1"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: decimal;
|
||||
}
|
||||
:where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
list-style-type: disc;
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
padding-inline-start: 1.625em;
|
||||
}
|
||||
:where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *))::marker {
|
||||
font-weight: 400;
|
||||
color: var(--tw-prose-counters);
|
||||
}
|
||||
:where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *))::marker {
|
||||
color: var(--tw-prose-bullets);
|
||||
}
|
||||
:where(dt):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-headings);
|
||||
font-weight: 600;
|
||||
margin-top: 1.25em;
|
||||
}
|
||||
:where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
border-color: var(--tw-prose-hr);
|
||||
border-top-width: 1px;
|
||||
margin-top: 3em;
|
||||
margin-bottom: 3em;
|
||||
}
|
||||
:where(blockquote):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
font-weight: 500;
|
||||
font-style: italic;
|
||||
color: var(--tw-prose-quotes);
|
||||
border-inline-start-width: 0.25rem;
|
||||
border-inline-start-color: var(--tw-prose-quote-borders);
|
||||
quotes: "\201C""\201D""\2018""\2019";
|
||||
margin-top: 1.6em;
|
||||
margin-bottom: 1.6em;
|
||||
padding-inline-start: 1em;
|
||||
}
|
||||
:where(blockquote p:first-of-type):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {
|
||||
content: open-quote;
|
||||
}
|
||||
:where(blockquote p:last-of-type):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {
|
||||
content: close-quote;
|
||||
}
|
||||
:where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-headings);
|
||||
font-weight: 800;
|
||||
font-size: 2.25em;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0.8888889em;
|
||||
line-height: 1.1111111;
|
||||
}
|
||||
:where(h1 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
font-weight: 900;
|
||||
color: inherit;
|
||||
}
|
||||
:where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-headings);
|
||||
font-weight: 700;
|
||||
font-size: 1.5em;
|
||||
margin-top: 2em;
|
||||
margin-bottom: 1em;
|
||||
line-height: 1.3333333;
|
||||
}
|
||||
:where(h2 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
font-weight: 800;
|
||||
color: inherit;
|
||||
}
|
||||
:where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-headings);
|
||||
font-weight: 600;
|
||||
font-size: 1.25em;
|
||||
margin-top: 1.6em;
|
||||
margin-bottom: 0.6em;
|
||||
line-height: 1.6;
|
||||
}
|
||||
:where(h3 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
font-weight: 700;
|
||||
color: inherit;
|
||||
}
|
||||
:where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-headings);
|
||||
font-weight: 600;
|
||||
margin-top: 1.5em;
|
||||
margin-bottom: 0.5em;
|
||||
line-height: 1.5;
|
||||
}
|
||||
:where(h4 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
font-weight: 700;
|
||||
color: inherit;
|
||||
}
|
||||
:where(img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
:where(picture):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
display: block;
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
:where(video):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
:where(kbd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
font-weight: 500;
|
||||
font-family: inherit;
|
||||
color: var(--tw-prose-kbd);
|
||||
box-shadow: 0 0 0 1px var(--tw-prose-kbd-shadows), 0 3px 0 var(--tw-prose-kbd-shadows);
|
||||
font-size: 0.875em;
|
||||
border-radius: 0.3125rem;
|
||||
padding-top: 0.1875em;
|
||||
padding-inline-end: 0.375em;
|
||||
padding-bottom: 0.1875em;
|
||||
padding-inline-start: 0.375em;
|
||||
}
|
||||
:where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-code);
|
||||
font-weight: 600;
|
||||
font-size: 0.875em;
|
||||
}
|
||||
:where(code):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {
|
||||
content: "`";
|
||||
}
|
||||
:where(code):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {
|
||||
content: "`";
|
||||
}
|
||||
:where(a code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
:where(h1 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
:where(h2 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
font-size: 0.875em;
|
||||
}
|
||||
:where(h3 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
:where(h4 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
:where(blockquote code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
:where(thead th code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
:where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-pre-code);
|
||||
background-color: var(--tw-prose-pre-bg);
|
||||
overflow-x: auto;
|
||||
font-weight: 400;
|
||||
font-size: 0.875em;
|
||||
line-height: 1.7142857;
|
||||
margin-top: 1.7142857em;
|
||||
margin-bottom: 1.7142857em;
|
||||
border-radius: 0.375rem;
|
||||
padding-top: 0.8571429em;
|
||||
padding-inline-end: 1.1428571em;
|
||||
padding-bottom: 0.8571429em;
|
||||
padding-inline-start: 1.1428571em;
|
||||
}
|
||||
:where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
background-color: transparent;
|
||||
border-width: 0;
|
||||
border-radius: 0;
|
||||
padding: 0;
|
||||
font-weight: inherit;
|
||||
color: inherit;
|
||||
font-size: inherit;
|
||||
font-family: inherit;
|
||||
line-height: inherit;
|
||||
}
|
||||
:where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {
|
||||
content: none;
|
||||
}
|
||||
:where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {
|
||||
content: none;
|
||||
}
|
||||
:where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
width: 100%;
|
||||
table-layout: auto;
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
font-size: 0.875em;
|
||||
line-height: 1.7142857;
|
||||
}
|
||||
:where(thead):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
border-bottom-width: 1px;
|
||||
border-bottom-color: var(--tw-prose-th-borders);
|
||||
}
|
||||
:where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-headings);
|
||||
font-weight: 600;
|
||||
vertical-align: bottom;
|
||||
padding-inline-end: 0.5714286em;
|
||||
padding-bottom: 0.5714286em;
|
||||
padding-inline-start: 0.5714286em;
|
||||
}
|
||||
:where(tbody tr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
border-bottom-width: 1px;
|
||||
border-bottom-color: var(--tw-prose-td-borders);
|
||||
}
|
||||
:where(tbody tr:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
border-bottom-width: 0;
|
||||
}
|
||||
:where(tbody td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
vertical-align: baseline;
|
||||
}
|
||||
:where(tfoot):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
border-top-width: 1px;
|
||||
border-top-color: var(--tw-prose-th-borders);
|
||||
}
|
||||
:where(tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
vertical-align: top;
|
||||
}
|
||||
:where(th, td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
text-align: start;
|
||||
}
|
||||
:where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
:where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-captions);
|
||||
font-size: 0.875em;
|
||||
line-height: 1.4285714;
|
||||
margin-top: 0.8571429em;
|
||||
}
|
||||
--tw-prose-body: oklch(37.3% 0.034 259.733);
|
||||
--tw-prose-headings: oklch(21% 0.034 264.665);
|
||||
--tw-prose-lead: oklch(44.6% 0.03 256.802);
|
||||
--tw-prose-links: oklch(21% 0.034 264.665);
|
||||
--tw-prose-bold: oklch(21% 0.034 264.665);
|
||||
--tw-prose-counters: oklch(55.1% 0.027 264.364);
|
||||
--tw-prose-bullets: oklch(87.2% 0.01 258.338);
|
||||
--tw-prose-hr: oklch(92.8% 0.006 264.531);
|
||||
--tw-prose-quotes: oklch(21% 0.034 264.665);
|
||||
--tw-prose-quote-borders: oklch(92.8% 0.006 264.531);
|
||||
--tw-prose-captions: oklch(55.1% 0.027 264.364);
|
||||
--tw-prose-kbd: oklch(21% 0.034 264.665);
|
||||
--tw-prose-kbd-shadows: color-mix(in oklab, oklch(21% 0.034 264.665) 10%, transparent);
|
||||
--tw-prose-code: oklch(21% 0.034 264.665);
|
||||
--tw-prose-pre-code: oklch(92.8% 0.006 264.531);
|
||||
--tw-prose-pre-bg: oklch(27.8% 0.033 256.848);
|
||||
--tw-prose-th-borders: oklch(87.2% 0.01 258.338);
|
||||
--tw-prose-td-borders: oklch(92.8% 0.006 264.531);
|
||||
--tw-prose-invert-body: oklch(87.2% 0.01 258.338);
|
||||
--tw-prose-invert-headings: #fff;
|
||||
--tw-prose-invert-lead: oklch(70.7% 0.022 261.325);
|
||||
--tw-prose-invert-links: #fff;
|
||||
--tw-prose-invert-bold: #fff;
|
||||
--tw-prose-invert-counters: oklch(70.7% 0.022 261.325);
|
||||
--tw-prose-invert-bullets: oklch(44.6% 0.03 256.802);
|
||||
--tw-prose-invert-hr: oklch(37.3% 0.034 259.733);
|
||||
--tw-prose-invert-quotes: oklch(96.7% 0.003 264.542);
|
||||
--tw-prose-invert-quote-borders: oklch(37.3% 0.034 259.733);
|
||||
--tw-prose-invert-captions: oklch(70.7% 0.022 261.325);
|
||||
--tw-prose-invert-kbd: #fff;
|
||||
--tw-prose-invert-kbd-shadows: rgb(255, 255, 255 / 10%);
|
||||
--tw-prose-invert-code: #fff;
|
||||
--tw-prose-invert-pre-code: oklch(87.2% 0.01 258.338);
|
||||
--tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);
|
||||
--tw-prose-invert-th-borders: oklch(44.6% 0.03 256.802);
|
||||
--tw-prose-invert-td-borders: oklch(37.3% 0.034 259.733);
|
||||
font-size: 1rem;
|
||||
line-height: 1.75;
|
||||
:where(picture > img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
:where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0.5em;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
:where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
padding-inline-start: 0.375em;
|
||||
}
|
||||
:where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
padding-inline-start: 0.375em;
|
||||
}
|
||||
:where(.prose > ul > li p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0.75em;
|
||||
margin-bottom: 0.75em;
|
||||
}
|
||||
:where(.prose > ul > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 1.25em;
|
||||
}
|
||||
:where(.prose > ul > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
:where(.prose > ol > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 1.25em;
|
||||
}
|
||||
:where(.prose > ol > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
:where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0.75em;
|
||||
margin-bottom: 0.75em;
|
||||
}
|
||||
:where(dl):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
:where(dd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0.5em;
|
||||
padding-inline-start: 1.625em;
|
||||
}
|
||||
:where(hr + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
:where(h2 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
:where(h3 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
:where(h4 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
:where(thead th:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
padding-inline-start: 0;
|
||||
}
|
||||
:where(thead th:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
padding-inline-end: 0;
|
||||
}
|
||||
:where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
padding-top: 0.5714286em;
|
||||
padding-inline-end: 0.5714286em;
|
||||
padding-bottom: 0.5714286em;
|
||||
padding-inline-start: 0.5714286em;
|
||||
}
|
||||
:where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
padding-inline-start: 0;
|
||||
}
|
||||
:where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
padding-inline-end: 0;
|
||||
}
|
||||
:where(figure):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
:where(.prose > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
:where(.prose > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
.mt-0 {
|
||||
margin-top: calc(var(--spacing) * 0);
|
||||
}
|
||||
.mt-0\.5 {
|
||||
margin-top: calc(var(--spacing) * 0.5);
|
||||
}
|
||||
@@ -382,6 +805,9 @@
|
||||
.table {
|
||||
display: table;
|
||||
}
|
||||
.h-0 {
|
||||
height: calc(var(--spacing) * 0);
|
||||
}
|
||||
.h-0\.5 {
|
||||
height: calc(var(--spacing) * 0.5);
|
||||
}
|
||||
@@ -469,12 +895,18 @@
|
||||
.flex-1 {
|
||||
flex: 1;
|
||||
}
|
||||
.flex-shrink {
|
||||
flex-shrink: 1;
|
||||
}
|
||||
.flex-shrink-0 {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.shrink-0 {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.border-collapse {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
.scale-x-0 {
|
||||
--tw-scale-x: 0%;
|
||||
scale: var(--tw-scale-x) var(--tw-scale-y);
|
||||
@@ -633,6 +1065,10 @@
|
||||
border-bottom-style: var(--tw-border-style);
|
||||
border-bottom-width: 1px;
|
||||
}
|
||||
.border-b-2 {
|
||||
border-bottom-style: var(--tw-border-style);
|
||||
border-bottom-width: 2px;
|
||||
}
|
||||
.border-l-4 {
|
||||
border-left-style: var(--tw-border-style);
|
||||
border-left-width: 4px;
|
||||
@@ -659,6 +1095,9 @@
|
||||
.border-green-200 {
|
||||
border-color: var(--color-green-200);
|
||||
}
|
||||
.border-purple-700 {
|
||||
border-color: var(--color-purple-700);
|
||||
}
|
||||
.border-red-200 {
|
||||
border-color: var(--color-red-200);
|
||||
}
|
||||
@@ -671,6 +1110,9 @@
|
||||
.border-white {
|
||||
border-color: var(--color-white);
|
||||
}
|
||||
.border-yellow-200 {
|
||||
border-color: var(--color-yellow-200);
|
||||
}
|
||||
.border-l-green-500 {
|
||||
border-left-color: var(--color-green-500);
|
||||
}
|
||||
@@ -731,6 +1173,9 @@
|
||||
background-color: color-mix(in oklab, var(--color-white) 95%, transparent);
|
||||
}
|
||||
}
|
||||
.bg-yellow-50 {
|
||||
background-color: var(--color-yellow-50);
|
||||
}
|
||||
.bg-gradient-to-br {
|
||||
--tw-gradient-position: to bottom right in oklab;
|
||||
background-image: linear-gradient(var(--tw-gradient-stops));
|
||||
@@ -747,6 +1192,14 @@
|
||||
--tw-gradient-from: var(--color-blue-600);
|
||||
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
|
||||
}
|
||||
.from-purple-600 {
|
||||
--tw-gradient-from: var(--color-purple-600);
|
||||
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
|
||||
}
|
||||
.to-blue-600 {
|
||||
--tw-gradient-to: var(--color-blue-600);
|
||||
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
|
||||
}
|
||||
.to-blue-700 {
|
||||
--tw-gradient-to: var(--color-blue-700);
|
||||
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
|
||||
@@ -792,6 +1245,9 @@
|
||||
.px-8 {
|
||||
padding-inline: calc(var(--spacing) * 8);
|
||||
}
|
||||
.py-0 {
|
||||
padding-block: calc(var(--spacing) * 0);
|
||||
}
|
||||
.py-0\.5 {
|
||||
padding-block: calc(var(--spacing) * 0.5);
|
||||
}
|
||||
@@ -963,6 +1419,12 @@
|
||||
.text-white {
|
||||
color: var(--color-white);
|
||||
}
|
||||
.text-yellow-600 {
|
||||
color: var(--color-yellow-600);
|
||||
}
|
||||
.text-yellow-800 {
|
||||
color: var(--color-yellow-800);
|
||||
}
|
||||
.lowercase {
|
||||
text-transform: lowercase;
|
||||
}
|
||||
@@ -970,6 +1432,9 @@
|
||||
--tw-ordinal: ordinal;
|
||||
font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
|
||||
}
|
||||
.underline {
|
||||
text-decoration-line: underline;
|
||||
}
|
||||
.placeholder-gray-400 {
|
||||
&::placeholder {
|
||||
color: var(--color-gray-400);
|
||||
@@ -990,11 +1455,19 @@
|
||||
--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px 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;
|
||||
}
|
||||
.backdrop-blur-md {
|
||||
--tw-backdrop-blur: blur(var(--blur-md));
|
||||
-webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
|
||||
backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
|
||||
}
|
||||
.backdrop-filter {
|
||||
-webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
|
||||
backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
|
||||
}
|
||||
.transition {
|
||||
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
|
||||
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
||||
@@ -1193,6 +1666,13 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
.hover\:text-purple-200 {
|
||||
&:hover {
|
||||
@media (hover: hover) {
|
||||
color: var(--color-purple-200);
|
||||
}
|
||||
}
|
||||
}
|
||||
.hover\:text-red-600 {
|
||||
&:hover {
|
||||
@media (hover: hover) {
|
||||
@@ -1381,12 +1861,6 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
.md\:text-4xl {
|
||||
@media (width >= 48rem) {
|
||||
font-size: var(--text-4xl);
|
||||
line-height: var(--tw-leading, var(--text-4xl--line-height));
|
||||
}
|
||||
}
|
||||
.lg\:ml-0 {
|
||||
@media (width >= 64rem) {
|
||||
margin-left: calc(var(--spacing) * 0);
|
||||
@@ -2198,6 +2672,11 @@
|
||||
inherits: false;
|
||||
initial-value: 0 0 #0000;
|
||||
}
|
||||
@property --tw-outline-style {
|
||||
syntax: "*";
|
||||
inherits: false;
|
||||
initial-value: solid;
|
||||
}
|
||||
@property --tw-backdrop-blur {
|
||||
syntax: "*";
|
||||
inherits: false;
|
||||
@@ -2288,6 +2767,7 @@
|
||||
--tw-ring-offset-width: 0px;
|
||||
--tw-ring-offset-color: #fff;
|
||||
--tw-ring-offset-shadow: 0 0 #0000;
|
||||
--tw-outline-style: solid;
|
||||
--tw-backdrop-blur: initial;
|
||||
--tw-backdrop-brightness: initial;
|
||||
--tw-backdrop-contrast: initial;
|
||||
|
||||
@@ -13,6 +13,21 @@
|
||||
<script src="/assets/js/htmx.min.js"></script>
|
||||
</head>
|
||||
<body class="bg-gray-50 min-h-screen flex flex-col">
|
||||
<div class="bg-yellow-50 border-b-2 border-yellow-200">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-3">
|
||||
<div class="flex items-center justify-center text-center">
|
||||
<svg class="w-5 h-5 text-yellow-600 mr-2 flex-shrink-0"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
<p class="text-sm text-yellow-800">
|
||||
This is a learning project, <span class="font-semibold">not</span> a production website.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<header class="sticky top-0 bg-white/95 backdrop-blur-md shadow-sm border-b border-gray-200 z-40">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="flex justify-between items-center h-16">
|
||||
@@ -23,8 +38,7 @@
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M13 10V3L4 14h7v7l9-11h-7z"/>
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z" />
|
||||
</svg>
|
||||
</div>
|
||||
<span class="text-sm font-bold bg-gradient-to-r from-blue-600 to-indigo-600 bg-clip-text text-transparent">
|
||||
@@ -48,8 +62,7 @@
|
||||
<button class="md:hidden p-2 text-gray-700 hover:text-blue-600 hover:bg-blue-50 rounded-lg transition-colors duration-200"
|
||||
onclick="toggleMobileMenu()">
|
||||
<svg class="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M4 6h16M4 12h16M4 18h16"/>
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
@@ -88,8 +101,7 @@
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"/>
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" />
|
||||
</svg>
|
||||
</a>
|
||||
<span class="text-gray-300">•</span>
|
||||
|
||||
Reference in New Issue
Block a user