adjust color theme
This commit is contained in:
Lea
parent
f4242e8935
commit
955bb572a3
@ -517,17 +517,18 @@ html {
|
|||||||
}
|
}
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
color-scheme: light;
|
--p: 65.592% 0.211773 354.308441;
|
||||||
--in: 72.06% 0.191 231.6;
|
--b2: 90.8446% 0.0112 43.281415;
|
||||||
--su: 64.8% 0.150 160;
|
--b3: 84.0068% 0.010357 43.281415;
|
||||||
--wa: 84.71% 0.199 83.87;
|
--bc: 19.5365% 0.002409 43.281415;
|
||||||
--er: 71.76% 0.221 22.18;
|
--pc: 13.1184% 0.042355 354.308441;
|
||||||
--pc: 89.824% 0.06192 275.75;
|
--sc: 16.2232% 0.020257 293.571186;
|
||||||
--ac: 15.352% 0.0368 183.61;
|
--ac: 18.867% 0.005681 294.587823;
|
||||||
--inc: 0% 0 0;
|
--nc: 90.3952% 0.018713 223.127977;
|
||||||
--suc: 0% 0 0;
|
--inc: 15.0703% 0.027798 232.66148;
|
||||||
--wac: 0% 0 0;
|
--suc: 16.9037% 0.02599 164.978166;
|
||||||
--erc: 0% 0 0;
|
--wac: 16.7372% 0.032884 84.428628;
|
||||||
|
--erc: 12.7367% 0.04157 25.331328;
|
||||||
--rounded-box: 1rem;
|
--rounded-box: 1rem;
|
||||||
--rounded-btn: 0.5rem;
|
--rounded-btn: 0.5rem;
|
||||||
--rounded-badge: 1.9rem;
|
--rounded-badge: 1.9rem;
|
||||||
@ -537,117 +538,14 @@ html {
|
|||||||
--border-btn: 1px;
|
--border-btn: 1px;
|
||||||
--tab-border: 1px;
|
--tab-border: 1px;
|
||||||
--tab-radius: 0.5rem;
|
--tab-radius: 0.5rem;
|
||||||
--p: 49.12% 0.3096 275.75;
|
--s: 81.1162% 0.101287 293.571186;
|
||||||
--s: 69.71% 0.329 342.55;
|
--a: 94.3348% 0.028406 294.587823;
|
||||||
--sc: 98.71% 0.0106 342.55;
|
--n: 51.9759% 0.093565 223.127977;
|
||||||
--a: 76.76% 0.184 183.61;
|
--b1: 97.6824% 0.012043 43.281415;
|
||||||
--n: 32.1785% 0.02476 255.701624;
|
--in: 75.3513% 0.138989 232.66148;
|
||||||
--nc: 89.4994% 0.011585 252.096176;
|
--su: 84.5186% 0.129948 164.978166;
|
||||||
--b1: 100% 0 0;
|
--wa: 83.6861% 0.164422 84.428628;
|
||||||
--b2: 96.1151% 0 0;
|
--er: 63.6834% 0.207849 25.331328;
|
||||||
--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;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
*, ::before, ::after {
|
*, ::before, ::after {
|
||||||
@ -839,15 +737,6 @@ html {
|
|||||||
color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));
|
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 {
|
.radio-primary:hover {
|
||||||
--tw-border-opacity: 1;
|
--tw-border-opacity: 1;
|
||||||
border-color: var(--fallback-p,oklch(var(--p)/var(--tw-border-opacity)));
|
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);
|
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 {
|
.label {
|
||||||
@ -1069,59 +941,6 @@ html {
|
|||||||
text-decoration-line: underline;
|
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 {
|
.navbar {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@ -1499,88 +1318,6 @@ html {
|
|||||||
outline-offset: 2px;
|
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 {
|
.mockup-browser .mockup-browser-toolbar .input {
|
||||||
position: relative;
|
position: relative;
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
@ -1903,30 +1640,6 @@ html {
|
|||||||
padding: 0px;
|
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 {
|
.steps-horizontal .step {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(1, minmax(0, 1fr));
|
grid-template-columns: repeat(1, minmax(0, 1fr));
|
||||||
@ -2000,10 +1713,6 @@ html {
|
|||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.z-\[1\] {
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mx-2 {
|
.mx-2 {
|
||||||
margin-left: 0.5rem;
|
margin-left: 0.5rem;
|
||||||
margin-right: 0.5rem;
|
margin-right: 0.5rem;
|
||||||
@ -2018,40 +1727,24 @@ html {
|
|||||||
margin-bottom: 0.5rem;
|
margin-bottom: 0.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mt-2 {
|
.mb-4 {
|
||||||
margin-top: 0.5rem;
|
margin-bottom: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mt-3 {
|
.mb-6 {
|
||||||
margin-top: 0.75rem;
|
margin-bottom: 1.5rem;
|
||||||
}
|
|
||||||
|
|
||||||
.mt-4 {
|
|
||||||
margin-top: 1rem;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.mr-auto {
|
.mr-auto {
|
||||||
margin-right: auto;
|
margin-right: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mb-4 {
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ml-1 {
|
|
||||||
margin-left: 0.25rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ml-2 {
|
|
||||||
margin-left: 0.5rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mt-1 {
|
.mt-1 {
|
||||||
margin-top: 0.25rem;
|
margin-top: 0.25rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mb-6 {
|
.mt-2 {
|
||||||
margin-bottom: 1.5rem;
|
margin-top: 0.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.block {
|
.block {
|
||||||
@ -2066,8 +1759,8 @@ html {
|
|||||||
display: table;
|
display: table;
|
||||||
}
|
}
|
||||||
|
|
||||||
.w-52 {
|
.min-h-screen {
|
||||||
width: 13rem;
|
min-height: 100vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
.w-full {
|
.w-full {
|
||||||
@ -2078,14 +1771,6 @@ html {
|
|||||||
min-width: 100%;
|
min-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.flex-1 {
|
|
||||||
flex: 1 1 0%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.flex-auto {
|
|
||||||
flex: 1 1 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.flex-initial {
|
.flex-initial {
|
||||||
flex: 0 1 auto;
|
flex: 0 1 auto;
|
||||||
}
|
}
|
||||||
@ -2106,28 +1791,12 @@ html {
|
|||||||
justify-content: center;
|
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]) {
|
.space-x-2 > :not([hidden]) ~ :not([hidden]) {
|
||||||
--tw-space-x-reverse: 0;
|
--tw-space-x-reverse: 0;
|
||||||
margin-right: calc(0.5rem * var(--tw-space-x-reverse));
|
margin-right: calc(0.5rem * var(--tw-space-x-reverse));
|
||||||
margin-left: calc(0.5rem * calc(1 - 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]) {
|
.space-y-2 > :not([hidden]) ~ :not([hidden]) {
|
||||||
--tw-space-y-reverse: 0;
|
--tw-space-y-reverse: 0;
|
||||||
margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
|
margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
|
||||||
@ -2155,14 +1824,6 @@ html {
|
|||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
.break-keep {
|
|
||||||
word-break: keep-all;
|
|
||||||
}
|
|
||||||
|
|
||||||
.rounded-box {
|
|
||||||
border-radius: var(--rounded-box, 1rem);
|
|
||||||
}
|
|
||||||
|
|
||||||
.rounded {
|
.rounded {
|
||||||
border-radius: 0.25rem;
|
border-radius: 0.25rem;
|
||||||
}
|
}
|
||||||
@ -2176,14 +1837,9 @@ html {
|
|||||||
border-color: rgb(96 165 250 / var(--tw-border-opacity));
|
border-color: rgb(96 165 250 / var(--tw-border-opacity));
|
||||||
}
|
}
|
||||||
|
|
||||||
.bg-primary {
|
.bg-accent {
|
||||||
--tw-bg-opacity: 1;
|
--tw-bg-opacity: 1;
|
||||||
background-color: var(--fallback-p,oklch(var(--p)/var(--tw-bg-opacity)));
|
background-color: rgb(237 233 254 / var(--tw-bg-opacity));
|
||||||
}
|
|
||||||
|
|
||||||
.bg-base-100 {
|
|
||||||
--tw-bg-opacity: 1;
|
|
||||||
background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.bg-blue-100 {
|
.bg-blue-100 {
|
||||||
@ -2196,19 +1852,29 @@ html {
|
|||||||
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
|
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
|
||||||
}
|
}
|
||||||
|
|
||||||
.bg-gray-200 {
|
.bg-info {
|
||||||
--tw-bg-opacity: 1;
|
--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;
|
--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;
|
--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 {
|
.bg-white {
|
||||||
@ -2216,6 +1882,25 @@ html {
|
|||||||
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
|
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 {
|
.p-2 {
|
||||||
padding: 0.5rem;
|
padding: 0.5rem;
|
||||||
}
|
}
|
||||||
@ -2257,14 +1942,9 @@ html {
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.text-xl {
|
.text-2xl {
|
||||||
font-size: 1.25rem;
|
font-size: 1.5rem;
|
||||||
line-height: 1.75rem;
|
line-height: 2rem;
|
||||||
}
|
|
||||||
|
|
||||||
.text-sm {
|
|
||||||
font-size: 0.875rem;
|
|
||||||
line-height: 1.25rem;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.text-3xl {
|
.text-3xl {
|
||||||
@ -2277,28 +1957,24 @@ html {
|
|||||||
line-height: 1.75rem;
|
line-height: 1.75rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.text-2xl {
|
.text-sm {
|
||||||
font-size: 1.5rem;
|
font-size: 0.875rem;
|
||||||
line-height: 2rem;
|
line-height: 1.25rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.text-xs {
|
.text-xl {
|
||||||
font-size: 0.75rem;
|
font-size: 1.25rem;
|
||||||
line-height: 1rem;
|
line-height: 1.75rem;
|
||||||
}
|
|
||||||
|
|
||||||
.font-medium {
|
|
||||||
font-weight: 500;
|
|
||||||
}
|
|
||||||
|
|
||||||
.font-semibold {
|
|
||||||
font-weight: 600;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.font-bold {
|
.font-bold {
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.font-medium {
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
.uppercase {
|
.uppercase {
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
}
|
}
|
||||||
@ -2307,16 +1983,6 @@ html {
|
|||||||
letter-spacing: 0.05em;
|
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 {
|
.text-blue-500 {
|
||||||
--tw-text-opacity: 1;
|
--tw-text-opacity: 1;
|
||||||
color: rgb(59 130 246 / var(--tw-text-opacity));
|
color: rgb(59 130 246 / var(--tw-text-opacity));
|
||||||
@ -2337,14 +2003,23 @@ html {
|
|||||||
color: rgb(17 24 39 / var(--tw-text-opacity));
|
color: rgb(17 24 39 / var(--tw-text-opacity));
|
||||||
}
|
}
|
||||||
|
|
||||||
.underline {
|
.text-primary-content {
|
||||||
text-decoration-line: underline;
|
--tw-text-opacity: 1;
|
||||||
|
color: var(--fallback-pc,oklch(var(--pc)/var(--tw-text-opacity)));
|
||||||
}
|
}
|
||||||
|
|
||||||
.shadow {
|
.text-red-500 {
|
||||||
--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
|
--tw-text-opacity: 1;
|
||||||
--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
|
color: rgb(239 68 68 / var(--tw-text-opacity));
|
||||||
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
}
|
||||||
|
|
||||||
|
.text-white {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(255 255 255 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
|
.underline {
|
||||||
|
text-decoration-line: underline;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (min-width: 640px) {
|
@media (min-width: 640px) {
|
||||||
@ -2352,13 +2027,3 @@ html {
|
|||||||
display: inline;
|
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 = {
|
module.exports = {
|
||||||
content: ["./templates/**/*.{html,htm}"],
|
content: ["./templates/**/*.{html,htm}"],
|
||||||
theme: {
|
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: [
|
plugins: [
|
||||||
require('daisyui'),
|
require('daisyui'),
|
||||||
],
|
],
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -1,27 +1,32 @@
|
|||||||
<!doctype html>
|
<!doctype html>
|
||||||
|
<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>
|
<title>{% block title %}{% endblock %} - TheraPy jetzt</title>
|
||||||
<link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}">
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}">
|
||||||
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<div class="bg-gradient-to-r from-blue-400 via-purple-400 to-pink-400 min-h-screen">
|
||||||
<div class="navbar bg-primary text-primary-content justify-center items-center text-center">
|
<nav class="navbar bg-primary text-primary-content justify-center items-center text-center">
|
||||||
<div class="flex">
|
<div class="flex">
|
||||||
<a class="btn btn-ghost text-xl" href="#">TheraPy</a>
|
<a class="btn btn-ghost text-xl" href="#">TheraPy</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex justify-center mr-auto">
|
<div class="flex justify-center mr-auto">
|
||||||
<a class="mx-2">Home</a>
|
<a class="mx-2" href="#">Home</a>
|
||||||
<a class="mx-2">About</a>
|
<a class="mx-2" href="#">About</a>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
<section class="content">
|
<section class="content p-4">
|
||||||
<header>
|
<header>
|
||||||
{% block header %}{% endblock %}
|
{% block header %}{% endblock %}
|
||||||
</header>
|
</header>
|
||||||
{% for message in get_flashed_messages() %}
|
{% for message in get_flashed_messages() %}
|
||||||
<div class="flash">{{ message }}</div>
|
<div class="flash bg-red-500 text-white p-2 mb-2 rounded">{{ message }}</div>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
{% block content %}{% endblock %}
|
{% block content %}{% endblock %}
|
||||||
</section>
|
</section>
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
|
</html>
|
||||||
|
|||||||
@ -37,22 +37,22 @@
|
|||||||
</thead>
|
</thead>
|
||||||
<tbody class="bg-white divide-y divide-gray-200">
|
<tbody class="bg-white divide-y divide-gray-200">
|
||||||
{% set day_classes = {
|
{% set day_classes = {
|
||||||
"1": "bg-gray-200",
|
"1": "bg-secondary",
|
||||||
"2": "bg-green-100",
|
"2": "bg-success",
|
||||||
"3": "bg-blue-100",
|
"3": "bg-info",
|
||||||
"4": "bg-gray-50",
|
"4": "bg-accent",
|
||||||
"5": "bg-blue-100",
|
"5": "bg-primary",
|
||||||
} %}
|
} %}
|
||||||
{% for doctor in doctors %}
|
{% for doctor in doctors %}
|
||||||
<tr class="{{ day_classes.get(doctor.phone_time.start.strftime("%w"), 'bg-white') }}">
|
<tr class="{{ day_classes.get(doctor.phone_time.start.strftime("%w"), 'bg-white') }}">
|
||||||
<th scope="row"
|
<th scope="row"
|
||||||
class="px-6 py-4 whitespace-nowrap text-lg font-medium text-gray-900">{{ doctor.doctor_nr }}</th>
|
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 text-gray-500">{{ doctor.doctor_name }}</td>
|
<td class="px-6 py-4 whitespace-nowrap text-lg">{{ 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">{{ 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") }}
|
<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>
|
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">{{ 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_address }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</tbody>
|
</tbody>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user