Actualiser css/public.css

This commit is contained in:
2026-06-19 20:18:17 +02:00
parent 8356b35f27
commit 6e2126e768
+94
View File
@@ -992,4 +992,98 @@ footer {
padding: 0.4rem 0.8rem; padding: 0.4rem 0.8rem;
font-size: 0.8rem; font-size: 0.8rem;
} }
}
/* ═════════════════════════════════════════════════════════════
BARRE DE FILTRES (Recherche + Select Streaming)
══════════════════════════════════════════════════════════════ */
.pub-filters {
display: flex;
justify-content: center;
align-items: center;
gap: 1rem;
margin-bottom: 2.5rem;
flex-wrap: wrap;
}
.pub-search-box {
position: relative;
flex: 1;
max-width: 480px;
}
.pub-search-box input {
width: 100%;
padding: 0.85rem 1.2rem 0.85rem 3rem;
background: var(--surface);
border: 1px solid var(--border);
border-radius: 30px;
color: var(--text);
font-family: inherit;
font-size: 0.95rem;
transition: all 0.25s;
}
.pub-search-box input:focus {
outline: none;
border-color: var(--gold);
box-shadow: 0 0 0 3px var(--gold-dim);
background: var(--surface-card);
}
.pub-search-box input::placeholder {
color: var(--muted);
}
.pub-search-box i {
position: absolute;
left: 1.2rem;
top: 50%;
transform: translateY(-50%);
color: var(--muted);
font-size: 1.2rem;
}
/* Select Streaming */
.pub-streaming-select {
padding: 0.85rem 2.5rem 0.85rem 1.2rem;
background: var(--surface);
border: 1px solid var(--border);
border-radius: 30px;
color: var(--text);
font-family: inherit;
font-size: 0.95rem;
cursor: pointer;
transition: all 0.25s;
appearance: none;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23C9A84C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right 1rem center;
min-width: 220px;
}
.pub-streaming-select:focus {
outline: none;
border-color: var(--gold);
box-shadow: 0 0 0 3px var(--gold-dim);
}
.pub-streaming-select option {
background: var(--surface-card);
color: var(--text);
padding: 0.5rem;
}
@media (max-width: 720px) {
.pub-filters {
flex-direction: column;
gap: 0.8rem;
}
.pub-search-box {
max-width: 100%;
}
.pub-streaming-select {
width: 100%;
max-width: 100%;
}
} }