Sass komek

GameKing · 30 Dek 2022

Salam, menim asagidaki kimi sass kodum var.

SCSS:

.border-top {
  box-sizing: border-box;
  border-top: 1px rgba(#000, .12) solid;
  padding: 16px 0;
  width: 100%;

  &:hover { border: 2px rgba(#000, .5) solid; }
}

.border-top-red.border-top {
 border-top: 1px rgba(#ff0000, .12) solid;

 &:hover {
  border: 2px rgba(#ff0000, .5) solid;
 }
}

.action-buttons {
  @extend .border-top;
  color: #4285f4;
}

.reset-buttons {
  @extend .border-top;
  color: #cddc39;
}

Yuxardaki sass kodunu compile edende asagidaki neticeni elde edirem.

CSS:

.border-top, .reset-buttons, .action-buttons {
  box-sizing: border-box;
  border-top: 1px rgba(0, 0, 0, 0.12) solid;
  padding: 16px 0;
  width: 100%;
}
.border-top:hover, .reset-buttons:hover, .action-buttons:hover {
  border: 2px rgba(0, 0, 0, 0.5) solid;
}

.border-top-red.border-top, .border-top-red.reset-buttons, .border-top-red.action-buttons {
  border-top: 1px rgba(255, 0, 0, 0.12) solid;
}
.border-top-red.border-top:hover, .border-top-red.reset-buttons:hover, .border-top-red.action-buttons:hover {
  border: 2px rgba(255, 0, 0, 0.5) solid;
}

.action-buttons {
  color: #4285f4;
}

.reset-buttons {
  color: #cddc39;
}

Lakin asagida qeyd etdiyim, css selectorlarin css fayl icerisinde dusmesini istemirem.

CSS:

.border-top-red.reset-buttons, .border-top-red.action-buttons { /* ... */ }

.border-top-red.reset-buttons:hover, .border-top-red.action-buttons:hover { /* ... */ }

Sass ile bu problemi nece hell ede bilerem?

GameKing · 31 Dek 2022

Problemi sass placeholder ile hell etdim.

Bilmeyenler ucun, kodu asagida paylasiram.

SCSS:

.border-top, %border-top {
  box-sizing: border-box;
  border-top: 1px rgba(#000, .12) solid;
  padding: 16px 0;
  width: 100%;

  &:hover { border: 2px rgba(#000, .5) solid; }
}

.border-top-red.border-top {
 border-top: 1px rgba(#ff0000, .12) solid;

 &:hover {
  border: 2px rgba(#ff0000, .5) solid;
 }
}

.action-buttons {
  @extend %border-top;
  color: #4285f4;
}

.reset-buttons {
  @extend %border-top;
  color: #cddc39;
}

GameKing · 31 Dek 2022

Deyirem ne yaxsi ki, ingilis forumlari var, yoxsa azeri forumlarda komek eden yoxdur, gerci komek ede bilmek ucun de bu sahede biliyin olmasi lazimdir, neyse adminler movzunu off ede biler.

Forumda sizi görməkdə şadıq 👋,

Forum məzmununa və bütün xidmətlərimizə daxil olmaq üçün qeydiyyatdan keçməli və ya foruma daxil olmalısınız. Foruma üzv olmaq tamamilə ödənişsizdir.

Sass komek

GameKing

Məhşur istifadəçi

GameKing

Məhşur istifadəçi

GameKing

Məhşur istifadəçi

Oxşar mövzular