내가 쓰는 sass mixins (계속 업데이트)

a{
    text-decoration:none;
    font-style:none;
    cursor:pointer;
    &:visited ,
    &:hover,
    &:active,
    &:focus {
        text-decoration:none;
        font-style:none;
    }
    &:hover{
        text-decoration:underline;
    }
}   

반응형 구문 작성하기

//반응형 (13인치 일반 피씨 사이즈)
@mixin for-desktop-up {
  @media (max-width: 1280px) { @content; }
}

//태블릿, 모바일 (default)
@mixin for-phone-only {
  //큰 사이즈 태블릿
  @media (min-width: 768px) and (max-width: 1024px){
    @content;
  }
  //아이패드 미니 
  @media screen and (max-width:768px){
    @content;
  }
}

//핸드폰 
@mixin for-phone-only-s {
  @media (max-width: 380px) { @content; }
} 

화살표 그리기

//화살표
@mixin arrow($direction, $size, $color) {
  content: ""; // ensures the arrows are visible

  // ensures the size of the arrows is correct:
  width: 0;
  height: 0;

  // Lists for positions/directions
  $directions: ('down', 'left', 'up', 'right');
  $positions: ('top', 'right', 'bottom', 'left');

  // Loop through each position
  @each $position in $positions {
    // Calculate the index of the position in the list
    $index: index($positions, $position);

    // If the position matches the direction, render a colored border
    @if nth($directions, $index) == $direction {
      border-#{$position}: $size solid $color;
    } @else {
      border-#{$position}: $size solid transparent;
    }
  }
}

속성값 토글시키는 애니메이션 제작

(애니메이션 이름, 속성이름, 기본값, 변경값

@mixin makeBgAni($aniName, $propertyName, $baseC, $nextC){
  @keyframes #{$aniName}
  {
    0%   {#{$propertyName}:$baseC;}
    50%  {#{$propertyName}: $nextC;}
    100% {#{$propertyName}: $baseC;}
  }

  @-webkit-keyframes #{$aniName}
      {
      0%   {#{$propertyName}:$baseC;}
      50%  {#{$propertyName}: $nextC;}
      100% {#{$propertyName}: $baseC;}
    }
  }

멀티라인 말줄임 표시 (n줄이상 작성시 ...표시)

// 멀티라인 말줄임 표시
// $line-cnt : 라인 수
// $line-height : line-height값
// 사용법 : @include ellipsis(3, 1.6em);
@mixin ellipsis($line-cnt, $line-height) {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: $line-cnt; /* 라인수 */
  -webkit-box-orient: vertical;
  word-wrap:break-word; 
  line-height: $line-height;
  height: $line-height * $line-cnt; 
}

@mixin reset-all-model($tag) {
    #{$tag}{
        margin: 0;
        padding: 0;
        vertical-align: baseline;
    }
}
//아이폰가로모드폰트사이즈버그
*{-webkit-text-size-adjust:none;}