Tips pour Thèmes E-monsite

Fil d'ariane transparent :

.breadcrumb{ background-color: transparent; }

Personnaliser le titre du site

.brand-title {font-size: 3rem; font-family: var(--headings-font-family); font-weight: bold; }

Modifier la couleur du BTN Primary

.btn-primary{ border: var(--highlighted-bg-color) 1px solid; }

Ajouter un effet de survol sur les images des listes d'articles de blog

	
		.card.blog-item, .card.blog-item a {
   		overflow : hidden ; 
   		} 

   		.card.blog-item img {
   		transform : scale(1) ; 
   		transition : .3s ease-in-out ; 
   		}
   		
   		.card.blog-item:hover img {
   		transform : scale(1) ; 
   		}

Texte qui défile

CSS à déclarer

.bio { text-align: center; /*max-width: 70%;*/ margin: 0 auto; overflow: hidden; } .bio p { color: var(--primary); display:inline-block; font-size: 6em; font-family: var(--headings-font-family); margin-bottom: 0; text-transform: uppercase; transform: translateX(100%); white-space: nowrap; } .text-moving { animation: moveText linear 45s 0s forwards infinite; }

HTML à insérer

<div class="bio"
<p class="text-moving">TEXTE ICI</p>
</div>

Voir sur codepen