/* * Ikony kontaktowe (blok fotolady/contact-icons) w pasku nagłówka — tylko * rozmieszczenie i zachowanie w nagłówku. Wygląd samych przycisków jest * wspólny dla nagłówka i stopki: contact-icons.css. * * Kopia bloku w nagłówku to bezpośrednie dziecko .site-header__nav — tak * odróżniamy ją od kopii w panelu menu mobilnego (też wewnątrz * .site-header, ale głębiej, w nakładce nawigacji). W edytorze blok jest * dodatkowo owinięty w .fotolady-ssr-preview (zob. assets/js/blocks/shared.js). */ /* Gdy otwarta jest nakładka mobilnego menu (core/navigation dodaje wtedy * klasę "has-modal-open" na ), telefon i social nie należą do dialogu * nawigacji — trzeba je jawnie schować, żeby nie prześwitywały nad/obok niego. */ html.has-modal-open .site-header__nav > .fotolady-contact-icons { /* visibility zamiast display: none — ikony znikają, ale zajmują to samo * miejsce, więc reszta nagłówka (hamburger) nie skacze po otwarciu menu. */ visibility: hidden; } /* Numer telefonu + CTA potrafią zająć ~250px — na węższych desktopach * (783–1199px) nie zmieściłyby się obok menu, więc w pasku zostaje sama * ikona. Dotyczy tylko nagłówka (bezpośrednie dziecko .site-header__nav), * nie panelu menu mobilnego. */ @media (max-width: 1199px) { .site-header__nav > :is(.fotolady-contact-icons, .fotolady-ssr-preview) .fotolady-icon-btn.has-text { width: var(--fotolady-icon-size); padding: 0; } .site-header__nav > :is(.fotolady-contact-icons, .fotolady-ssr-preview) .fotolady-icon-btn__text { display: none; } } /* Razem z przejściem menu w przycisk (≤1024px, navigation.css) ikony * znikają z paska — są w panelu menu. */ @media (max-width: 1024px) { .site-header__nav > :is(.fotolady-contact-icons, .fotolady-ssr-preview) { display: none !important; } } /* Kopia ikon na dole mobilnego panelu menu (doklejana w PHP: * FotoLady_Contact_Icons_Block::add_to_menu_panel()). Poza otwartym * panelem (np. menu inline na desktopie) jest ukryta. */ .site-header__panel-contact { display: none; } .wp-block-navigation__responsive-container.is-menu-open .site-header__panel-contact { display: flex; gap: 0.625rem; margin-top: auto; padding-top: 2rem; padding-bottom: 0.5rem; } .site-header__panel-contact .fotolady-contact-icons { --fotolady-icon-size: 44px; --fotolady-icon-glyph: 18px; } .site-header__panel-contact .fotolady-icon-btn { border-radius: 10px; }