diff --git a/src/components/MainFeed.jsx b/src/components/MainFeed.jsx index d644c99..a6ebbd6 100644 --- a/src/components/MainFeed.jsx +++ b/src/components/MainFeed.jsx @@ -332,13 +332,15 @@ export default function MainFeed() { {/* Иконка профиля в правом углу */} -
isAuthenticated ? setProfileModalOpen(true) : setAuthModalOpen(true)}> - {isAuthenticated ? ( + {isAuthenticated ? ( +
setProfileModalOpen(true)}> - ) : ( - 🔑 - )} -
+
+ ) : ( + + )} {/* Фильтр по типу объявления */} diff --git a/src/styles/card.css b/src/styles/card.css index ebde980..094632e 100644 --- a/src/styles/card.css +++ b/src/styles/card.css @@ -24,17 +24,20 @@ /* Badges */ .f-card-badges { - display: flex; align-items: center; justify-content: space-between; + display: flex; align-items: center; gap: 6px; margin-bottom: 8px; + position: relative; } .f-cat-badge { background: rgba(13,16,24,.8); backdrop-filter: blur(8px); border: 1px solid var(--border); border-radius: 20px; padding: 3px 10px; font-size: .72rem; font-weight: 700; color: var(--teal); + margin-right: auto; } .f-type-badge { border-radius: 20px; padding: 3px 10px; font-size: .72rem; font-weight: 900; + margin-left: auto; } .f-type-loss { background: rgba(255,107,107,.2); color: #ff6b6b; border: 1px solid rgba(255,107,107,.3); } .f-type-found { background: rgba(45,224,200,.2); color: #2de0c8; border: 1px solid rgba(45,224,200,.3); } @@ -43,6 +46,7 @@ .f-status-badge { border-radius: 20px; padding: 3px 10px; font-size: .72rem; font-weight: 900; + position: absolute; left: 50%; transform: translateX(-50%); } .f-status-closed { background: rgba(72,187,120,.2); color: #48bb78; border: 1px solid rgba(72,187,120,.3); @@ -173,4 +177,8 @@ .f-card-body { padding: 12px; } + + .f-card-phone { + font-size: 0.72rem; + } } \ No newline at end of file diff --git a/src/styles/layout.css b/src/styles/layout.css index bd60ca7..8b35185 100644 --- a/src/styles/layout.css +++ b/src/styles/layout.css @@ -107,6 +107,11 @@ font-size: 0.85rem; } + .f-login-btn { + padding: 6px 14px; + font-size: 0.8rem; + } + /* Фильтр компактнее */ .f-filter-bar { padding: 10px 12px; @@ -120,15 +125,22 @@ @media (max-width: 600px) { .f-post-btn { - padding: 8px 14px; - font-size: 0.8rem; - gap: 6px; + padding: 4px 8px; + font-size: 0.7rem; + gap: 3px; + border-radius: 10px; } .f-post-btn span { - width: 18px; - height: 18px; - font-size: 1rem; + width: 14px; + height: 14px; + font-size: 0.75rem; + } + + .f-login-btn { + padding: 4px 8px; + font-size: 0.68rem; + border-radius: 8px; } .f-filter-btn { diff --git a/src/styles/ui.css b/src/styles/ui.css index 930a8ff..4951410 100644 --- a/src/styles/ui.css +++ b/src/styles/ui.css @@ -24,6 +24,33 @@ transform: translateY(0) scale(0.98); box-shadow: 0 4px 12px rgba(0,0,0,0.4), inset 0 0 10px rgba(45,224,200,0.2); } +/* ── Login Button (topbar) ── */ +.f-login-btn { + display: flex; align-items: center; gap: 6px; + padding: 8px 18px; border-radius: 14px; + font-family: var(--font); font-weight: 800; font-size: 0.85rem; letter-spacing: 0.3px; + color: #eafffb; + background: rgba(45,224,200,0.12); backdrop-filter: blur(14px); + border: 1px solid rgba(45,224,200,0.25); + box-shadow: 0 6px 18px rgba(0,0,0,0.35), inset 0 0 10px rgba(45,224,200,0.12), 0 0 14px rgba(45,224,200,0.12); + cursor: pointer; transition: all 0.25s ease; + position: relative; overflow: hidden; white-space: nowrap; +} +.f-login-btn::before { + content: ""; position: absolute; inset: 0; + background: linear-gradient(120deg, rgba(255,255,255,0.25), rgba(255,255,255,0.05) 40%, transparent 60%); + opacity: 0.4; pointer-events: none; +} +.f-login-btn:hover { + transform: translateY(-2px) scale(1.02); + border-color: rgba(45,224,200,0.5); + box-shadow: 0 10px 26px rgba(0,0,0,0.45), inset 0 0 14px rgba(45,224,200,0.22), 0 0 20px rgba(45,224,200,0.3); +} +.f-login-btn:active { + transform: translateY(0) scale(0.98); + box-shadow: 0 3px 10px rgba(0,0,0,0.4), inset 0 0 8px rgba(45,224,200,0.18); +} + .f-post-btn span { display: flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%;