AI 生成: 一个面向个人/团队/家庭的智能旅游规划工具，支持AI行程生成、地图标注与景点打卡记录。

2026-09-29 04:31:48 +08:00
commit 7e7bd600e4
8 changed files with 678 additions and 0 deletions
@@ -0,0 +1,130 @@
+* { box-sizing: border-box; }
+body {
+  margin: 0;
+  font-family: -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
+  background: #f5f7fa;
+  color: #222;
+}
+
+.topbar {
+  height: 56px;
+  background: #1e293b;
+  color: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 20px;
+}
+.logo { font-size: 18px; font-weight: 600; }
+
+.layout {
+  display: flex;
+  height: calc(100vh - 56px);
+}
+
+.sidebar {
+  width: 340px;
+  padding: 12px;
+  overflow-y: auto;
+  background: #fff;
+  border-right: 1px solid #e2e8f0;
+}
+
+.panel {
+  background: #f8fafc;
+  border: 1px solid #e2e8f0;
+  border-radius: 8px;
+  padding: 12px;
+  margin-bottom: 12px;
+}
+.panel h3 { margin: 0 0 10px; font-size: 14px; color: #334155; }
+.panel label { display: block; font-size: 13px; color: #475569; margin-bottom: 8px; }
+.panel input, .panel select {
+  width: 100%;
+  margin-top: 4px;
+  padding: 6px 8px;
+  border: 1px solid #cbd5e1;
+  border-radius: 6px;
+  font-size: 13px;
+}
+
+.btn {
+  background: #e2e8f0;
+  border: none;
+  padding: 8px 14px;
+  border-radius: 6px;
+  cursor: pointer;
+  font-size: 13px;
+  color: #1e293b;
+  transition: background 0.15s;
+}
+.btn:hover { background: #cbd5e1; }
+.btn.primary { background: #2563eb; color: #fff; }
+.btn.primary:hover { background: #1d4ed8; }
+.btn.ghost { background: transparent; border: 1px solid #cbd5e1; }
+
+.filter-group { display: flex; gap: 12px; font-size: 13px; }
+.filter-group label { display: flex; align-items: center; gap: 4px; margin: 0; }
+
+.spot-list { list-style: none; padding: 0; margin: 0; max-height: 200px; overflow-y: auto; }
+.spot-list li {
+  padding: 6px 8px;
+  border-bottom: 1px dashed #e2e8f0;
+  font-size: 13px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+.spot-list li .status { font-size: 11px; padding: 2px 6px; border-radius: 10px; }
+.status.visited { background: #dcfce7; color: #166534; }
+.status.wish { background: #fef3c7; color: #92400e; }
+
+.plan-result {
+  font-size: 13px;
+  line-height: 1.7;
+  color: #334155;
+  white-space: pre-wrap;
+}
+
+.map-wrap { flex: 1; position: relative; }
+#map { width: 100%; height: 100%; }
+.hint {
+  position: absolute;
+  left: 12px;
+  bottom: 12px;
+  background: rgba(30, 41, 59, 0.85);
+  color: #fff;
+  padding: 6px 10px;
+  border-radius: 6px;
+  font-size: 12px;
+  z-index: 500;
+}
+
+/* 弹窗 */
+.modal {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.4);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 1000;
+}
+.modal.hidden { display: none; }
+.modal-content {
+  background: #fff;
+  padding: 20px;
+  border-radius: 10px;
+  width: 320px;
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+.modal-content input {
+  padding: 8px 10px;
+  border: 1px solid #cbd5e1;
+  border-radius: 6px;
+  font-size: 13px;
+}
+.modal-actions { display: flex; gap: 8px; }
+.tip { font-size: 11px; color: #94a3b8; margin: 0; }