admin/nahodka-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added frame on posts

Browse Source
This commit is contained in:
SlimusMinus
2026-06-30 00:44:04 +03:00
parent 56e72812b2
commit 441b3c5f8d
10 changed files with 143 additions and 117 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/styles/card.css
View File

@@ -1,11 +1,11 @@
/* ── Ad Card ── */
.f-card {
flex-shrink: 0;
background: linear-gradient(155deg, #1d2436, #131720);
background: var(--bg-card);
border: 1px solid var(--border); border-radius: 20px; overflow: hidden;
transition: border-color .2s, transform .2s; cursor: pointer;
transition: border-color .2s, transform .2s, background .2s; cursor: pointer;
}
.f-card:hover { border-color: rgba(45,224,200,.3); transform: translateY(-2px); }
.f-card:hover { border-color: rgba(var(--teal-rgb), .3); transform: translateY(-2px); }
.f-card-inner {
display: flex; flex-direction: row; min-height: 180px;
@@ -14,8 +14,8 @@
/* Image Panel */
.f-card-img {
width: 180px; min-width: 180px;
align-self: stretch; /* растягивается на всю высоту карточки */
background: linear-gradient(135deg, #1a3a4a 0%, #0f2235 100%);
align-self: stretch;
background: var(--bg-card-img);
display: flex; align-items: center; justify-content: center;
position: relative; overflow: hidden; flex-shrink: 0;
}
@@ -39,7 +39,7 @@
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); }
.f-type-found { background: rgba(var(--teal-rgb), .2); color: var(--teal); border: 1px solid rgba(var(--teal-rgb), .3); }
/* Status badge for closed/found posts */
.f-status-badge {
@@ -96,7 +96,7 @@
flex: 1; padding: 14px 16px;
display: flex; flex-direction: column; min-width: 0;
}
.f-card-title { color: #fff; font-weight: 900; font-size: 1rem; margin-bottom: 5px; line-height: 1.3; }
.f-card-title { color: var(--text-primary); font-weight: 900; font-size: 1rem; margin-bottom: 5px; line-height: 1.3; }
.f-card-desc {
color: var(--muted); font-size: .82rem; line-height: 1.5; margin-bottom: 10px;
display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
@@ -106,21 +106,21 @@
.f-card-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.f-meta-pill {
display: flex; align-items: center; gap: 4px;
background: rgba(255,255,255,.05); border: 1px solid var(--border);
background: var(--hover-bg); border: 1px solid var(--border);
border-radius: 20px; padding: 3px 9px; font-size: .73rem; color: var(--muted);
}
/* Map stub */
.f-card-map {
width: 100%; height: 76px;
background: #080f1c; margin-bottom: 14px; border-radius: 12px;
background: var(--bg-input); margin-bottom: 14px; border-radius: 12px;
border: 1px solid var(--border);
display: flex; align-items: center; justify-content: center;
gap: 8px; color: var(--muted); font-size: .78rem;
cursor: pointer; transition: border-color .2s;
font-family: var(--font); font-weight: 600;
}
.f-card-map:hover { border-color: rgba(45,224,200,.3); color: var(--teal); }
.f-card-map:hover { border-color: rgba(var(--teal-rgb), .3); color: var(--teal); }
/* Footer */
.f-card-foot {
@@ -172,7 +172,7 @@
color: var(--muted); padding: 0;
}
.f-card-edit-btn:hover {
border-color: rgba(45,224,200,.5); color: #2de0c8; background: rgba(45,224,200,.08);
border-color: rgba(var(--teal-rgb), .5); color: var(--teal); background: rgba(var(--teal-rgb), .08);
}
.f-card-delete-btn:hover {
border-color: rgba(255,107,107,.5); color: #ff6b6b; background: rgba(255,107,107,.08);