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

added filter on main feed

Browse Source
This commit is contained in:
SlimusMinus
2026-07-06 00:43:03 +03:00
parent 522633daec
commit b6aca224d7
8 changed files with 267 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/styles/card.css
View File

@@ -19,7 +19,7 @@
display: flex; align-items: center; justify-content: center;
position: relative; overflow: hidden; flex-shrink: 0;
}
.f-card-img img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; position: absolute; inset: 0; }
.f-card-img img { width: 100%; height: 100%; object-fit: contain; object-position: center; display: block; position: absolute; inset: 0; }
.f-card-emoji { font-size: 3rem; opacity: .22; }
/* Badges */

43
src/styles/layout.css
View File

@@ -52,6 +52,49 @@
}
.f-topbar-login-icon { font-size: 1.1rem; line-height: 1; }
/* ── Search Bar ── */
.f-search-bar {
display: flex; align-items: center; gap: 10px;
padding: 8px 16px;
background: var(--bg-filter); backdrop-filter: blur(8px);
border-bottom: 1px solid var(--border);
}
.f-search-icon {
width: 18px; height: 18px; flex-shrink: 0;
color: var(--muted);
}
.f-search-input {
flex: 1; min-width: 0;
background: var(--bg-input);
border: 1px solid var(--border);
border-radius: 10px;
padding: 10px 14px;
font-family: var(--font); font-size: 0.9rem;
color: var(--text-primary);
outline: none;
transition: border-color .2s, box-shadow .2s;
}
.f-search-input::placeholder { color: var(--muted); }
.f-search-input:focus {
border-color: rgba(var(--teal-rgb), .5);
box-shadow: 0 0 0 3px rgba(var(--teal-rgb), .12);
}
.f-search-clear {
background: none; border: none; cursor: pointer;
color: var(--muted); padding: 4px; border-radius: 6px;
display: flex; align-items: center; justify-content: center;
flex-shrink: 0; transition: color .15s, background .15s;
}
.f-search-clear:hover { color: var(--text-primary); background: var(--hover-bg); }
@media (max-width: 768px) {
.f-search-bar { padding: 8px 12px; }
.f-search-input { padding: 8px 12px; font-size: 0.85rem; }
}
/* ── Filter Bar ── */
.f-filter-bar {
display: flex; gap: 10px;

20
src/styles/modal.css
View File

@@ -137,6 +137,9 @@
align-items: center;
user-select: none;
}
.f-viewer-img-wrap {
touch-action: pan-y;
}
.f-viewer-img {
max-width: 90vw;
max-height: 80vh;
@@ -144,6 +147,23 @@
object-fit: contain;
cursor: pointer;
box-shadow: 0 8px 40px rgba(0,0,0,.5);
touch-action: pan-y;
}
.f-viewer-contact {
margin-top: 16px;
padding: 10px 28px;
border-radius: 12px;
border: none;
background: var(--teal);
color: #fff;
font-size: .95rem;
font-weight: 600;
cursor: pointer;
transition: opacity .2s;
z-index: 1;
}
.f-viewer-contact:hover {
opacity: .85;
}
.f-viewer-close {
position: fixed;

16
src/styles/reviews.css
View File

@@ -2,7 +2,7 @@
.rv-page-title {
font-size: 1.15rem;
font-weight: 900;
color: #fff;
color: var(--text-primary);
margin: 0;
}
@@ -101,7 +101,7 @@
gap: 3px;
}
.rv-star {
color: rgba(255, 255, 255, .2);
color: var(--muted);
transition: color .15s, transform .15s;
flex-shrink: 0;
}
@@ -129,7 +129,7 @@
margin: 0;
font-size: 1rem;
font-weight: 800;
color: #fff;
color: var(--text-primary);
}
.rv-form-rating {
display: flex;
@@ -147,11 +147,11 @@
font-weight: 700;
}
.rv-form-textarea {
background: rgba(255, 255, 255, .05);
background: var(--bg-input);
border: 1px solid var(--border);
border-radius: 10px;
padding: 12px 14px;
color: #fff;
color: var(--text-primary);
font-family: var(--font);
font-size: .88rem;
resize: vertical;
@@ -163,7 +163,7 @@
box-shadow: 0 0 0 3px rgba(45, 224, 200, .12);
}
.rv-form-textarea::placeholder {
color: rgba(255, 255, 255, .32);
color: var(--muted);
}
.rv-form-footer {
display: flex;
@@ -283,7 +283,7 @@
.rv-card-name {
font-size: .88rem;
font-weight: 700;
color: #fff;
color: var(--text-primary);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
@@ -307,7 +307,7 @@
.rv-card-text {
margin: 0;
font-size: .88rem;
color: rgba(255, 255, 255, .78);
color: var(--text-primary);
line-height: 1.55;
}