Pinned

1. All CSS Cursors All CSS Cursors

   1

   //********************/

   2

   //*** ALL CURSORS  ***/

   3

   //********************/

   4

   $cursorsArray: (

   5

       alias , // {cursor: alias;}

2. Cross Browser Prefixes (use with Att... Cross Browser Prefixes (use with Attribute or Value)

   1

   //****************************************************/

   2

   //****************************************************/

   3

   //***                                              ***/

   4

   //***    CROSS BROWSER PREFIXES (cross-browser)    ***/

   5

   //***                                              ***/

3. SCSS: OPACITY (1 - 100) SCSS: OPACITY (1 - 100)

   1

   //*** OPACITY ***/

   2

   // EXAMPLE OUTPUT: .opacity-50 { opacity: .5; }

   3

   @for $i from 1 through 100 {

   4

       .opacity-#{$i} {

   5

           opacity: #{$i * .01};

4. SCSS: Get index of a key value SCSS: Get index of a key value

   1

   $colors: (

   2

       a: red,

   3

       b: green,

   4

       c: blue

   5

   );

5. SCSS: Responsive iFrame SCSS: Responsive iFrame

   1

   /* Then style the iframe to fit in the container div with full height and width */

   2

   .responsive-iframe {

   3

       position: relative;

   4

       overflow: hidden;

   5

       width: 100%;

6. Create Multiple Box Shadow classname... Create Multiple Box Shadow classnames to use throughout your project by simply creating a new variable and adding it to the GlobalShadowsArray

   1

   // Create Multiple Box Shadow classnames to use throughout your project by simply creating a new variable and adding it to the GlobalShadowsArray

   2

   // 1. Create a new shadow variable in [BOX SHADOW VARIABLES]. (ie. $shadow-5)

   3

   // 2. Add the shadow name and shadow variable to the $GlobalShadowsArray. (ie. shadow-5 $shadow-5)

   4

   // 3. Run scss compiler :)

   5

   //