feat: enhance UI styling, add date picker, and clean up inline CSS

app/templates/admin_papers.html

@@ -11,10 +11,10 @@
     <div class="paper-search-row">
       <input type="text" name="q" value="{{ request.query_params.get('q', '') }}"
              placeholder="搜索标题 / 摘要..." class="paper-search-input" />
-      <input type="date" name="date_from" value="{{ request.query_params.get('date_from', '') }}"
-             class="paper-filter-input" title="起始日期" />
-      <input type="date" name="date_to" value="{{ request.query_params.get('date_to', '') }}"
-             class="paper-filter-input" title="结束日期" />
+      <input type="text" name="date_from" value="{{ request.query_params.get('date_from', '') }}"
+             class="paper-filter-input kami-date-input" placeholder="起始日期" readonly id="date-from-trigger" />
+      <input type="text" name="date_to" value="{{ request.query_params.get('date_to', '') }}"
+             class="paper-filter-input kami-date-input" placeholder="结束日期" readonly id="date-to-trigger" />
       <select name="summary_status" class="paper-filter-input">
         <option value="all" {% if current_status == 'all' %}selected{% endif %}>全部状态</option>
         <option value="none" {% if current_status == 'none' %}selected{% endif %}>未总结</option>
@@ -168,4 +168,27 @@
   function closeConfirm() { document.getElementById('confirm-overlay').style.display='none'; _confirmAction=null; _confirmTarget=null; }
   document.addEventListener('keydown',e=>{if(e.key==='Escape')closeConfirm();});
 </script>
+<script src="/static/js/date-picker.js"></script>
+<script>
+(function() {
+  var today = new Date().toISOString().slice(0, 10);
+  var fromEl = document.getElementById('date-from-trigger');
+  var toEl = document.getElementById('date-to-trigger');
+
+  if (fromEl) {
+    new KamiDatePicker(fromEl, {
+      value: fromEl.value || null,
+      maxDate: today,
+      onChange: function(dateStr) { fromEl.value = dateStr || ''; }
+    });
+  }
+  if (toEl) {
+    new KamiDatePicker(toEl, {
+      value: toEl.value || null,
+      maxDate: today,
+      onChange: function(dateStr) { toEl.value = dateStr || ''; }
+    });
+  }
+})();
+</script>
 {% endblock %}

app/templates/detail.html

@@ -305,67 +305,4 @@ document.addEventListener('DOMContentLoaded', function () {
 });
 </script>
 <script src="/static/js/lightbox.js"></script>
-<style>
-.lightbox-overlay {
-  position: fixed !important;
-  top: 0 !important;
-  left: 0 !important;
-  right: 0 !important;
-  bottom: 0 !important;
-  width: 100vw !important;
-  height: 100vh !important;
-  z-index: 99999 !important;
-  background: rgba(0, 0, 0, 0.85);
-  overflow: hidden;
-  margin: 0 !important;
-  padding: 0 !important;
-  opacity: 0;
-  transition: opacity 0.2s;
-}
-.lightbox-overlay.active {
-  opacity: 1;
-}
-.lightbox-overlay img {
-  position: absolute;
-  transform-origin: 0 0;
-  border-radius: 4px;
-  box-shadow: 0 0 40px rgba(0, 0, 0, 0.4);
-  cursor: grab;
-  user-select: none;
-  -webkit-user-drag: none;
-}
-.lightbox-overlay img.dragging {
-  cursor: grabbing;
-}
-/* 工具栏 */
-.lightbox-toolbar {
-  position: absolute;
-  bottom: 24px;
-  left: 50%;
-  transform: translateX(-50%);
-  display: flex;
-  gap: 8px;
-  background: rgba(0, 0, 0, 0.6);
-  padding: 8px 14px;
-  border-radius: 24px;
-  z-index: 100000;
-}
-.lightbox-toolbar button {
-  background: none;
-  border: 1px solid rgba(255,255,255,0.3);
-  color: #fff;
-  width: 36px;
-  height: 36px;
-  border-radius: 50%;
-  font-size: 1.1rem;
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  transition: background 0.15s;
-}
-.lightbox-toolbar button:hover {
-  background: rgba(255,255,255,0.15);
-}
-</style>
 {% endblock %}

app/templates/index.html

@@ -5,7 +5,7 @@ endblock %} {% block content %}
   {% if prev_day %}
   <a href="/day/{{ prev_day }}" class="date-nav-btn">← 前一天</a>
   {% endif %}
-  <h1 class="date-title">{{ current_date }}</h1>
+  <div class="date-title" id="date-picker-trigger">{{ current_date }}</div>
   {% if next_day <= today %}
   <a href="/day/{{ next_day }}" class="date-nav-btn">后一天 →</a>
   {% endif %}
@@ -34,3 +34,24 @@ endblock %} {% block content %}
   {% endfor %}
 </div>
 {% endblock %}
+
+{% block scripts %}
+<script src="/static/js/date-picker.js"></script>
+<script>
+(function() {
+  var trigger = document.getElementById('date-picker-trigger');
+  if (!trigger) return;
+
+  var markedDates = {{ available_dates | tojson }};
+
+  new KamiDatePicker(trigger, {
+    value: {{ current_date | tojson }},
+    maxDate: {{ today | tojson }},
+    markedDates: markedDates,
+    onChange: function(dateStr) {
+      if (dateStr) window.location.href = '/day/' + dateStr;
+    }
+  });
+})();
+</script>
+{% endblock %}