started theme versioning

This commit is contained in:
prospect
2024-01-19 08:14:04 -05:00
parent 02cb84ce88
commit 005974ceb3
4 changed files with 99 additions and 174 deletions

View File

@@ -140,8 +140,8 @@
} }
/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */ /* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role='list'], ul[role=list],
ol[role='list'] { ol[role=list] {
list-style: none; list-style: none;
} }
@@ -190,18 +190,18 @@ svg {
} }
} }
/* FORMS */ /* FORMS */
[type='text'], [type=text],
[type='email'], [type=email],
[type='url'], [type=url],
[type='password'], [type=password],
[type='number'], [type=number],
[type='date'], [type=date],
[type='datetime-local'], [type=datetime-local],
[type='month'], [type=month],
[type='search'], [type=search],
[type='tel'], [type=tel],
[type='time'], [type=time],
[type='week'], [type=week],
[multiple], [multiple],
textarea, textarea,
select { select {
@@ -230,7 +230,7 @@ select {
::before, ::before,
::after { ::after {
--tw-content: ''; --tw-content: "";
} }
/* /*
@@ -253,7 +253,7 @@ html,
-o-tab-size: 4; -o-tab-size: 4;
tab-size: 4; tab-size: 4;
/* 3 */ /* 3 */
font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
/* 4 */ /* 4 */
font-feature-settings: normal; font-feature-settings: normal;
/* 5 */ /* 5 */
@@ -335,7 +335,7 @@ code,
kbd, kbd,
samp, samp,
pre { pre {
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
/* 1 */ /* 1 */
font-feature-settings: normal; font-feature-settings: normal;
/* 2 */ /* 2 */
@@ -428,9 +428,9 @@ select {
2. Remove default button styles. 2. Remove default button styles.
*/ */
button, button,
[type='button'], [type=button],
[type='reset'], [type=reset],
[type='submit'] { [type=submit] {
-webkit-appearance: button; -webkit-appearance: button;
/* 1 */ /* 1 */
background-color: transparent; background-color: transparent;
@@ -472,7 +472,7 @@ Correct the cursor style of increment and decrement buttons in Safari.
1. Correct the odd appearance in Chrome and Safari. 1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari. 2. Correct the outline style in Safari.
*/ */
[type='search'] { [type=search] {
-webkit-appearance: textfield; -webkit-appearance: textfield;
/* 1 */ /* 1 */
outline-offset: -2px; outline-offset: -2px;
@@ -558,8 +558,7 @@ textarea {
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300) 1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color. 2. Set the default placeholder color to the user's configured gray 400 color.
*/ */
input::-moz-placeholder, input::-moz-placeholder, textarea::-moz-placeholder {
textarea::-moz-placeholder {
opacity: 1; opacity: 1;
/* 1 */ /* 1 */
color: #9ca3af; color: #9ca3af;
@@ -578,7 +577,7 @@ textarea::placeholder {
Set the default cursor for buttons. Set the default cursor for buttons.
*/ */
button, button,
[role='button'] { [role=button] {
cursor: pointer; cursor: pointer;
} }
@@ -622,22 +621,7 @@ video {
display: none; display: none;
} }
[type='text'], [type=text], input:where(:not([type])), [type=email], [type=url], [type=password], [type=number], [type=date], [type=datetime-local], [type=month], [type=search], [type=tel], [type=time], [type=week], [multiple], textarea, select {
input:where(:not([type])),
[type='email'],
[type='url'],
[type='password'],
[type='number'],
[type='date'],
[type='datetime-local'],
[type='month'],
[type='search'],
[type='tel'],
[type='time'],
[type='week'],
[multiple],
textarea,
select {
-webkit-appearance: none; -webkit-appearance: none;
-moz-appearance: none; -moz-appearance: none;
appearance: none; appearance: none;
@@ -654,25 +638,10 @@ select {
--tw-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000;
} }
[type='text']:focus, [type=text]:focus, input:where(:not([type])):focus, [type=email]:focus, [type=url]:focus, [type=password]:focus, [type=number]:focus, [type=date]:focus, [type=datetime-local]:focus, [type=month]:focus, [type=search]:focus, [type=tel]:focus, [type=time]:focus, [type=week]:focus, [multiple]:focus, textarea:focus, select:focus {
input:where(:not([type])):focus,
[type='email']:focus,
[type='url']:focus,
[type='password']:focus,
[type='number']:focus,
[type='date']:focus,
[type='datetime-local']:focus,
[type='month']:focus,
[type='search']:focus,
[type='tel']:focus,
[type='time']:focus,
[type='week']:focus,
[multiple]:focus,
textarea:focus,
select:focus {
outline: 2px solid transparent; outline: 2px solid transparent;
outline-offset: 2px; outline-offset: 2px;
--tw-ring-inset: var(--tw-empty, /*!*/ /*!*/); --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);
--tw-ring-offset-width: 0px; --tw-ring-offset-width: 0px;
--tw-ring-offset-color: #fff; --tw-ring-offset-color: #fff;
--tw-ring-color: #08192e; --tw-ring-color: #08192e;
@@ -682,14 +651,12 @@ select:focus {
border-color: #08192e; border-color: #08192e;
} }
input::-moz-placeholder, input::-moz-placeholder, textarea::-moz-placeholder {
textarea::-moz-placeholder {
color: #6b7280; color: #6b7280;
opacity: 1; opacity: 1;
} }
input::placeholder, input::placeholder, textarea::placeholder {
textarea::placeholder {
color: #6b7280; color: #6b7280;
opacity: 1; opacity: 1;
} }
@@ -707,15 +674,7 @@ textarea::placeholder {
display: inline-flex; display: inline-flex;
} }
::-webkit-datetime-edit, ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
::-webkit-datetime-edit-year-field,
::-webkit-datetime-edit-month-field,
::-webkit-datetime-edit-day-field,
::-webkit-datetime-edit-hour-field,
::-webkit-datetime-edit-minute-field,
::-webkit-datetime-edit-second-field,
::-webkit-datetime-edit-millisecond-field,
::-webkit-datetime-edit-meridiem-field {
padding-top: 0; padding-top: 0;
padding-bottom: 0; padding-bottom: 0;
} }
@@ -730,8 +689,7 @@ select {
print-color-adjust: exact; print-color-adjust: exact;
} }
[multiple], [multiple], [size]:where(select:not([size="1"])) {
[size]:where(select:not([size='1'])) {
background-image: initial; background-image: initial;
background-position: initial; background-position: initial;
background-repeat: unset; background-repeat: unset;
@@ -741,8 +699,7 @@ select {
print-color-adjust: unset; print-color-adjust: unset;
} }
[type='checkbox'], [type=checkbox], [type=radio] {
[type='radio'] {
-webkit-appearance: none; -webkit-appearance: none;
-moz-appearance: none; -moz-appearance: none;
appearance: none; appearance: none;
@@ -765,19 +722,18 @@ select {
--tw-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000;
} }
[type='checkbox'] { [type=checkbox] {
border-radius: 0px; border-radius: 0px;
} }
[type='radio'] { [type=radio] {
border-radius: 100%; border-radius: 100%;
} }
[type='checkbox']:focus, [type=checkbox]:focus, [type=radio]:focus {
[type='radio']:focus {
outline: 2px solid transparent; outline: 2px solid transparent;
outline-offset: 2px; outline-offset: 2px;
--tw-ring-inset: var(--tw-empty, /*!*/ /*!*/); --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);
--tw-ring-offset-width: 2px; --tw-ring-offset-width: 2px;
--tw-ring-offset-color: #fff; --tw-ring-offset-color: #fff;
--tw-ring-color: #08192e; --tw-ring-color: #08192e;
@@ -786,8 +742,7 @@ select {
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
} }
[type='checkbox']:checked, [type=checkbox]:checked, [type=radio]:checked {
[type='radio']:checked {
border-color: transparent; border-color: transparent;
background-color: currentColor; background-color: currentColor;
background-size: 100% 100%; background-size: 100% 100%;
@@ -795,37 +750,34 @@ select {
background-repeat: no-repeat; background-repeat: no-repeat;
} }
[type='checkbox']:checked { [type=checkbox]:checked {
background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e"); background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e");
} }
@media (forced-colors: active) { @media (forced-colors: active) {
[type='checkbox']:checked { [type=checkbox]:checked {
-webkit-appearance: auto; -webkit-appearance: auto;
-moz-appearance: auto; -moz-appearance: auto;
appearance: auto; appearance: auto;
} }
} }
[type='radio']:checked { [type=radio]:checked {
background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e"); background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e");
} }
@media (forced-colors: active) { @media (forced-colors: active) {
[type='radio']:checked { [type=radio]:checked {
-webkit-appearance: auto; -webkit-appearance: auto;
-moz-appearance: auto; -moz-appearance: auto;
appearance: auto; appearance: auto;
} }
} }
[type='checkbox']:checked:hover, [type=checkbox]:checked:hover, [type=checkbox]:checked:focus, [type=radio]:checked:hover, [type=radio]:checked:focus {
[type='checkbox']:checked:focus,
[type='radio']:checked:hover,
[type='radio']:checked:focus {
border-color: transparent; border-color: transparent;
background-color: currentColor; background-color: currentColor;
} }
[type='checkbox']:indeterminate { [type=checkbox]:indeterminate {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3e%3c/svg%3e"); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3e%3c/svg%3e");
border-color: transparent; border-color: transparent;
background-color: currentColor; background-color: currentColor;
@@ -835,19 +787,18 @@ select {
} }
@media (forced-colors: active) { @media (forced-colors: active) {
[type='checkbox']:indeterminate { [type=checkbox]:indeterminate {
-webkit-appearance: auto; -webkit-appearance: auto;
-moz-appearance: auto; -moz-appearance: auto;
appearance: auto; appearance: auto;
} }
} }
[type='checkbox']:indeterminate:hover, [type=checkbox]:indeterminate:hover, [type=checkbox]:indeterminate:focus {
[type='checkbox']:indeterminate:focus {
border-color: transparent; border-color: transparent;
background-color: currentColor; background-color: currentColor;
} }
[type='file'] { [type=file] {
background: unset; background: unset;
border-color: inherit; border-color: inherit;
border-width: 0; border-width: 0;
@@ -857,14 +808,12 @@ select {
line-height: inherit; line-height: inherit;
} }
[type='file']:focus { [type=file]:focus {
outline: 1px solid ButtonText; outline: 1px solid ButtonText;
outline: 1px auto -webkit-focus-ring-color; outline: 1px auto -webkit-focus-ring-color;
} }
*, *, ::before, ::after {
::before,
::after {
--tw-border-spacing-x: 0; --tw-border-spacing-x: 0;
--tw-border-spacing-y: 0; --tw-border-spacing-y: 0;
--tw-translate-x: 0; --tw-translate-x: 0;
@@ -1034,7 +983,7 @@ select {
} }
.col-span-3 { .col-span-3 {
grid-column: span 3 / span 3; grid-column: span 3/span 3;
} }
.mx-auto { .mx-auto {
@@ -1312,97 +1261,97 @@ select {
.border-blue-500 { .border-blue-500 {
--tw-border-opacity: 1; --tw-border-opacity: 1;
border-color: rgb(10 28 50 / var(--tw-border-opacity)); border-color: rgb(10 28 50/var(--tw-border-opacity));
} }
.bg-black { .bg-black {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(0 0 0 / var(--tw-bg-opacity)); background-color: rgb(0 0 0/var(--tw-bg-opacity));
} }
.bg-blue-500 { .bg-blue-500 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(10 28 50 / var(--tw-bg-opacity)); background-color: rgb(10 28 50/var(--tw-bg-opacity));
} }
.bg-blue-800 { .bg-blue-800 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(4 14 31 / var(--tw-bg-opacity)); background-color: rgb(4 14 31/var(--tw-bg-opacity));
} }
.bg-blue-900 { .bg-blue-900 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(2 9 23 / var(--tw-bg-opacity)); background-color: rgb(2 9 23/var(--tw-bg-opacity));
} }
.bg-cadet-100 { .bg-cadet-100 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(245 247 247 / var(--tw-bg-opacity)); background-color: rgb(245 247 247/var(--tw-bg-opacity));
} }
.bg-cadet-200 { .bg-cadet-200 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(225 235 234 / var(--tw-bg-opacity)); background-color: rgb(225 235 234/var(--tw-bg-opacity));
} }
.bg-cadet-300 { .bg-cadet-300 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(206 219 218 / var(--tw-bg-opacity)); background-color: rgb(206 219 218/var(--tw-bg-opacity));
} }
.bg-cadet-500 { .bg-cadet-500 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(142 168 164 / var(--tw-bg-opacity)); background-color: rgb(142 168 164/var(--tw-bg-opacity));
} }
.bg-cadet-800 { .bg-cadet-800 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(52 102 86 / var(--tw-bg-opacity)); background-color: rgb(52 102 86/var(--tw-bg-opacity));
} }
.bg-cadet-900 { .bg-cadet-900 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(29 77 58 / var(--tw-bg-opacity)); background-color: rgb(29 77 58/var(--tw-bg-opacity));
} }
.bg-gray-800 { .bg-gray-800 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(31 41 55 / var(--tw-bg-opacity)); background-color: rgb(31 41 55/var(--tw-bg-opacity));
} }
.bg-gray-900 { .bg-gray-900 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(17 24 39 / var(--tw-bg-opacity)); background-color: rgb(17 24 39/var(--tw-bg-opacity));
} }
.bg-green-600 { .bg-green-600 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(24 87 76 / var(--tw-bg-opacity)); background-color: rgb(24 87 76/var(--tw-bg-opacity));
} }
.bg-green-900 { .bg-green-900 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(6 43 30 / var(--tw-bg-opacity)); background-color: rgb(6 43 30/var(--tw-bg-opacity));
} }
.bg-red-500 { .bg-red-500 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(149 29 32 / var(--tw-bg-opacity)); background-color: rgb(149 29 32/var(--tw-bg-opacity));
} }
.bg-red-600 { .bg-red-600 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(133 23 26 / var(--tw-bg-opacity)); background-color: rgb(133 23 26/var(--tw-bg-opacity));
} }
.bg-white { .bg-white {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(255 255 255 / var(--tw-bg-opacity)); background-color: rgb(255 255 255/var(--tw-bg-opacity));
} }
.bg-yellow-300 { .bg-yellow-300 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(245 224 162 / var(--tw-bg-opacity)); background-color: rgb(245 224 162/var(--tw-bg-opacity));
} }
.bg-opacity-40 { .bg-opacity-40 {
@@ -1544,7 +1493,7 @@ select {
} }
.font-mono { .font-mono {
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
} }
.text-2xl { .text-2xl {
@@ -1603,47 +1552,47 @@ select {
.text-black { .text-black {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(0 0 0 / var(--tw-text-opacity)); color: rgb(0 0 0/var(--tw-text-opacity));
} }
.text-blue-500 { .text-blue-500 {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(10 28 50 / var(--tw-text-opacity)); color: rgb(10 28 50/var(--tw-text-opacity));
} }
.text-blue-800 { .text-blue-800 {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(4 14 31 / var(--tw-text-opacity)); color: rgb(4 14 31/var(--tw-text-opacity));
} }
.text-blue-900 { .text-blue-900 {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(2 9 23 / var(--tw-text-opacity)); color: rgb(2 9 23/var(--tw-text-opacity));
} }
.text-cadet-300 { .text-cadet-300 {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(206 219 218 / var(--tw-text-opacity)); color: rgb(206 219 218/var(--tw-text-opacity));
} }
.text-cadet-400 { .text-cadet-400 {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(174 194 191 / var(--tw-text-opacity)); color: rgb(174 194 191/var(--tw-text-opacity));
} }
.text-cadet-900 { .text-cadet-900 {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(29 77 58 / var(--tw-text-opacity)); color: rgb(29 77 58/var(--tw-text-opacity));
} }
.text-red-500 { .text-red-500 {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(149 29 32 / var(--tw-text-opacity)); color: rgb(149 29 32/var(--tw-text-opacity));
} }
.text-white { .text-white {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity)); color: rgb(255 255 255/var(--tw-text-opacity));
} }
.underline { .underline {
@@ -1683,32 +1632,9 @@ select {
} }
.transition { .transition {
transition-property: transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
color,
background-color,
border-color,
text-decoration-color,
fill,
stroke,
opacity,
box-shadow,
transform,
filter,
-webkit-backdrop-filter;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
transition-property: transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
color,
background-color,
border-color,
text-decoration-color,
fill,
stroke,
opacity,
box-shadow,
transform,
filter,
backdrop-filter,
-webkit-backdrop-filter;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 150ms; transition-duration: 150ms;
} }
@@ -1728,28 +1654,28 @@ select {
/* Arvo Bold */ /* Arvo Bold */
@font-face { @font-face {
font-family: 'arvo-bold'; font-family: "arvo-bold";
src: url('../assets/fonts/Arvo/Arvo-Bold.ttf'); src: url("../assets/fonts/Arvo/Arvo-Bold.ttf");
} }
/* Libre Baskerville Regular */ /* Libre Baskerville Regular */
@font-face { @font-face {
font-family: 'libre-baskerville'; font-family: "libre-baskerville";
src: url('../assets/fonts/Libre_Baskerville/LibreBaskerville-Regular.ttf'); src: url("../assets/fonts/Libre_Baskerville/LibreBaskerville-Regular.ttf");
} }
/* Open Sans Medium */ /* Open Sans Medium */
@font-face { @font-face {
font-family: 'open-sans'; font-family: "open-sans";
src: url('../assets/fonts/Open_Sans/OpenSans-Medium.ttf'); src: url("../assets/fonts/Open_Sans/OpenSans-Medium.ttf");
} }
/* Roboto Light */ /* Roboto Light */
@font-face { @font-face {
font-family: 'roboto-light'; font-family: "roboto-light";
src: url('../assets/fonts/Roboto/Roboto-Light.ttf'); src: url("../assets/fonts/Roboto/Roboto-Light.ttf");
} }
/* Roboto Medium */ /* Roboto Medium */
@font-face { @font-face {
font-family: 'roboto-medium'; font-family: "roboto-medium";
src: url('../assets/fonts/Roboto/Roboto-Medium.ttf'); src: url("../assets/fonts/Roboto/Roboto-Medium.ttf");
} }
body, body,
html { html {
@@ -1758,7 +1684,7 @@ html {
.hover\:bg-gray-800:hover { .hover\:bg-gray-800:hover {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(31 41 55 / var(--tw-bg-opacity)); background-color: rgb(31 41 55/var(--tw-bg-opacity));
} }
@media (min-width: 640px) { @media (min-width: 640px) {
@@ -1901,7 +1827,7 @@ html {
#login h1 a, #login h1 a,
.login h1 a { .login h1 a {
background-image: url('../../assets/images/logos/nan-login-logo.png'); background-image: url("../../assets/images/logos/nan-login-logo.png");
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center center; background-position: center center;
background-size: 200px; background-size: 200px;
@@ -1956,7 +1882,7 @@ body.login {
justify-content: center; justify-content: center;
background-size: cover; background-size: cover;
background-position: center center; background-position: center center;
background-image: url('../../assets/images/bgs/backsplash.png'); background-image: url("../../assets/images/bgs/backsplash.png");
background-color: var(--gray-500); background-color: var(--gray-500);
background-blend-mode: multiply; background-blend-mode: multiply;
} }
@@ -2115,17 +2041,13 @@ body.login {
#content-container.page-transition { #content-container.page-transition {
opacity: 0; opacity: 0;
transform: translatex(-100%); transform: translatex(-100%);
transition: transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
opacity 0.6s ease-in-out,
transform 0.6s ease-in-out;
} }
#content-container:not(.page-transition) { #content-container:not(.page-transition) {
opacity: 1; opacity: 1;
transform: translateY(0); transform: translateY(0);
transition: transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
opacity 0.6s ease-in-out,
transform 0.6s ease-in-out;
} }
#footer-nav.out-of-view { #footer-nav.out-of-view {

View File

@@ -141,6 +141,9 @@ class PageTransitions {
this.updateContent(data, elementId); this.updateContent(data, elementId);
history.pushState(null, null, targetUrl); history.pushState(null, null, targetUrl);
// Trigger removal of transition class after fetching data // Trigger removal of transition class after fetching data
setTimeout(() => {
this.removeTransitionClass(contentContainer);
}, 300);
this.removeTransitionClass(contentContainer); this.removeTransitionClass(contentContainer);
}).catch(error => console.error('Error fetching content:', error)); }).catch(error => console.error('Error fetching content:', error));
} }

File diff suppressed because one or more lines are too long

View File

@@ -87,7 +87,7 @@ require_once(get_theme_file_path('/includes/back-end/helper_functions.php'));
<li>You have a dream for your future.</li> <li>You have a dream for your future.</li>
<li>You may know where you want to go.</li> <li>You may know where you want to go.</li>
<li>You may know the program you want to take.</li> <li>You may know the program you want to take.</li>
<li>In any case, this handbook has information to help you on this next step in your education journey</li> <li>In any case, this handbook has information to help you on this next step in your education journey.</li>
</ul> </ul>
<div class="flex items-center py-4 lg:py-8 px-4 lg:px-8 bg-cadet-200 space-x-4"> <div class="flex items-center py-4 lg:py-8 px-4 lg:px-8 bg-cadet-200 space-x-4">