brewlog/templates/pages/data.html
Jon Seager 2fdd780a05
style(data): improve data page layout and spacing
- Wrap tab bar, search, and table in gap-4 container for tighter spacing
- Change search placeholder from "Search..." to "Filter..."
- Remove border/padding wrapper around tab bar and search
2026-02-07 20:59:08 +00:00

28 lines
1.1 KiB
HTML

{% extends "base.html" %} {% import "partials/icons.html" as icons %} {% block title %}Brewlog · Data{% endblock %}
{% block content %}
<header class="flex flex-col gap-2">
<h1 class="text-3xl font-semibold">Data</h1>
<p class="max-w-2xl text-sm text-text-secondary">Browse all your coffee data.</p>
</header>
<div class="flex flex-col gap-4">
{% include "partials/tab_bar.html" %}
<!-- Search -->
<div data-signals:_data-search="'{{ search_value }}'">
<input
type="search"
data-bind:_data-search
placeholder="Filter..."
class="input-field w-full text-sm"
data-on:input__debounce.300ms="history.pushState(null, '', '/data?type=' + $_activeTab + '&q=' + encodeURIComponent($_dataSearch)); @get('/data?type=' + $_activeTab + '&q=' + encodeURIComponent($_dataSearch), {responseOverrides: {selector: '#data-content', mode: 'inner'}})"
{% if !search_value.is_empty() %}autofocus{% endif %}
/>
</div>
<div id="data-content" class="data-page-content">
{{ content|safe }}
</div>
</div>
<div id="detail-panel"></div>
{% endblock %}