iterminate/battery-tracker-app
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Nav active highlighting; reorder add battery form; export/import icons

Browse Source
This commit is contained in:
iterminate
2026-06-21 13:20:17 -05:00
parent 18456cf8a4
commit 129b1eff04
4 changed files with 22 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/style.css
+2
View File
@@ -116,6 +116,7 @@
nav .brand:hover { text-decoration: none; opacity: 0.9; } nav .brand:hover { text-decoration: none; opacity: 0.9; }
nav a { color: #bfdbfe; font-size: 0.9rem; padding: 0.25rem 0.5rem; border-radius: 4px; white-space: nowrap; } nav a { color: #bfdbfe; font-size: 0.9rem; padding: 0.25rem 0.5rem; border-radius: 4px; white-space: nowrap; }
nav a:hover { background: #1d4ed8; color: #fff; text-decoration: none; } nav a:hover { background: #1d4ed8; color: #fff; text-decoration: none; }
nav a.active { background: #1d4ed8; color: #fff; }
/* Layout */ /* Layout */
.container { max-width: 960px; margin: 1.5rem auto; padding: 0 1rem; } .container { max-width: 960px; margin: 1.5rem auto; padding: 0 1rem; }
@@ -196,6 +197,7 @@
nav { background: #0c1a3b; } nav { background: #0c1a3b; }
nav a { color: #93c5fd; } nav a { color: #93c5fd; }
nav a:hover { background: #1e3a8a; color: #fff; } nav a:hover { background: #1e3a8a; color: #fff; }
nav a.active { background: #1e3a8a; color: #fff; }
nav .brand { color: #e2e8f0; } nav .brand { color: #e2e8f0; }
#bulk-toolbar { background: var(--bg-toolbar) !important; } #bulk-toolbar { background: var(--bg-toolbar) !important; }
templates/base.html
+5 -4
View File
@@ -17,9 +17,10 @@
</head> </head>
<body> <body>
<nav> <nav>
{% set ep = request.endpoint or '' %}
<a class="brand" href="{{ url_for('home') }}">Battery Tracker</a> <a class="brand" href="{{ url_for('home') }}">Battery Tracker</a>
<a href="{{ url_for('battery_list') }}">Batteries</a> <a href="{{ url_for('battery_list') }}"{% if ep.startswith('battery') %} class="active"{% endif %}>Batteries</a>
<a href="{{ url_for('device_list') }}">Devices</a> <a href="{{ url_for('device_list') }}"{% if ep.startswith('device') %} class="active"{% endif %}>Devices</a>
</nav> </nav>
<div class="container"> <div class="container">
@@ -52,13 +53,13 @@
</svg> </svg>
<span>Home</span> <span>Home</span>
</a> </a>
<a href="{{ url_for('battery_list') }}" class="bottom-nav-item{% if ep == 'battery_list' %} active{% endif %}"> <a href="{{ url_for('battery_list') }}" class="bottom-nav-item{% if ep.startswith('battery') %} active{% endif %}">
<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"> <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<rect x="2" y="7" width="16" height="10" rx="2"/><path d="M22 11v2"/> <rect x="2" y="7" width="16" height="10" rx="2"/><path d="M22 11v2"/>
</svg> </svg>
<span>Batteries</span> <span>Batteries</span>
</a> </a>
<a href="{{ url_for('device_list') }}" class="bottom-nav-item{% if ep.startswith('device') and ep != 'device_add' %} active{% endif %}"> <a href="{{ url_for('device_list') }}" class="bottom-nav-item{% if ep.startswith('device') %} active{% endif %}">
<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"> <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<rect x="5" y="2" width="14" height="20" rx="2"/><line x1="12" y1="18" x2="12.01" y2="18"/> <rect x="5" y="2" width="14" height="20" rx="2"/><line x1="12" y1="18" x2="12.01" y2="18"/>
</svg> </svg>
templates/battery_add.html
+13 -13
View File
@@ -23,6 +23,19 @@
style="display:none;margin-top:0.4rem;"> style="display:none;margin-top:0.4rem;">
</div> </div>
<div class="form-group">
<label>Size</label>
<select id="size-select" onchange="metaSelectChanged(this,'size')">
<option value="">— none —</option>
{% for opt in ['AA','AAA','C','D','9V','18650','21700','14500','26650','CR2032','CR123A'] %}
<option value="{{ opt }}">{{ opt }}</option>
{% endfor %}
<option value="__new__">Other…</option>
</select>
<input type="text" id="size" name="size" value=""
placeholder="Enter size" style="display:none;margin-top:0.4rem;">
</div>
<div class="form-group"> <div class="form-group">
<label for="count">Quantity</label> <label for="count">Quantity</label>
<input type="number" id="count" name="count" value="{{ form_count|default(1) }}" min="1" max="50"> <input type="number" id="count" name="count" value="{{ form_count|default(1) }}" min="1" max="50">
@@ -42,19 +55,6 @@
value="" placeholder="e.g. 2000 — optional"> value="" placeholder="e.g. 2000 — optional">
</div> </div>
<div class="form-group">
<label>Size</label>
<select id="size-select" onchange="metaSelectChanged(this,'size')">
<option value="">— none —</option>
{% for opt in ['AA','AAA','C','D','9V','18650','21700','14500','26650','CR2032','CR123A'] %}
<option value="{{ opt }}">{{ opt }}</option>
{% endfor %}
<option value="__new__">Other…</option>
</select>
<input type="text" id="size" name="size" value=""
placeholder="Enter size" style="display:none;margin-top:0.4rem;">
</div>
<div class="form-group"> <div class="form-group">
<label>Chemistry</label> <label>Chemistry</label>
<select id="chemistry-select" onchange="metaSelectChanged(this,'chemistry')"> <select id="chemistry-select" onchange="metaSelectChanged(this,'chemistry')">
templates/home.html
+2 -2
View File
@@ -117,8 +117,8 @@
<a class="btn btn-secondary" style="text-align:center;" href="{{ url_for('battery_list') }}">View All Batteries</a> <a class="btn btn-secondary" style="text-align:center;" href="{{ url_for('battery_list') }}">View All Batteries</a>
<a class="btn btn-primary" style="text-align:center;" href="{{ url_for('device_add') }}">+ Add Device</a> <a class="btn btn-primary" style="text-align:center;" href="{{ url_for('device_add') }}">+ Add Device</a>
<a class="btn btn-secondary" style="text-align:center;" href="{{ url_for('device_list') }}">View All Devices</a> <a class="btn btn-secondary" style="text-align:center;" href="{{ url_for('device_list') }}">View All Devices</a>
<a class="btn btn-secondary" style="text-align:center;" href="{{ url_for('export_page') }}">Export Data</a> <a class="btn btn-secondary" style="text-align:center;" href="{{ url_for('export_page') }}"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="vertical-align:-2px;margin-right:4px;" aria-hidden="true"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" y1="15" x2="12" y2="3"/></svg>Export Data</a>
<a class="btn btn-secondary" style="text-align:center;" href="{{ url_for('import_page') }}">Import Data</a> <a class="btn btn-secondary" style="text-align:center;" href="{{ url_for('import_page') }}"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="vertical-align:-2px;margin-right:4px;" aria-hidden="true"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="17 8 12 3 7 8"/><line x1="12" y1="3" x2="12" y2="15"/></svg>Import Data</a>
</div> </div>
{% endblock %} {% endblock %}