diff options
| -rw-r--r-- | web/static/js/app.js | 2 | ||||
| -rw-r--r-- | web/templates/index.html | 20 |
2 files changed, 11 insertions, 11 deletions
diff --git a/web/static/js/app.js b/web/static/js/app.js index 6646400..f103ae8 100644 --- a/web/static/js/app.js +++ b/web/static/js/app.js @@ -215,7 +215,7 @@ function toggleTask(taskId) { const SWIPE_THRESHOLD = 50; // Minimum px for a swipe // Get ordered list of tab names (main tabs only for swipe) - const TAB_ORDER = ['timeline', 'shopping', 'tasks', 'planning', 'meals']; + const TAB_ORDER = ['timeline', 'shopping', 'conditions', 'tasks', 'planning', 'meals']; function handleSwipe() { const swipeDistance = touchEndX - touchStartX; diff --git a/web/templates/index.html b/web/templates/index.html index f4c0b59..a03fdae 100644 --- a/web/templates/index.html +++ b/web/templates/index.html @@ -9,8 +9,8 @@ <style> :root { --panel-bg: rgba(0, 0, 0, 0.4); - --card-bg: rgba(255, 255, 255, 0.05); - --card-bg-hover: rgba(255, 255, 255, 0.1); + --card-bg: rgba(0, 0, 0, 0.5); + --card-bg-hover: rgba(0, 0, 0, 0.6); --input-bg: rgba(0, 0, 0, 0.4); --modal-bg: rgba(0, 0, 0, 0.8); --modal-overlay: rgba(0, 0, 0, 0.7); @@ -64,21 +64,21 @@ onclick="setActiveTab(this)"> 🛒 Shopping </button> - <a href="/conditions" - class="tab-button" - target="_blank"> + <button + class="tab-button {{if eq .ActiveTab "conditions"}}tab-button-active{{end}}" + hx-get="/tabs/conditions" + hx-target="#tab-content" + hx-push-url="?tab=conditions" + onclick="setActiveTab(this)"> 🌋 Conditions - </a> + </button> <!-- Details Dropdown --> <div class="relative" id="details-dropdown"> <button class="tab-button {{if or (eq .ActiveTab "tasks") (eq .ActiveTab "planning") (eq .ActiveTab "meals")}}tab-button-active{{end}}" onclick="toggleDetailsDropdown(event)"> - 📁 Details - <svg class="w-3 h-3 ml-1 inline" fill="none" stroke="currentColor" viewBox="0 0 24 24"> - <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> - </svg> + 📁 Details ▾ </button> <div id="details-menu" class="hidden absolute top-full left-0 mt-1 bg-panel backdrop-blur-sm rounded-lg p-1 min-w-[140px] z-20"> <button |