starred/minne
1
0
Fork 0
mirror of https://github.com/perstarkse/minne.git synced 2026-04-10 19:26:53 +02:00
Code Issues Packages Projects Releases 10 Wiki Activity

feat: consistent styling

Browse Source
This commit is contained in:
Per Stark
2024-12-28 23:54:58 +01:00
parent bdf7a12e9c
commit 0110ffa5bf
18 changed files with 256 additions and 209 deletions
Download Patch File Download Diff File Expand all files Collapse all files

145
assets/style.css
View File

@@ -1007,6 +1007,16 @@ html {
}
@media (hover: hover) {
.btm-nav > *.disabled:hover,
.btm-nav > *[disabled]:hover {
pointer-events: none;
--tw-border-opacity: 0;
background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));
--tw-bg-opacity: 0.1;
color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));
--tw-text-opacity: 0.2;
}
.btn:hover {
--tw-border-opacity: 1;
border-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-border-opacity)));
@@ -1278,6 +1288,16 @@ html {
align-items: center;
}
.btm-nav > *.disabled,
.btm-nav > *[disabled] {
pointer-events: none;
--tw-border-opacity: 0;
background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));
--tw-bg-opacity: 0.1;
color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));
--tw-text-opacity: 0.2;
}
.btm-nav > * .label {
font-size: 1rem;
line-height: 1.5rem;
@@ -1304,6 +1324,14 @@ html {
.btn-primary {
--btn-color: var(--fallback-p);
}
.btn-secondary {
--btn-color: var(--fallback-s);
}
.btn-error {
--btn-color: var(--fallback-er);
}
}
@supports (color: color-mix(in oklab, black, black)) {
@@ -1359,6 +1387,26 @@ html {
.btn-primary {
--btn-color: var(--p);
}
.btn-secondary {
--btn-color: var(--s);
}
.btn-error {
--btn-color: var(--er);
}
}
.btn-secondary {
--tw-text-opacity: 1;
color: var(--fallback-sc,oklch(var(--sc)/var(--tw-text-opacity)));
outline-color: var(--fallback-s,oklch(var(--s)/1));
}
.btn-error {
--tw-text-opacity: 1;
color: var(--fallback-erc,oklch(var(--erc)/var(--tw-text-opacity)));
outline-color: var(--fallback-er,oklch(var(--er)/1));
}
.btn.glass {
@@ -1683,27 +1731,6 @@ html {
outline-offset: 2px;
}
.loading {
pointer-events: none;
display: inline-block;
aspect-ratio: 1 / 1;
width: 1.5rem;
background-color: currentColor;
-webkit-mask-size: 100%;
mask-size: 100%;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position: center;
mask-position: center;
-webkit-mask-image: url("data:image/svg+xml,%3Csvg width='24' height='24' stroke='black' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform-origin='center'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke-width='3' stroke-linecap='round'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dasharray' values='0,150;42,150;42,150' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dashoffset' values='0;-16;-59' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3C/svg%3E");
mask-image: url("data:image/svg+xml,%3Csvg width='24' height='24' stroke='black' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform-origin='center'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke-width='3' stroke-linecap='round'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dasharray' values='0,150;42,150;42,150' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dashoffset' values='0;-16;-59' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3C/svg%3E");
}
.loading-spinner {
-webkit-mask-image: url("data:image/svg+xml,%3Csvg width='24' height='24' stroke='black' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform-origin='center'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke-width='3' stroke-linecap='round'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dasharray' values='0,150;42,150;42,150' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dashoffset' values='0;-16;-59' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3C/svg%3E");
mask-image: url("data:image/svg+xml,%3Csvg width='24' height='24' stroke='black' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform-origin='center'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke-width='3' stroke-linecap='round'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dasharray' values='0,150;42,150;42,150' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dashoffset' values='0;-16;-59' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3C/svg%3E");
}
:where(.menu li:empty) {
--tw-bg-opacity: 1;
background-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-bg-opacity)));
@@ -1897,11 +1924,6 @@ html {
}
}
[type="checkbox"].checkbox-sm {
height: 1.25rem;
width: 1.25rem;
}
.menu-horizontal {
display: inline-flex;
flex-direction: row;
@@ -1950,14 +1972,6 @@ html {
margin-bottom: 2rem;
}
.mr-2 {
margin-right: 0.5rem;
}
.mt-2 {
margin-top: 0.5rem;
}
.mt-4 {
margin-top: 1rem;
}
@@ -1986,10 +2000,22 @@ html {
min-height: 100vh;
}
.min-h-full {
min-height: 100%;
}
.w-full {
width: 100%;
}
.min-w-20 {
min-width: 5rem;
}
.min-w-40 {
min-width: 10rem;
}
.max-w-2xl {
max-width: 42rem;
}
@@ -2010,6 +2036,10 @@ html {
flex: none;
}
.flex-grow {
flex-grow: 1;
}
.cursor-pointer {
cursor: pointer;
}
@@ -2030,12 +2060,20 @@ html {
align-items: center;
}
.justify-start {
justify-content: flex-start;
}
.justify-center {
justify-content: center;
}
.justify-between {
justify-content: space-between;
.gap-2 {
gap: 0.5rem;
}
.gap-4 {
gap: 1rem;
}
.space-y-4 > :not([hidden]) ~ :not([hidden]) {
@@ -2044,32 +2082,16 @@ html {
margin-bottom: calc(1rem * var(--tw-space-y-reverse));
}
.space-y-6 > :not([hidden]) ~ :not([hidden]) {
--tw-space-y-reverse: 0;
margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
}
.space-y-8 > :not([hidden]) ~ :not([hidden]) {
--tw-space-y-reverse: 0;
margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));
margin-bottom: calc(2rem * var(--tw-space-y-reverse));
}
.rounded-t-none {
border-top-left-radius: 0px;
border-top-right-radius: 0px;
}
.border-transparent {
border-color: transparent;
}
.bg-base-100 {
--tw-bg-opacity: 1;
background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity, 1)));
}
.bg-base-200 {
--tw-bg-opacity: 1;
background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity, 1)));
@@ -2099,25 +2121,11 @@ html {
background-clip: text;
}
.p-2 {
padding: 0.5rem;
}
.px-1 {
padding-left: 0.25rem;
padding-right: 0.25rem;
}
.px-4 {
padding-left: 1rem;
padding-right: 1rem;
}
.py-8 {
padding-top: 2rem;
padding-bottom: 2rem;
}
.text-center {
text-align: center;
}
@@ -2156,11 +2164,6 @@ html {
color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}
.text-primary {
--tw-text-opacity: 1;
color: var(--fallback-p,oklch(var(--p)/var(--tw-text-opacity, 1)));
}
.text-transparent {
color: transparent;
}