/* Theme Name: News Magazine X Child Template: news-magazine-x Version: 1.0.0 */ /* === Menu Mobile === */ @media (max-width: 991px) { /* Cacher le menu desktop */ .newsx-desktop-menu-container { display: none !important; } /* Bouton hamburger 3 lignes */ .newsx-mobile-menu-toggle { position: relative; width: 40px; height: 40px; display: inline-flex !important; align-items: center; justify-content: center; border-radius: 10px; background: #0b0f1a; border: 1px solid rgba(255,255,255,0.12); color: transparent; font-size: 0; cursor: pointer; } .newsx-mobile-menu-toggle .newsx-svg-icon, .newsx-mobile-menu-toggle span { display: none !important; } .newsx-mobile-menu-toggle::before { content: ""; position: absolute; width: 20px; height: 2px; background: #fff; border-radius: 2px; box-shadow: 0 6px 0 #fff, 0 -6px 0 #fff; } /* Loupe de recherche */ .search-icon { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: #0b0f1a; border: 1px solid rgba(255,255,255,0.12); color: #fff; } .search-icon svg { width: 20px; height: 20px; } /* Titres articles */ .newsx-grid-title h3, .newsx-grid-title h3 a, .newsx-list-title h3, .newsx-list-title h3 a, .entry-title, .entry-title a { white-space: normal !important; overflow-wrap: anywhere; word-break: break-word; } .newsx-grid-title, .newsx-list-title { min-width: 0; max-width: 100%; } body, .entry-content, .newsx-post-content, .newsx-grid-content, .newsx-list-content { overflow-wrap: break-word; word-break: break-word; } img, iframe, embed, video { max-width: 100%; height: auto; } table { display: block; width: 100%; overflox-x: auto; } } /* === Overlay menu mobile (nav deplace dans via JS) === */ body > nav.newsx-overlay-menu { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100vw; height: 100vh; z-index: 999999; background: #0b0f1a; padding: 72px 16px 24px; overflow-y: auto; box-sizing: border-box; -webkit-overflow-scrolling: touch; } body > nav.newsx-overlay-menu.is-open { display: block; } body.menu-open { overflow: hidden; } body > nav.newsx-overlay-menu ul { list-style: none; margin: 0; padding: 0; } body > nav.newsx-overlay-menu a { display: block; padding: 14px 8px; font-size: 17px; line-height: 1.4; color: #fff; border-bottom: 1px solid rgba(255,255,255,0.08); text-decoration: none; } body > nav.newsx-overlay-menu a:hover { color: rgba(255,255,255,0.7); } /* Image bannière catégorie */ .newsx-category-banner { width: 100%; margin: 16px 0 24px; border-radius: 6px; overflow: hidden; } .newsx-category-banner img { width: 100%; height: 220px; object-fit: cover; object-position: center; display: block; } /* =================================================================== Mobile sub-menu fix : 1er tap = expand, 2e tap = navigate =================================================================== */ .newsx-overlay-menu .menu-item-has-children > .sub-menu { display: none; } .newsx-overlay-menu .menu-item-has-children.newsx-submenu-open > .sub-menu { display: block; padding-left: 16px; margin-top: 6px; } /* indicateur visuel sur le parent */ .newsx-overlay-menu .menu-item-has-children > a::after { content: " \25BE"; opacity: 0.7; } .newsx-overlay-menu .menu-item-has-children.newsx-submenu-open > a::after { content: " \25B4"; } /* =================================================================== Mobile post navigation : prev/next côte à côte (50/50), pas de divider =================================================================== */ @media (max-width: 991px) { .newsx-post-navigation { position: relative; display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; gap: 8px; align-items: stretch; } /* Le divider du theme est positionné absolute left:50% — il barre le 2e bloc sur mobile. On le masque puisque le gap entre les deux suffit comme séparation visuelle. */ .newsx-post-navigation .newsx-divider { display: none !important; } .newsx-post-navigation > a.prev-post, .newsx-post-navigation > a.next-post { flex: 1 1 50% !important; max-width: 50% !important; min-width: 0 !important; box-sizing: border-box !important; padding: 12px 8px !important; } .newsx-post-navigation > a img { width: 56px !important; height: 56px !important; flex-shrink: 0; object-fit: cover; } .newsx-post-navigation > a h4 { font-size: 12px; line-height: 1.3; margin: 0; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-word; } .newsx-post-navigation > a .newsx-flex-nowrap { gap: 6px; min-width: 0; align-items: center; } .newsx-post-navigation > a .newsx-flex { font-size: 11px; text-transform: uppercase; opacity: 0.8; } /* Le bouton "next" pousse l'icône et la miniature à droite */ .newsx-post-navigation > a.next-post { text-align: right; } .newsx-post-navigation > a.next-post .newsx-flex, .newsx-post-navigation > a.next-post .newsx-flex-nowrap { justify-content: flex-end; } }