SCSS сниппеты

SCSS сниппеты, которыми я пользуюсь:

container -блока для центрирования основного содержимого

.container {
   margin: 0 auto;
   max-width: $1;
 
 
   @media (max-width: $1){
      margin: auto $2;
   }
} 

mediamax - Desktop First медиа-запрос

@media screen and (max-width: $1) {
 
}  

mediamin - Mobile First медиа-запрос

@media screen and (min-width: $1) {
 
}

posc - абсолютное центрирование по осям X и Y

someElement {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
}

poshc - абсолютное центрирование по оси X

someElement {
   position: absolute;
   left: 50%;
   transform: translateX(-50%);
}

pozvc - абсолютное центрирование по оси Y

someElement {
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
}

mc - центрирование внешними отступами по оси Y

someElement {
   margin-left: auto;
   margin-right: auto;
}

flexc - центрирование по главной и поперечной оси

someElement {
   display: flex;
   justify-content: center;
   align-items: center;
}

pseudo - три часто используемые свойства псевдоэлемента

someElement::pseudoElement {
   content: '';
   display: block;
   position: absolute;
}

link - ссылка и три состояния

link {
  
  &:hover,
  &:focus, 
  &:active {
    
  }
}