Redesign: add 1-3★ auto-reply pools, filter modes, new settings UI

- app.py: add pool keys for stars 1-3, AUTO_REPLY_STARS_KEY/FILTER_KEY,
  _load_enabled_stars(), _load_filter_mode(), updated _has_review_content()
  with filter_mode param, new /auto-reply-settings POST route, index route
  passes enabled_stars/filter_mode/pools 1-5 to template
- templates/index.html: remove reviews list & controls section, replace pool
  card with full settings card (star toggles, filter mode radios, dynamic
  per-star pool columns), update JS for all 5 stars
- templates/login.html: fix ratings feature text (1-5★), update price to
  7 ₽/день with corrected description
- static/styles.css: login-promo fixed 300px width, logo 140px, add
  settings UI styles (star-toggles, filter-options, pool-columns, star-chips 1-3)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-05-15 18:19:38 +03:00
parent 60ea2757bc
commit e5050a7c83
4 changed files with 233 additions and 186 deletions
+85 -3
View File
@@ -897,7 +897,7 @@ textarea:focus {
}
.login-promo {
flex: 1 1 55%;
flex: 0 0 300px;
background: linear-gradient(145deg, #3D0066 0%, #6B0FA8 45%, #CB11AB 100%);
display: flex;
align-items: center;
@@ -930,8 +930,8 @@ textarea:focus {
}
.login-promo__logo {
width: 96px;
height: 96px;
width: 140px;
height: 140px;
object-fit: contain;
border-radius: 20px;
background: white;
@@ -1443,3 +1443,85 @@ textarea:focus {
color: #6B7280;
white-space: nowrap;
}
/* ─── Auto-reply settings ────────────────────────────────────────── */
.settings-section {
margin-bottom: 24px;
}
.settings-label {
font-size: 13px;
font-weight: 600;
color: var(--muted);
text-transform: uppercase;
letter-spacing: 0.05em;
margin-bottom: 12px;
}
.star-toggles {
display: flex;
gap: 10px;
flex-wrap: wrap;
}
.star-toggle {
cursor: pointer;
user-select: none;
}
.star-toggle input { display: none; }
.star-toggle span {
display: inline-flex;
align-items: center;
padding: 8px 18px;
border-radius: 99px;
font-weight: 700;
font-size: 15px;
border: 2px solid currentColor;
opacity: 0.35;
transition: opacity .15s, transform .15s;
}
.star-toggle input:checked + span { opacity: 1; transform: scale(1.05); }
.star-toggle--1 span { color: #EF4444; }
.star-toggle--2 span { color: #F97316; }
.star-toggle--3 span { color: #EAB308; }
.star-toggle--4 span { color: #3B82F6; }
.star-toggle--5 span { color: #22C55E; }
.filter-options {
display: flex;
flex-direction: column;
gap: 10px;
}
.filter-option {
display: flex;
align-items: flex-start;
gap: 10px;
cursor: pointer;
font-size: 14px;
}
.filter-option input { margin-top: 3px; }
.filter-option small { display: block; color: var(--muted); font-size: 12px; }
.pool-columns {
display: flex;
gap: 16px;
flex-wrap: wrap;
}
.pool-col {
flex: 1 1 180px;
min-width: 160px;
border-radius: var(--r);
padding: 16px;
border: 2px solid;
}
.pool-col--1 { border-color: #FEE2E2; background: #FFF5F5; }
.pool-col--2 { border-color: #FFEDD5; background: #FFFAF5; }
.pool-col--3 { border-color: #FEF9C3; background: #FFFEF0; }
.pool-col--4 { border-color: #DBEAFE; background: #F0F7FF; }
.pool-col--5 { border-color: #DCFCE7; background: #F0FFF4; }
.pool-col__header {
margin-bottom: 12px;
font-weight: 700;
}
/* star-chip colors 1-3 */
.star-chip--1 { background: #FEE2E2; color: #EF4444; }
.star-chip--2 { background: #FFEDD5; color: #F97316; }
.star-chip--3 { background: #FEF9C3; color: #CA8A04; }