require search first in explore
This commit is contained in:
5 files changed
+199
-52
No files matched your search
+95
-12
@@ -5367,12 +5367,28 @@ select.control { cursor: pointer; }
|
||||
}
|
||||
.settings-profile__meta { display: flex; flex-direction: column; }
|
||||
|
||||
.sr-only {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
white-space: nowrap;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/* ================================================================
|
||||
EXPLORE PAGE REDESIGN
|
||||
================================================================ */
|
||||
.explore-header {
|
||||
.explore-hero {
|
||||
max-width: 720px;
|
||||
margin-bottom: 28px;
|
||||
}
|
||||
.explore-header {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
.explore-header__eyebrow {
|
||||
font: 600 11px var(--font-mono);
|
||||
letter-spacing: .1em;
|
||||
@@ -5381,30 +5397,38 @@ select.control { cursor: pointer; }
|
||||
margin: 0 0 10px;
|
||||
}
|
||||
.explore-header__title {
|
||||
font-size: clamp(22px, 3vw, 30px);
|
||||
font-size: clamp(26px, 4vw, 42px);
|
||||
font-weight: 800;
|
||||
color: var(--text-strong);
|
||||
letter-spacing: -.025em;
|
||||
margin: 0 0 6px;
|
||||
margin: 0 0 8px;
|
||||
}
|
||||
.explore-header__sub {
|
||||
font-size: .875rem;
|
||||
max-width: 620px;
|
||||
font-size: .9375rem;
|
||||
line-height: 1.6;
|
||||
color: var(--text-muted);
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.explore-search-row {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
margin-bottom: 28px;
|
||||
max-width: 560px;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
max-width: 640px;
|
||||
padding: 8px;
|
||||
background: var(--surface);
|
||||
border: 1px solid var(--border-strong);
|
||||
border-radius: var(--r-lg);
|
||||
box-shadow: var(--shadow-sm);
|
||||
}
|
||||
.explore-search-row .field-input {
|
||||
flex: 1;
|
||||
background: var(--surface);
|
||||
border: 1px solid var(--border-strong);
|
||||
border-radius: var(--r-md);
|
||||
padding: 10px 14px;
|
||||
min-width: 0;
|
||||
height: 42px;
|
||||
background: var(--surface-sunk);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: var(--r-sm);
|
||||
padding: 0 14px;
|
||||
font-size: .9375rem;
|
||||
color: var(--text);
|
||||
transition: border-color .15s, box-shadow .15s;
|
||||
@@ -5415,6 +5439,30 @@ select.control { cursor: pointer; }
|
||||
box-shadow: 0 0 0 3px var(--accent-a22);
|
||||
}
|
||||
.explore-search-row .field-input::placeholder { color: var(--text-muted); }
|
||||
.explore-privacy-note {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
margin-top: 12px;
|
||||
color: var(--muted);
|
||||
font-size: .8125rem;
|
||||
}
|
||||
.explore-privacy-note__dot {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-radius: 1px;
|
||||
background: var(--accent);
|
||||
opacity: .82;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
.explore-results-head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin: 0 0 14px;
|
||||
color: var(--text-muted);
|
||||
font-size: .8125rem;
|
||||
}
|
||||
|
||||
.explore-cards {
|
||||
display: grid;
|
||||
@@ -5486,6 +5534,41 @@ select.control { cursor: pointer; }
|
||||
color: var(--accent);
|
||||
transition: gap .15s;
|
||||
}
|
||||
.explore-empty {
|
||||
max-width: 620px;
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
padding: 22px;
|
||||
border: 1px dashed var(--border-strong);
|
||||
border-radius: var(--r-lg);
|
||||
background: var(--surface-sunk);
|
||||
}
|
||||
.explore-empty h2 {
|
||||
margin: 0;
|
||||
color: var(--text-strong);
|
||||
font-size: 1rem;
|
||||
}
|
||||
.explore-empty p {
|
||||
margin: 0;
|
||||
color: var(--muted);
|
||||
line-height: 1.55;
|
||||
font-size: .875rem;
|
||||
}
|
||||
.explore-empty .btn {
|
||||
justify-self: start;
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
@media (max-width: 580px) {
|
||||
.explore-search-row {
|
||||
align-items: stretch;
|
||||
flex-direction: column;
|
||||
}
|
||||
.explore-search-row .field-input,
|
||||
.explore-search-row .btn {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/* ================================================================
|
||||
LANDING — stats bar
|
||||
|
||||
Reference in new issue
Block a user