/* Theme Name: Noisa Child Theme URI: https://rascalsthemes.com/noisa Description: Responsive Wordpress Theme Template: noisa Version: 2.0 Author: You Author URI: http://your-site License: Themeforest License: GNU General Public License version 3.0 License URI: http://www.gnu.org/licenses/gpl-3.0.html Tags: four-columns, custom-background, custom-colors, featured-images, full-width-template, theme-options Text Domain: noisa-child */ /*------------------------------------------------------------------ Add here your own styles -------------------------------------------------------------------*/ /* Filters — suwak w rozwiniętej liście, gdy jest dużo pozycji (artyści/ lokalizacje/kategorie). Motyw bazowy ustawia max-height: 1000px na rozwiniętej liście (.filter.is-visible .filter-dropdown-content) i overflow: hidden na desktopie — przy więcej niż ~20 pozycjach (każda ma wysokość 50px) reszta jest po prostu obcięta, bez możliwości przewinięcia. Tu ograniczamy widoczną wysokość do ok. 9 pozycji (9 × 50px = 450px) i włączamy scroll z widocznym, stylowanym suwakiem — niezależnie od szerokości ekranu (desktop i mobile używają tego samego zestawu reguł). */ .filter.is-visible .filter-dropdown-content { max-height: 450px !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch; } /* Suwak — WebKit/Blink (Chrome, Edge, Safari) */ .filter-dropdown-content::-webkit-scrollbar { width: 8px; } .filter-dropdown-content::-webkit-scrollbar-track { background: rgba(255, 255, 255, 0.08); } .filter-dropdown-content::-webkit-scrollbar-thumb { background-color: rgba(255, 255, 255, 0.35); border-radius: 4px; } .filter-dropdown-content::-webkit-scrollbar-thumb:hover { background-color: rgba(255, 255, 255, 0.55); } /* Suwak — Firefox */ .filter-dropdown-content { scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, 0.35) rgba(255, 255, 255, 0.08); } /* Uwaga: motyw ma też opcjonalny jasny skin (Customizer > Noisa Skin), ładujący dodatkowo css/theme-style-light.css z tłem listy #eee i ciemnym tekstem #444 — ale nie dodaje osobnej klasy na , więc nie da się tu bezpiecznie dopasować koloru suwaka tylko do tego wariantu. Domyślny (ciemny) kolor suwaka powyżej jest wystarczająco neutralny (półprzezroczysta biel/czerń), żeby był widoczny również na jasnym tle listy — jeśli po włączeniu jasnego skinu suwak byłby za mało kontrastowy, wróć do tego miejsca i dopasuj wg realnego markupu strony. */ /* Moduły "stretch row" (WPBakery, np. sekcja "News" na stronie głównej generowana przez Content Views) na mobile — podwójny padding. Motyw bazowy (noisa/style.css, @media max-width:767px) nakłada "padding: 0 30px" NIEZALEŻNIE na dwa zagnieżdżone kontenery: 1) .container — zewnętrzny wrapper treści strony 2) .vc-container — wewnętrzny wrapper WPBakery wewnątrz .vc_row_stretch_row (rząd "rozciągnięty" na pełną szerokość ekranu) Efekt: 30px + 30px = 60px paddingu z KAŻDEJ strony, więc treść (np. siatka "News") zajmuje tylko ok. 255px z 375px szerokości ekranu (~68%) zamiast niemal całej szerokości. Poniżej: "wybijamy" .vc-container z paddingu .container ujemnym marginesem (-30px z każdej strony), a następnie dodajemy tylko niewielki, jednokrotny padding (10px) — dając efekt "prawie 100% szerokości" (355px z 375px, ~95%) zamiast 68%. Dotyczy WSZYSTKICH stretch-row na mobile (spójne z resztą motywu), nie tylko News. */ @media only screen and (max-width: 767px) { .container .vc_row_stretch_row > .vc-container { margin-left: -30px; margin-right: -30px; width: calc(100% + 60px); padding-left: 10px; padding-right: 10px; } }