sbstp/sustenance
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases 10 Wiki Activity

style updates

Browse Source
This commit is contained in:
sbstp
2026-08-03 14:58:10 -04:00
parent a6482ddb0e
commit fdbf40adac
2 changed files with 24 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/style.css
+8 -1
View File
@@ -75,6 +75,10 @@ h3 { margin-bottom: 6px; font-size: 1rem; }
.stack label { color: var(--muted); font-size: .82rem; font-weight: 700; }
input { width: 100%; min-height: 46px; padding: 10px 13px; border: 1px solid var(--line); border-radius: 12px; outline: none; color: var(--ink); background: #fff; }
input:focus { border-color: var(--deep-sage); box-shadow: 0 0 0 4px rgba(85, 113, 93, .12); }
select { width: 100%; min-height: 46px; padding: 10px 34px 10px 13px; border: 1px solid var(--line); border-radius: 12px; outline: none; color: var(--ink); background: #fff; font: inherit; appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'><path d='M4 6l4 4 4-4' fill='none' stroke='%2355715d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>"); background-repeat: no-repeat; background-position: right 12px center; }
select:focus { border-color: var(--deep-sage); box-shadow: 0 0 0 4px rgba(85, 113, 93, .12); }
select option { color: var(--ink); background: #fff; }
select option:checked { color: var(--deep-sage); font-weight: 700; }
textarea { width: 100%; padding: 10px 13px; border: 1px solid var(--line); border-radius: 12px; outline: none; color: var(--ink); background: #fff; font: inherit; resize: vertical; }
textarea:focus { border-color: var(--deep-sage); box-shadow: 0 0 0 4px rgba(85, 113, 93, .12); }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 17px; border: 0; border-radius: 12px; cursor: pointer; text-decoration: none; font-weight: 800; transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
@@ -127,7 +131,7 @@ textarea:focus { border-color: var(--deep-sage); box-shadow: 0 0 0 4px rgba(85,
.list-heading { display: flex; justify-content: space-between; margin-bottom: 25px; }
.list-heading h1 { max-width: 100%; margin-bottom: 5px; overflow-wrap: anywhere; font-size: clamp(1.45rem, 2.8vw, 2.05rem); }
.list-meta { margin: 0; color: var(--muted); font-size: .85rem; }
.add-item-form { display: grid; grid-template-columns: minmax(0, 1fr) 90px 145px auto; gap: 8px; margin-bottom: 19px; }
.add-item-form { display: grid; grid-template-columns: minmax(0, 1fr) 145px 90px auto; gap: 8px; margin-bottom: 19px; }
.add-item-form input { min-height: 50px; }
.add-item-form select { min-height: 50px; }
.add-button { min-height: 50px; }
@@ -135,6 +139,7 @@ textarea:focus { border-color: var(--deep-sage); box-shadow: 0 0 0 4px rgba(85,
.item-list { display: grid; gap: 6px; }
.category-group + .category-group { margin-top: 18px; }
.category-heading { margin: 0 7px 4px; color: var(--deep-sage); font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; }
.ingredients-divider { margin: 26px 0 18px; border: 0; border-top: 1px solid var(--line); }
.item-row { display: flex; align-items: center; gap: 12px; min-height: 66px; padding: 9px 7px 9px 10px; border-bottom: 1px solid #edf0e6; }
.item-row:last-child { border-bottom: 0; }
.check-form { flex: 0 0 auto; }
@@ -208,6 +213,8 @@ textarea:focus { border-color: var(--deep-sage); box-shadow: 0 0 0 4px rgba(85,
.edit-form { margin-bottom: 12px; }
.edit-form input { min-height: 38px; padding: 7px 10px; font-size: .85rem; }
.danger-link { padding: 0; border: 0; color: var(--coral); background: none; cursor: pointer; font-size: .8rem; font-weight: 800; }
.button-danger { width: 100%; color: var(--coral); background: #fbeae4; }
.button-danger:hover { background: #f7ddd4; }
.empty-items { padding: 34px 10px 18px; color: var(--muted); text-align: center; }
.empty-items-icon { display: block; margin-bottom: 7px; color: var(--yellow); font-size: 1.7rem; }
.empty-items p { margin-bottom: 2px; color: var(--ink); font-weight: 800; }