/* --------------------------------------------------------------------------- Surcharges projet MSGI. Chargé APRÈS theme-front//assets/css/style.css dans layouts/app.blade.php. Les feuilles du thème sont livrées telles quelles : tout correctif va ici pour survivre à un remplacement du thème et couvrir dark + light d'un seul coup. --------------------------------------------------------------------------- */ /* Dernière lettre rognée dans le menu (« ACCUEI », « CONTAC », « CONFIGURATEUR 3 »). L'effet .rolling-text (theme-front//assets/js/scripts.js) découpe le texte en en inline-block. Le letter-spacing du .nav-link ajoute 1px après chaque lettre, la largeur shrink-to-fit du .rolling-text ne le compte pas pour la dernière, la lettre passe donc à la ligne suivante — invisible à cause de overflow:hidden + height:30px. Interdire le retour à la ligne suffit. */ .rolling-text, .rolling-text .block { white-space: nowrap; } /* --------------------------------------------------------------------------- Carrousel de logos clients : tuiles qui se chevauchent. .main-marq .slide-har et .main-marq .box sont des conteneurs flex sans flex-shrink: 0. Le contenu (2 blocs x 15 tuiles, ~9900px) dépasse largement le conteneur, donc flex comprime blocs et tuiles — mais le à l'intérieur garde son width: 320px fixe (style.css:8803). Il déborde de son parent rétréci et recouvre le voisin ; les deux fonds rgba(255,255,255,.05) se cumulent, d'où la bande claire visible à la jonction. flex-shrink: 0 rend leur largeur naturelle aux blocs. C'est ce que l'animation suppose : translateX(-100%) ne boucle sans couture que si le bloc mesure exactement son contenu. .main-marq garde overflow:hidden, donc rien ne déborde de la section. Portée limitée à .marq-brand pour ne pas toucher les marquees de texte (.main-marq.standerd). --------------------------------------------------------------------------- */ .marq-brand .main-marq .box, .marq-brand .main-marq .item-marq { -ms-flex-negative: 0; flex-shrink: 0; } /* --------------------------------------------------------------------------- Boutons : les classes .butn-bord et .radius-30 n'ont JAMAIS existé. Le HTML du projet les utilise partout (7 boutons) mais aucune feuille chargée ne les définit — ni style.css dark, ni style.css light, ni plugins.css. Le thème ne fournit que .butn (une transition) et .butn-md (un padding), d'où des boutons rendus comme du texte nu. On leur donne enfin un corps ici. Pas de classe de thème sur : seul le style.css chargé change. Le contour utilise donc currentColor pour suivre la couleur de texte du thème, et le bouton plein porte les bleus de marque (dégradé du footer #053a5f, accent #005a82) qui tiennent sur fond clair comme sur fond sombre. --------------------------------------------------------------------------- */ /* Le thème nomme ces utilitaires .border-radius-15px / .border-radius-30px ; le HTML du projet a toujours écrit .radius-15 / .radius-30, qui n'existaient nulle part — d'où les cartes et boutons à angles droits (137 usages de radius-30, 4 de radius-15). On définit les noms que le HTML emploie réellement. */ .radius-15 { border-radius: 15px; } .radius-30 { border-radius: 30px; } /* Secondaire : contour. Le padding reste géré par .butn-md / .butn-full, plus spécifiques, donc on n'y touche pas. */ .butn-bord { display: inline-block; background: transparent; border: 1px solid currentColor; color: inherit; text-align: center; text-decoration: none; line-height: 1.2; } .butn-bord:hover { background: #fff; border-color: #fff; color: #141414; } .butn-bord:hover .text { color: #141414; } /* Principal : plein. Sélecteurs doublés (.butn-bord.butn-fill) pour passer devant .butn-bord sans dépendre de l'ordre des règles. */ .butn-bord.butn-fill { background: #053a5f; border-color: #005a82; color: #fff; } .butn-bord.butn-fill .text { color: #fff; } .butn-bord.butn-fill:hover { background: #005a82; border-color: #005a82; color: #fff; } .butn-bord.butn-fill:hover .text { color: #fff; } /* WhatsApp : .text-hover-success était elle aussi une classe fantôme. On lui donne le vert de la marque WhatsApp au survol. */ .butn-bord.text-hover-success:hover { background: #25d366; border-color: #25d366; color: #fff; } .butn-bord.text-hover-success:hover .text { color: #fff; }