web: refine style

This commit is contained in:
2025-11-14 15:40:33 -06:00
parent 95ad6eca00
commit ccda7dde9b
4 changed files with 15 additions and 8 deletions

View File

@@ -12,7 +12,7 @@
<style> <style>
:root { :root {
--site-max-width: 1500px; --site-max-width: 1500px;
--site-min-width: 900px; --site-min-width: 800px;
--box-border: 1px solid rgba(0, 0, 0, 0.2); --box-border: 1px solid rgba(0, 0, 0, 0.2);
--box-shadow: 0px 2px 4px -3px rgba(0, 0, 0, 0.2); --box-shadow: 0px 2px 4px -3px rgba(0, 0, 0, 0.2);
--border-radius: 4px; --border-radius: 4px;
@@ -29,11 +29,16 @@
padding: 0; padding: 0;
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
background-color: #333; background-color: #333;
min-width: 900px;
} }
.content { .content {
background-color: var(--contrast-10); background-color: var(--contrast-10);
padding-bottom: 36px; padding-bottom: 36px;
} }
*::selection {
background: var(--primary);
color: #fff;
}
</style> </style>
</head> </head>
<body> <body>

View File

@@ -7,12 +7,12 @@
.SectionButton { .SectionButton {
height: 48px; height: 48px;
width: 48px; width: 48px;
font-size: 16px; font-size: 14px;
border: 0; border: 0;
background-color: transparent; background-color: transparent;
margin: 8px 0 8px 0px; margin: 8px 0 8px 0px;
cursor: pointer; cursor: pointer;
color: var(--contrast-60); color: var(--contrast-80);
} }
.SectionButton:hover { .SectionButton:hover {
@@ -22,5 +22,5 @@
} }
.SectionButton:active { .SectionButton:active {
background-color: var(--contrast-60); background-color: var(--contrast-80);
} }

View File

@@ -36,7 +36,7 @@
.light { .light {
color: var(--contrast-80); color: var(--contrast-80);
background: linear-gradient(var(--contrast-0) 25%, var(--contrast-10) 100%); background-color: var(--contrast-0)
} }
.light:hover { .light:hover {
@@ -49,11 +49,13 @@
.primary { .primary {
color: white; color: white;
background: linear-gradient(var(--primary) 25%, color-mix(in hsl, #000, var(--primary) 90%) 100%); border-color: color-mix(in hsl, #000, var(--primary) 90%);
background-color: var(--primary);
text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
} }
.primary:hover { .primary:hover {
background: color-mix(in hsl, #fff, var(--primary) 90%); background: color-mix(in hsl, #000, var(--primary) 95%);
} }
.primary:active { .primary:active {

View File

@@ -71,7 +71,7 @@
.tabulator-row .tabulator-cell.tabulator-editing { .tabulator-row .tabulator-cell.tabulator-editing {
border: 0; border: 0;
padding: 0 4px; padding: 0 4px;
background-color: #cee; background-color: color-mix(in hsl, #fff, var(--primary) 50%);
} }
.tabulator-row .tabulator-cell.tabulator-editing input { .tabulator-row .tabulator-cell.tabulator-editing input {