github.com/kardianos/nomad@v0.1.3-0.20151022182107-b13df73ee850/website/source/assets/stylesheets/_utilities.scss (about)

     1  //
     2  // Utility classes
     3  // --------------------------------------------------
     4  
     5  
     6  //
     7  // -------------------------
     8  @mixin anti-alias() {
     9      text-rendering: optimizeLegibility;
    10      -webkit-font-smoothing: antialiased;
    11  }
    12  
    13  @mixin open-light() {
    14      font-family: $font-family-open-sans;
    15      font-weight: 300;
    16  }
    17  
    18  @mixin open() {
    19      font-family: $font-family-open-sans;
    20      font-weight: 400;
    21  }
    22  
    23  @mixin open-sb() {
    24      font-family: $font-family-open-sans;
    25      font-weight: 600;
    26  }
    27  
    28  @mixin open-bold() {
    29      font-family: $font-family-open-sans;
    30      font-weight: 700;
    31  }
    32  
    33  @mixin skewY($skew) {
    34      -webkit-transform: skewY($skew);
    35      -moz-transform: skewY($skew);
    36      -ms-transform: skewY($skew);
    37      -o-transform: skewY($skew);
    38      transform: skewY($skew);
    39  }
    40  
    41  @mixin v-nav-style-core{
    42      color: $gray-darker;
    43      font-family: $font-family-blanc-reg;
    44      font-size: 13px;
    45      text-transform: uppercase;
    46      letter-spacing: 0.0625em;
    47  }
    48  
    49  @mixin v-nav-style{
    50      margin: 0 15px;
    51      padding: 0;
    52      line-height: 22px;
    53      @include v-nav-style-core();
    54      @include transition( color 0.3s ease );
    55  
    56      &:hover{
    57          color: $green-dark;
    58          @include transition( color 0.3s ease );
    59          background-color: transparent;
    60      }
    61  }
    62  
    63  @mixin bez-1-transition{
    64      @include transition( all 300ms ease-in-out );
    65  }
    66  
    67  
    68  @keyframes press {
    69    0% {
    70      opacity: 1;
    71    }
    72    50% {
    73      opacity: .55
    74    }
    75    100% {
    76      opacity: 1;
    77    }
    78  }
    79  
    80  @-webkit-keyframes press {
    81    0% {
    82      opacity: 1;
    83    }
    84    50% {
    85      opacity: .55
    86    }
    87    100% {
    88      opacity: 1;
    89    }
    90  }
    91  
    92  #demo-app .loading-bar{
    93      display: block;
    94      -webkit-animation: shift-rightwards 2s ease-in-out infinite;
    95      -moz-animation: shift-rightwards 2s ease-in-out infinite;
    96      -ms-animation: shift-rightwards 2s ease-in-out infinite;
    97      -o-animation: shift-rightwards 2s ease-in-out infinite;
    98      animation: shift-rightwards 2s ease-in-out infinite;
    99      -webkit-animation-delay: .4s;
   100      -moz-animation-delay: .4s;
   101      -o-animation-delay: .4s;
   102      animation-delay: .4s;
   103  }
   104  
   105  .loading-bar{
   106      position: fixed;
   107      display: none;
   108      bottom: 0;
   109      left: 0;
   110      right: 0;
   111      height: 2px;
   112      z-index: 800;
   113      background: $blue;
   114      -webkit-transform: translateX(100%);
   115      -moz-transform: translateX(100%);
   116      -o-transform: translateX(100%);
   117      transform: translateX(100%);
   118  }
   119  
   120  @-webkit-keyframes shift-rightwards
   121  {
   122      0%
   123      {
   124          @include translate(-100%, 0);
   125      }
   126  
   127      40%
   128      {
   129          @include translate(0%, 0);
   130      }
   131  
   132      60%
   133      {
   134          @include translate(0%, 0);
   135      }
   136  
   137      100%
   138      {
   139          @include translate(100%, 0);
   140      }
   141  
   142  }
   143  @-moz-keyframes shift-rightwards
   144  {
   145      0%
   146      {
   147          @include translate(-100%, 0);
   148      }
   149  
   150      40%
   151      {
   152          @include translate(0%, 0);
   153      }
   154  
   155      60%
   156      {
   157          @include translate(0%, 0);
   158      }
   159  
   160      100%
   161      {
   162          @include translate(100%, 0);
   163      }
   164  
   165  }
   166  @-o-keyframes shift-rightwards
   167  {
   168      0%
   169      {
   170          @include translate(-100%, 0);
   171      }
   172  
   173      40%
   174      {
   175          @include translate(0%, 0);
   176      }
   177  
   178      60%
   179      {
   180          @include translate(0%, 0);
   181      }
   182  
   183      100%
   184      {
   185          @include translate(100%, 0);
   186      }
   187  
   188  }
   189  @keyframes shift-rightwards
   190  {
   191      0%
   192      {
   193          @include translate(-100%, 0);
   194      }
   195  
   196      40%
   197      {
   198          @include translate(0%, 0);
   199      }
   200  
   201      60%
   202      {
   203          @include translate(0%, 0);
   204      }
   205  
   206      100%
   207      {
   208          @include translate(100%, 0);
   209      }
   210  }