adjust color theme
This commit is contained in:
Lea
parent
f4242e8935
commit
955bb572a3
@ -517,17 +517,18 @@ html {
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
--in: 72.06% 0.191 231.6;
|
||||
--su: 64.8% 0.150 160;
|
||||
--wa: 84.71% 0.199 83.87;
|
||||
--er: 71.76% 0.221 22.18;
|
||||
--pc: 89.824% 0.06192 275.75;
|
||||
--ac: 15.352% 0.0368 183.61;
|
||||
--inc: 0% 0 0;
|
||||
--suc: 0% 0 0;
|
||||
--wac: 0% 0 0;
|
||||
--erc: 0% 0 0;
|
||||
--p: 65.592% 0.211773 354.308441;
|
||||
--b2: 90.8446% 0.0112 43.281415;
|
||||
--b3: 84.0068% 0.010357 43.281415;
|
||||
--bc: 19.5365% 0.002409 43.281415;
|
||||
--pc: 13.1184% 0.042355 354.308441;
|
||||
--sc: 16.2232% 0.020257 293.571186;
|
||||
--ac: 18.867% 0.005681 294.587823;
|
||||
--nc: 90.3952% 0.018713 223.127977;
|
||||
--inc: 15.0703% 0.027798 232.66148;
|
||||
--suc: 16.9037% 0.02599 164.978166;
|
||||
--wac: 16.7372% 0.032884 84.428628;
|
||||
--erc: 12.7367% 0.04157 25.331328;
|
||||
--rounded-box: 1rem;
|
||||
--rounded-btn: 0.5rem;
|
||||
--rounded-badge: 1.9rem;
|
||||
@ -537,117 +538,14 @@ html {
|
||||
--border-btn: 1px;
|
||||
--tab-border: 1px;
|
||||
--tab-radius: 0.5rem;
|
||||
--p: 49.12% 0.3096 275.75;
|
||||
--s: 69.71% 0.329 342.55;
|
||||
--sc: 98.71% 0.0106 342.55;
|
||||
--a: 76.76% 0.184 183.61;
|
||||
--n: 32.1785% 0.02476 255.701624;
|
||||
--nc: 89.4994% 0.011585 252.096176;
|
||||
--b1: 100% 0 0;
|
||||
--b2: 96.1151% 0 0;
|
||||
--b3: 92.4169% 0.00108 197.137559;
|
||||
--bc: 27.8078% 0.029596 256.847952;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
color-scheme: dark;
|
||||
--in: 72.06% 0.191 231.6;
|
||||
--su: 64.8% 0.150 160;
|
||||
--wa: 84.71% 0.199 83.87;
|
||||
--er: 71.76% 0.221 22.18;
|
||||
--pc: 13.138% 0.0392 275.75;
|
||||
--sc: 14.96% 0.052 342.55;
|
||||
--ac: 14.902% 0.0334 183.61;
|
||||
--inc: 0% 0 0;
|
||||
--suc: 0% 0 0;
|
||||
--wac: 0% 0 0;
|
||||
--erc: 0% 0 0;
|
||||
--rounded-box: 1rem;
|
||||
--rounded-btn: 0.5rem;
|
||||
--rounded-badge: 1.9rem;
|
||||
--animation-btn: 0.25s;
|
||||
--animation-input: .2s;
|
||||
--btn-focus-scale: 0.95;
|
||||
--border-btn: 1px;
|
||||
--tab-border: 1px;
|
||||
--tab-radius: 0.5rem;
|
||||
--p: 65.69% 0.196 275.75;
|
||||
--s: 74.8% 0.26 342.55;
|
||||
--a: 74.51% 0.167 183.61;
|
||||
--n: 31.3815% 0.021108 254.139175;
|
||||
--nc: 74.6477% 0.0216 264.435964;
|
||||
--b1: 25.3267% 0.015896 252.417568;
|
||||
--b2: 23.2607% 0.013807 253.100675;
|
||||
--b3: 21.1484% 0.01165 254.087939;
|
||||
--bc: 74.6477% 0.0216 264.435964;
|
||||
}
|
||||
}
|
||||
|
||||
[data-theme=light] {
|
||||
color-scheme: light;
|
||||
--in: 72.06% 0.191 231.6;
|
||||
--su: 64.8% 0.150 160;
|
||||
--wa: 84.71% 0.199 83.87;
|
||||
--er: 71.76% 0.221 22.18;
|
||||
--pc: 89.824% 0.06192 275.75;
|
||||
--ac: 15.352% 0.0368 183.61;
|
||||
--inc: 0% 0 0;
|
||||
--suc: 0% 0 0;
|
||||
--wac: 0% 0 0;
|
||||
--erc: 0% 0 0;
|
||||
--rounded-box: 1rem;
|
||||
--rounded-btn: 0.5rem;
|
||||
--rounded-badge: 1.9rem;
|
||||
--animation-btn: 0.25s;
|
||||
--animation-input: .2s;
|
||||
--btn-focus-scale: 0.95;
|
||||
--border-btn: 1px;
|
||||
--tab-border: 1px;
|
||||
--tab-radius: 0.5rem;
|
||||
--p: 49.12% 0.3096 275.75;
|
||||
--s: 69.71% 0.329 342.55;
|
||||
--sc: 98.71% 0.0106 342.55;
|
||||
--a: 76.76% 0.184 183.61;
|
||||
--n: 32.1785% 0.02476 255.701624;
|
||||
--nc: 89.4994% 0.011585 252.096176;
|
||||
--b1: 100% 0 0;
|
||||
--b2: 96.1151% 0 0;
|
||||
--b3: 92.4169% 0.00108 197.137559;
|
||||
--bc: 27.8078% 0.029596 256.847952;
|
||||
}
|
||||
|
||||
[data-theme=dark] {
|
||||
color-scheme: dark;
|
||||
--in: 72.06% 0.191 231.6;
|
||||
--su: 64.8% 0.150 160;
|
||||
--wa: 84.71% 0.199 83.87;
|
||||
--er: 71.76% 0.221 22.18;
|
||||
--pc: 13.138% 0.0392 275.75;
|
||||
--sc: 14.96% 0.052 342.55;
|
||||
--ac: 14.902% 0.0334 183.61;
|
||||
--inc: 0% 0 0;
|
||||
--suc: 0% 0 0;
|
||||
--wac: 0% 0 0;
|
||||
--erc: 0% 0 0;
|
||||
--rounded-box: 1rem;
|
||||
--rounded-btn: 0.5rem;
|
||||
--rounded-badge: 1.9rem;
|
||||
--animation-btn: 0.25s;
|
||||
--animation-input: .2s;
|
||||
--btn-focus-scale: 0.95;
|
||||
--border-btn: 1px;
|
||||
--tab-border: 1px;
|
||||
--tab-radius: 0.5rem;
|
||||
--p: 65.69% 0.196 275.75;
|
||||
--s: 74.8% 0.26 342.55;
|
||||
--a: 74.51% 0.167 183.61;
|
||||
--n: 31.3815% 0.021108 254.139175;
|
||||
--nc: 74.6477% 0.0216 264.435964;
|
||||
--b1: 25.3267% 0.015896 252.417568;
|
||||
--b2: 23.2607% 0.013807 253.100675;
|
||||
--b3: 21.1484% 0.01165 254.087939;
|
||||
--bc: 74.6477% 0.0216 264.435964;
|
||||
--s: 81.1162% 0.101287 293.571186;
|
||||
--a: 94.3348% 0.028406 294.587823;
|
||||
--n: 51.9759% 0.093565 223.127977;
|
||||
--b1: 97.6824% 0.012043 43.281415;
|
||||
--in: 75.3513% 0.138989 232.66148;
|
||||
--su: 84.5186% 0.129948 164.978166;
|
||||
--wa: 83.6861% 0.164422 84.428628;
|
||||
--er: 63.6834% 0.207849 25.331328;
|
||||
}
|
||||
|
||||
*, ::before, ::after {
|
||||
@ -839,15 +737,6 @@ html {
|
||||
color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));
|
||||
}
|
||||
|
||||
.menu li > *:not(ul, .menu-title, details, .btn):active,
|
||||
.menu li > *:not(ul, .menu-title, details, .btn).active,
|
||||
.menu li > details > summary:active {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));
|
||||
--tw-text-opacity: 1;
|
||||
color: var(--fallback-nc,oklch(var(--nc)/var(--tw-text-opacity)));
|
||||
}
|
||||
|
||||
.radio-primary:hover {
|
||||
--tw-border-opacity: 1;
|
||||
border-color: var(--fallback-p,oklch(var(--p)/var(--tw-border-opacity)));
|
||||
@ -1007,23 +896,6 @@ html {
|
||||
border-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);
|
||||
}
|
||||
}
|
||||
|
||||
:where(.menu li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title)):not(.active, .btn):hover, :where(.menu li:not(.menu-title, .disabled) > details > summary:not(.menu-title)):not(.active, .btn):hover {
|
||||
cursor: pointer;
|
||||
outline: 2px solid transparent;
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
@supports (color: oklch(0% 0 0)) {
|
||||
:where(.menu li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title)):not(.active, .btn):hover, :where(.menu li:not(.menu-title, .disabled) > details > summary:not(.menu-title)):not(.active, .btn):hover {
|
||||
background-color: var(--fallback-bc,oklch(var(--bc)/0.1));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.form-control {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.label {
|
||||
@ -1069,59 +941,6 @@ html {
|
||||
text-decoration-line: underline;
|
||||
}
|
||||
|
||||
.menu {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-wrap: wrap;
|
||||
font-size: 0.875rem;
|
||||
line-height: 1.25rem;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.menu :where(li ul) {
|
||||
position: relative;
|
||||
white-space: nowrap;
|
||||
margin-inline-start: 1rem;
|
||||
padding-inline-start: 0.5rem;
|
||||
}
|
||||
|
||||
.menu :where(li:not(.menu-title) > *:not(ul, details, .menu-title, .btn)), .menu :where(li:not(.menu-title) > details > summary:not(.menu-title)) {
|
||||
display: grid;
|
||||
grid-auto-flow: column;
|
||||
align-content: flex-start;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
grid-auto-columns: minmax(auto, max-content) auto max-content;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.menu li.disabled {
|
||||
cursor: not-allowed;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
user-select: none;
|
||||
color: var(--fallback-bc,oklch(var(--bc)/0.3));
|
||||
}
|
||||
|
||||
.menu :where(li > .menu-dropdown:not(.menu-dropdown-show)) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
:where(.menu li) {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-shrink: 0;
|
||||
flex-direction: column;
|
||||
flex-wrap: wrap;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
:where(.menu li) .badge {
|
||||
justify-self: end;
|
||||
}
|
||||
|
||||
.navbar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -1499,88 +1318,6 @@ html {
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
:where(.menu li:empty) {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-bg-opacity)));
|
||||
opacity: 0.1;
|
||||
margin: 0.5rem 1rem;
|
||||
height: 1px;
|
||||
}
|
||||
|
||||
.menu :where(li ul):before {
|
||||
position: absolute;
|
||||
bottom: 0.75rem;
|
||||
inset-inline-start: 0px;
|
||||
top: 0.75rem;
|
||||
width: 1px;
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-bg-opacity)));
|
||||
opacity: 0.1;
|
||||
content: "";
|
||||
}
|
||||
|
||||
.menu :where(li:not(.menu-title) > *:not(ul, details, .menu-title, .btn)),
|
||||
.menu :where(li:not(.menu-title) > details > summary:not(.menu-title)) {
|
||||
border-radius: var(--rounded-btn, 0.5rem);
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
padding-top: 0.5rem;
|
||||
padding-bottom: 0.5rem;
|
||||
text-align: start;
|
||||
transition-property: 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, -webkit-backdrop-filter;
|
||||
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
|
||||
transition-duration: 200ms;
|
||||
text-wrap: balance;
|
||||
}
|
||||
|
||||
:where(.menu li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title)):not(summary, .active, .btn).focus, :where(.menu li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title)):not(summary, .active, .btn):focus, :where(.menu li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title)):is(summary):not(.active, .btn):focus-visible, :where(.menu li:not(.menu-title, .disabled) > details > summary:not(.menu-title)):not(summary, .active, .btn).focus, :where(.menu li:not(.menu-title, .disabled) > details > summary:not(.menu-title)):not(summary, .active, .btn):focus, :where(.menu li:not(.menu-title, .disabled) > details > summary:not(.menu-title)):is(summary):not(.active, .btn):focus-visible {
|
||||
cursor: pointer;
|
||||
background-color: var(--fallback-bc,oklch(var(--bc)/0.1));
|
||||
--tw-text-opacity: 1;
|
||||
color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));
|
||||
outline: 2px solid transparent;
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
.menu li > *:not(ul, .menu-title, details, .btn):active,
|
||||
.menu li > *:not(ul, .menu-title, details, .btn).active,
|
||||
.menu li > details > summary:active {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));
|
||||
--tw-text-opacity: 1;
|
||||
color: var(--fallback-nc,oklch(var(--nc)/var(--tw-text-opacity)));
|
||||
}
|
||||
|
||||
.menu :where(li > details > summary)::-webkit-details-marker {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.menu :where(li > details > summary):after,
|
||||
.menu :where(li > .menu-dropdown-toggle):after {
|
||||
justify-self: end;
|
||||
display: block;
|
||||
margin-top: -0.5rem;
|
||||
height: 0.5rem;
|
||||
width: 0.5rem;
|
||||
transform: rotate(45deg);
|
||||
transition-property: transform, margin-top;
|
||||
transition-duration: 0.3s;
|
||||
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
||||
content: "";
|
||||
transform-origin: 75% 75%;
|
||||
box-shadow: 2px 2px;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.menu :where(li > details[open] > summary):after,
|
||||
.menu :where(li > .menu-dropdown-toggle.menu-dropdown-show):after {
|
||||
transform: rotate(225deg);
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.mockup-browser .mockup-browser-toolbar .input {
|
||||
position: relative;
|
||||
margin-left: auto;
|
||||
@ -1903,30 +1640,6 @@ html {
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.range-xs {
|
||||
height: 1rem;
|
||||
}
|
||||
|
||||
.range-xs::-webkit-slider-runnable-track {
|
||||
height: 0.25rem;
|
||||
}
|
||||
|
||||
.range-xs::-moz-range-track {
|
||||
height: 0.25rem;
|
||||
}
|
||||
|
||||
.range-xs::-webkit-slider-thumb {
|
||||
height: 1rem;
|
||||
width: 1rem;
|
||||
--filler-offset: 0.4rem;
|
||||
}
|
||||
|
||||
.range-xs::-moz-range-thumb {
|
||||
height: 1rem;
|
||||
width: 1rem;
|
||||
--filler-offset: 0.4rem;
|
||||
}
|
||||
|
||||
.steps-horizontal .step {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(1, minmax(0, 1fr));
|
||||
@ -2000,10 +1713,6 @@ html {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.z-\[1\] {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.mx-2 {
|
||||
margin-left: 0.5rem;
|
||||
margin-right: 0.5rem;
|
||||
@ -2018,40 +1727,24 @@ html {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.mt-2 {
|
||||
margin-top: 0.5rem;
|
||||
.mb-4 {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.mt-3 {
|
||||
margin-top: 0.75rem;
|
||||
}
|
||||
|
||||
.mt-4 {
|
||||
margin-top: 1rem;
|
||||
.mb-6 {
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.mr-auto {
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.mb-4 {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.ml-1 {
|
||||
margin-left: 0.25rem;
|
||||
}
|
||||
|
||||
.ml-2 {
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
|
||||
.mt-1 {
|
||||
margin-top: 0.25rem;
|
||||
}
|
||||
|
||||
.mb-6 {
|
||||
margin-bottom: 1.5rem;
|
||||
.mt-2 {
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
.block {
|
||||
@ -2066,8 +1759,8 @@ html {
|
||||
display: table;
|
||||
}
|
||||
|
||||
.w-52 {
|
||||
width: 13rem;
|
||||
.min-h-screen {
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.w-full {
|
||||
@ -2078,14 +1771,6 @@ html {
|
||||
min-width: 100%;
|
||||
}
|
||||
|
||||
.flex-1 {
|
||||
flex: 1 1 0%;
|
||||
}
|
||||
|
||||
.flex-auto {
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
|
||||
.flex-initial {
|
||||
flex: 0 1 auto;
|
||||
}
|
||||
@ -2106,28 +1791,12 @@ html {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.justify-between {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.space-y-4 > :not([hidden]) ~ :not([hidden]) {
|
||||
--tw-space-y-reverse: 0;
|
||||
margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
|
||||
margin-bottom: calc(1rem * var(--tw-space-y-reverse));
|
||||
}
|
||||
|
||||
.space-x-2 > :not([hidden]) ~ :not([hidden]) {
|
||||
--tw-space-x-reverse: 0;
|
||||
margin-right: calc(0.5rem * var(--tw-space-x-reverse));
|
||||
margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
|
||||
}
|
||||
|
||||
.space-x-1 > :not([hidden]) ~ :not([hidden]) {
|
||||
--tw-space-x-reverse: 0;
|
||||
margin-right: calc(0.25rem * var(--tw-space-x-reverse));
|
||||
margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)));
|
||||
}
|
||||
|
||||
.space-y-2 > :not([hidden]) ~ :not([hidden]) {
|
||||
--tw-space-y-reverse: 0;
|
||||
margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
|
||||
@ -2155,14 +1824,6 @@ html {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.break-keep {
|
||||
word-break: keep-all;
|
||||
}
|
||||
|
||||
.rounded-box {
|
||||
border-radius: var(--rounded-box, 1rem);
|
||||
}
|
||||
|
||||
.rounded {
|
||||
border-radius: 0.25rem;
|
||||
}
|
||||
@ -2176,14 +1837,9 @@ html {
|
||||
border-color: rgb(96 165 250 / var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.bg-primary {
|
||||
.bg-accent {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: var(--fallback-p,oklch(var(--p)/var(--tw-bg-opacity)));
|
||||
}
|
||||
|
||||
.bg-base-100 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));
|
||||
background-color: rgb(237 233 254 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-blue-100 {
|
||||
@ -2196,19 +1852,29 @@ html {
|
||||
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-gray-200 {
|
||||
.bg-info {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(229 231 235 / var(--tw-bg-opacity));
|
||||
background-color: rgb(56 189 248 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-gray-50 {
|
||||
.bg-primary {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(249 250 251 / var(--tw-bg-opacity));
|
||||
background-color: rgb(236 72 153 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-green-100 {
|
||||
.bg-red-500 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(220 252 231 / var(--tw-bg-opacity));
|
||||
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-secondary {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(196 181 253 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-success {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(110 231 183 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-white {
|
||||
@ -2216,6 +1882,25 @@ html {
|
||||
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-gradient-to-r {
|
||||
background-image: linear-gradient(to right, var(--tw-gradient-stops));
|
||||
}
|
||||
|
||||
.from-blue-400 {
|
||||
--tw-gradient-from: #60a5fa var(--tw-gradient-from-position);
|
||||
--tw-gradient-to: rgb(96 165 250 / 0) var(--tw-gradient-to-position);
|
||||
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
|
||||
}
|
||||
|
||||
.via-purple-400 {
|
||||
--tw-gradient-to: rgb(192 132 252 / 0) var(--tw-gradient-to-position);
|
||||
--tw-gradient-stops: var(--tw-gradient-from), #c084fc var(--tw-gradient-via-position), var(--tw-gradient-to);
|
||||
}
|
||||
|
||||
.to-pink-400 {
|
||||
--tw-gradient-to: #f472b6 var(--tw-gradient-to-position);
|
||||
}
|
||||
|
||||
.p-2 {
|
||||
padding: 0.5rem;
|
||||
}
|
||||
@ -2257,14 +1942,9 @@ html {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.text-xl {
|
||||
font-size: 1.25rem;
|
||||
line-height: 1.75rem;
|
||||
}
|
||||
|
||||
.text-sm {
|
||||
font-size: 0.875rem;
|
||||
line-height: 1.25rem;
|
||||
.text-2xl {
|
||||
font-size: 1.5rem;
|
||||
line-height: 2rem;
|
||||
}
|
||||
|
||||
.text-3xl {
|
||||
@ -2277,28 +1957,24 @@ html {
|
||||
line-height: 1.75rem;
|
||||
}
|
||||
|
||||
.text-2xl {
|
||||
font-size: 1.5rem;
|
||||
line-height: 2rem;
|
||||
.text-sm {
|
||||
font-size: 0.875rem;
|
||||
line-height: 1.25rem;
|
||||
}
|
||||
|
||||
.text-xs {
|
||||
font-size: 0.75rem;
|
||||
line-height: 1rem;
|
||||
}
|
||||
|
||||
.font-medium {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.font-semibold {
|
||||
font-weight: 600;
|
||||
.text-xl {
|
||||
font-size: 1.25rem;
|
||||
line-height: 1.75rem;
|
||||
}
|
||||
|
||||
.font-bold {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.font-medium {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.uppercase {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@ -2307,16 +1983,6 @@ html {
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
.text-primary-content {
|
||||
--tw-text-opacity: 1;
|
||||
color: var(--fallback-pc,oklch(var(--pc)/var(--tw-text-opacity)));
|
||||
}
|
||||
|
||||
.text-red-500 {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(239 68 68 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.text-blue-500 {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(59 130 246 / var(--tw-text-opacity));
|
||||
@ -2337,14 +2003,23 @@ html {
|
||||
color: rgb(17 24 39 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.underline {
|
||||
text-decoration-line: underline;
|
||||
.text-primary-content {
|
||||
--tw-text-opacity: 1;
|
||||
color: var(--fallback-pc,oklch(var(--pc)/var(--tw-text-opacity)));
|
||||
}
|
||||
|
||||
.shadow {
|
||||
--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
|
||||
--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
|
||||
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
||||
.text-red-500 {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(239 68 68 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.text-white {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(255 255 255 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.underline {
|
||||
text-decoration-line: underline;
|
||||
}
|
||||
|
||||
@media (min-width: 640px) {
|
||||
@ -2352,13 +2027,3 @@ html {
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.md\:w-8\/12 {
|
||||
width: 66.666667%;
|
||||
}
|
||||
|
||||
.md\:flex-row {
|
||||
flex-direction: row;
|
||||
}
|
||||
}
|
||||
@ -2,10 +2,38 @@
|
||||
module.exports = {
|
||||
content: ["./templates/**/*.{html,htm}"],
|
||||
theme: {
|
||||
extend: {},
|
||||
extend: {
|
||||
colors: {
|
||||
primary: '#ec4899',
|
||||
secondary: '#c4b5fd',
|
||||
accent: '#ede9fe',
|
||||
neutral: '#0e7490',
|
||||
'base-100': '#fff5f1',
|
||||
info: '#38bdf8',
|
||||
success: '#6ee7b7',
|
||||
warning: '#fbbf24',
|
||||
error: '#ef4444',
|
||||
},
|
||||
},
|
||||
},
|
||||
daisyui: {
|
||||
themes: [
|
||||
{
|
||||
mytheme: {
|
||||
"primary": "#ec4899",
|
||||
"secondary": "#c4b5fd",
|
||||
"accent": "#ede9fe",
|
||||
"neutral": "#0e7490",
|
||||
"base-100": "#fff5f1",
|
||||
"info": "#38bdf8",
|
||||
"success": "#6ee7b7",
|
||||
"warning": "#fbbf24",
|
||||
"error": "#ef4444",
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
plugins: [
|
||||
require('daisyui'),
|
||||
require('daisyui'),
|
||||
],
|
||||
}
|
||||
|
||||
|
||||
@ -1,27 +1,32 @@
|
||||
<!doctype html>
|
||||
<title>{% block title %}{% endblock %} - TheraPy jetzt</title>
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}">
|
||||
|
||||
<html lang="de" data-theme="therapytheme">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>{% block title %}{% endblock %} - TheraPy jetzt</title>
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="navbar bg-primary text-primary-content justify-center items-center text-center">
|
||||
<div class="flex">
|
||||
<a class="btn btn-ghost text-xl" href="#">TheraPy</a>
|
||||
</div>
|
||||
<div class=" flex justify-center mr-auto">
|
||||
<a class="mx-2">Home</a>
|
||||
<a class="mx-2">About</a>
|
||||
<div class="bg-gradient-to-r from-blue-400 via-purple-400 to-pink-400 min-h-screen">
|
||||
<nav class="navbar bg-primary text-primary-content justify-center items-center text-center">
|
||||
<div class="flex">
|
||||
<a class="btn btn-ghost text-xl" href="#">TheraPy</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<section class="content">
|
||||
<header>
|
||||
{% block header %}{% endblock %}
|
||||
</header>
|
||||
{% for message in get_flashed_messages() %}
|
||||
<div class="flash">{{ message }}</div>
|
||||
{% endfor %}
|
||||
{% block content %}{% endblock %}
|
||||
</section>
|
||||
<div class="flex justify-center mr-auto">
|
||||
<a class="mx-2" href="#">Home</a>
|
||||
<a class="mx-2" href="#">About</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<section class="content p-4">
|
||||
<header>
|
||||
{% block header %}{% endblock %}
|
||||
</header>
|
||||
{% for message in get_flashed_messages() %}
|
||||
<div class="flash bg-red-500 text-white p-2 mb-2 rounded">{{ message }}</div>
|
||||
{% endfor %}
|
||||
{% block content %}{% endblock %}
|
||||
</section>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -36,23 +36,23 @@
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="bg-white divide-y divide-gray-200">
|
||||
{% set day_classes = {
|
||||
"1": "bg-gray-200",
|
||||
"2": "bg-green-100",
|
||||
"3": "bg-blue-100",
|
||||
"4": "bg-gray-50",
|
||||
"5": "bg-blue-100",
|
||||
} %}
|
||||
{% set day_classes = {
|
||||
"1": "bg-secondary",
|
||||
"2": "bg-success",
|
||||
"3": "bg-info",
|
||||
"4": "bg-accent",
|
||||
"5": "bg-primary",
|
||||
} %}
|
||||
{% for doctor in doctors %}
|
||||
<tr class="{{ day_classes.get(doctor.phone_time.start.strftime("%w"), 'bg-white') }}">
|
||||
<th scope="row"
|
||||
class="px-6 py-4 whitespace-nowrap text-lg font-medium text-gray-900">{{ doctor.doctor_nr }}</th>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-lg text-gray-500">{{ doctor.doctor_name }}</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-lg text-gray-500">{{ doctor.phone_time.start.strftime("%A %d.%m") }}</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-lg text-gray-500">{{ doctor.phone_time.start.strftime("%H:%M") }}
|
||||
class="px-6 py-4 whitespace-nowrap text-lg font-medium">{{ doctor.doctor_nr }}</th>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-lg">{{ doctor.doctor_name }}</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-lg">{{ doctor.phone_time.start.strftime("%A %d.%m") }}</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-lg">{{ doctor.phone_time.start.strftime("%H:%M") }}
|
||||
bis {{ doctor.phone_time.end.strftime("%H:%M") }}</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-lg text-gray-500">{{ doctor.doctor_phone_number }}</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-lg text-gray-500">{{ doctor.doctor_address }}</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-lg">{{ doctor.doctor_phone_number }}</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-lg">{{ doctor.doctor_address }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user