[Résolu] Mixin non définie

Salut
Ayant eu un petit problème de scss je reprends tout mon code avec des fichiers vide et je remets mes règles petit à petit en compilant. Et j'ai eu un ce message d'erreur :

a écrit :

Lors de la compilation du fichier C:\laragon\www\site-de-base-j03\templates\protostar-perso-02\scss\user.scss
L'erreur détectée est: Undefined mixin bordure-texte: templates\protostar-perso-02\scss/_styles.scss on line 38, at column 2 Call Stack: #0 import templates\protostar-perso-02\scss/_styles.scss (unknown file) on line 19

La mixin bordure-texte est dans mon fichier _typos.scss :

@mixin bordure-texte($couleur:#000) {
	text-shadow:
		1px 0 0 black,
		0 1px 0 black,
		0 -1px 0 black,
		-1px 0 0 black,
		1px 1px 0 black,
		1px -1px 0 black,
		-1px 1px 0 black,
		-1px -1px 0 black;
}

Et le code qui me pose problème (il est dans _styles.scss) :

h1 {
	font-family:'$police-titre';
	color:$violet-a;
	font-size:3rem;
	text-align:center;
	@include bordure-texte;
	line-height:48px;
	margin-bottom:3px;
	padding-left:20px;
}

Dans _typos.scss j'ai une autre mixin :

@mixin ombrage-texte($couleur:#aaa) {
	text-shadow: 8px 8px 12px $couleur;
}

Que j'ai ajouté à mon code h1 :

h1 {
	font-family:'$police-titre';
	color:$violet-a;
	font-size:3rem;
	text-align:center;
	@include text-shadow;
	@include bordure-texte;
	line-height:48px;
	margin-bottom:3px;
	padding-left:20px;
}

Et j'ai le même message, mais cette fois pour la mixin text-shadow.

Mes codes ont l'air bon pourtant (ou alors je dois changer de lentille).

Étant en local je ne peux pas vous donner de lien.
Modifié par schtroumph (01 Jun 2022 - 16:36)

Bonjour,

Je ne suis pas féru de scss, je pencherais pour la variable que tu n'inclus pas dans ton @include bordure-texte($couleur); ou bien, tu charges/parses _typos.scss après _styles.scss

Cdt
Modifié par gcyrillus (01 Jun 2022 - 19:09)

gcyrillus a écrit :

Je ne suis pas féru de scss, je pencherais pour la variable que tu n'inclus pas dans ton @include bordure-texte($couleur);

C'est a dire ?

gcyrillus a écrit :
ou bien, tu charges/parses _typos.scss après _styles.scss

_typos.scss est effectivement apres _styles.scss. Je l'ai donc deplacer avant, mais c'est pareil.

schtroumph a écrit :

_typos.scss est effectivement après _styles.scss. Je l'ai donc déplacer avant, mais c'est pareil.

sinon, @include text-shadow; et @mixin ombrage-texte($couleur:#aaa) ne matchent pas.

Enfin l'un et l'autre annulent le précédent, tout deux utilisent text-shadow, seule la dernière valeur dans le CSS généré sera appliquée.

Essai ceci à la place :

@mixin bordure-texte($couleur:#000) {
	-webkit-text-stroke:1px $couleur;
    font-weight:bold;
}
@mixin ombrage-texte($couleur:#ff0) {
	text-shadow: 8px 8px 12px  $couleur;
}

h1 {
	font-family:'$police-titre';
	color:$violet-a;
	font-size:3rem;
	text-align:center;
	@include bordure-texte;
	@include ombrage-texte;
	line-height:48px;
	margin-bottom:3px;
	padding-left:20px;
}

Enfin, voit si en important _typo.scss à l'aide de @import "chemin_vers__typos.scss"; dans _styles.scss ne résoudra pas ton soucis de mixin indéfini/introuvable ?
Modifié par gcyrillus (04 Jun 2022 - 20:52)

En voulant faire ce que tu me conseillais, j'ai trouvé d'où vient le problème : c'est moi .

Dans mon h1, pour l'ombrage, j'ai ecris @include text-shadow; . Or la mixin c'est :

@mixin ombrage-texte($couleur:#aaa) {
	text-shadow: 8px 8px 12px $couleur;
}

Au lieu de ombrage-texte j'ai ecris text-shadow ! c'est normal que la mixin était indéfinie.

Merci pour ton aide
Modifié par schtroumph (05 Jun 2022 - 09:30)