andrie/C_UAS_WEBGIS_AndrieWijaya_D1041231032
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

style(01/index.html): fix hardcoded colors, remove uppercase labels

Browse Source
This commit is contained in:
Andrie
2026-06-08 22:17:00 +07:00
parent 5489bff0eb
commit d2214ad9c8
1 changed files with 29 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files
01/index.html
+29 -36
View File
@@ -105,8 +105,8 @@
align-items: center; align-items: center;
gap: 6px; gap: 6px;
padding: 5px 12px; padding: 5px 12px;
background: rgba(46, 160, 67, .12); background: rgba(13, 116, 144, .12);
border: 1px solid rgba(46, 160, 67, .3); border: 1px solid rgba(13, 116, 144, .3);
border-radius: 20px; border-radius: 20px;
font-size: 12px; font-size: 12px;
font-weight: 600; font-weight: 600;
@@ -239,7 +239,7 @@
width: 36px; width: 36px;
height: 36px; height: 36px;
border-radius: 8px; border-radius: 8px;
background: rgba(46, 160, 67, .15); background: rgba(13, 116, 144, .15);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@@ -264,11 +264,9 @@
.form-group label { .form-group label {
display: block; display: block;
font-size: 11px; font-size: 13px;
font-weight: 600; font-weight: 500;
color: var(--c-muted); color: #3d3530;
text-transform: uppercase;
letter-spacing: .6px;
margin-bottom: 6px; margin-bottom: 6px;
} }
@@ -345,12 +343,12 @@
background: var(--c-accent); background: var(--c-accent);
color: #fff; color: #fff;
border: none; border: none;
border-radius: 7px; border-radius: 8px;
font-family: var(--font-body); font-family: var(--font-body);
font-size: 13px; font-size: 14px;
font-weight: 700; font-weight: 600;
cursor: pointer; cursor: pointer;
transition: background .2s, transform .1s; transition: background .2s;
margin-top: 4px; margin-top: 4px;
} }
@@ -358,14 +356,9 @@
background: var(--c-accent-h); background: var(--c-accent-h);
} }
.btn-save:active {
transform: scale(.98);
}
.btn-save:disabled { .btn-save:disabled {
opacity: .5; opacity: .5;
cursor: not-allowed; cursor: not-allowed;
transform: none;
} }
.form-status { .form-status {
@@ -400,7 +393,7 @@
width: 38px; width: 38px;
height: 38px; height: 38px;
border-radius: 8px; border-radius: 8px;
background: rgba(46, 160, 67, .15); background: rgba(13, 116, 144, .15);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@@ -434,7 +427,7 @@
width: 28px; width: 28px;
height: 28px; height: 28px;
border-radius: 6px; border-radius: 6px;
background: rgba(255, 255, 255, .05); background: rgba(0, 0, 0, .04);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@@ -465,15 +458,15 @@
} }
.badge-open.yes { .badge-open.yes {
background: rgba(46, 160, 67, .2); background: rgba(13, 116, 144, .15);
color: var(--c-accent-h); color: var(--c-accent-h);
border: 1px solid rgba(46, 160, 67, .35); border: 1px solid rgba(13, 116, 144, .3);
} }
.badge-open.no { .badge-open.no {
background: rgba(248, 81, 73, .12); background: rgba(239, 68, 68, .12);
color: var(--c-danger); color: var(--c-danger);
border: 1px solid rgba(248, 81, 73, .3); border: 1px solid rgba(239, 68, 68, .3);
} }
.btn-wa { .btn-wa {
@@ -509,18 +502,18 @@
padding: 9px; padding: 9px;
background: transparent; background: transparent;
color: var(--c-danger); color: var(--c-danger);
border: 1px solid rgba(248, 81, 73, .35); border: 1px solid rgba(239, 68, 68, .4);
border-radius: 7px; border-radius: 7px;
font-family: var(--font-body); font-family: var(--font-body);
font-size: 13px; font-size: 13px;
font-weight: 700; font-weight: 600;
cursor: pointer; cursor: pointer;
transition: all .2s; transition: all .2s;
} }
.btn-hapus:hover { .btn-hapus:hover {
background: rgba(248, 81, 73, .12); background: rgba(239, 68, 68, .08);
border-color: var(--c-danger); border-color: #ef4444;
} }
/* ── Notification Toast ───────────────────────── */ /* ── Notification Toast ───────────────────────── */
@@ -591,7 +584,7 @@
gap: 10px; gap: 10px;
padding: 14px 16px; padding: 14px 16px;
border-bottom: 1px solid var(--c-border); border-bottom: 1px solid var(--c-border);
font-weight: 700; font-weight: 600;
} }
.confirm-icon { .confirm-icon {
@@ -642,24 +635,24 @@
} }
.btn-confirm-delete { .btn-confirm-delete {
border: 1px solid var(--c-danger); border: 1px solid #ef4444;
background: rgba(248, 81, 73, .15); background: rgba(239, 68, 68, .08);
color: #ffb3ad; color: #ef4444;
} }
.btn-confirm-delete:hover { .btn-confirm-delete:hover {
background: rgba(248, 81, 73, .28); background: rgba(239, 68, 68, .15);
} }
/* ── Leaflet Dark Attribution ─────────────────── */ /* ── Leaflet Light Attribution ─────────────────── */
.leaflet-control-attribution { .leaflet-control-attribution {
background: rgba(13, 17, 23, .8) !important; background: rgba(250, 250, 249, .88) !important;
color: var(--c-muted) !important; color: var(--c-muted) !important;
font-size: 10px !important; font-size: 10px !important;
} }
.leaflet-control-attribution a { .leaflet-control-attribution a {
color: var(--c-accent) !important; color: #3d3530 !important;
} }
.leaflet-control-zoom a { .leaflet-control-zoom a {
@@ -669,7 +662,7 @@
} }
.leaflet-control-zoom a:hover { .leaflet-control-zoom a:hover {
background: var(--c-border) !important; background: #ede8e2 !important;
} }
/* ── Loading Overlay ──────────────────────────── */ /* ── Loading Overlay ──────────────────────────── */