Skip to content

Instantly share code, notes, and snippets.

@umanda
Created May 27, 2020 11:00
Show Gist options
  • Save umanda/880f15f881c40dbac6e458e496867c36 to your computer and use it in GitHub Desktop.
Save umanda/880f15f881c40dbac6e458e496867c36 to your computer and use it in GitHub Desktop.
Advanced SASS
$counter: 3;
$color : red;
$color-odd : 'odd';
$color-even :'even';
@function randomNum($min, $max) {
$rand: random();
$randomNum: $min + floor($rand * (($max - $min) + 1));
@return $randomNum;
}
@for $i from 1 through $counter {
$size: randomNum(100,300);
li:nth-child(#{$i}) {
color : $color
}
li{
&.test-#{$i}{
font-size : $size+px
}
}
@if ($i % 2 == 1) {
div{
font: $color-odd ;
}
} @else {
div{
font: $color-even;
}
}
}
$sizes: 40px, 50px, 80px;
@each $size in $sizes {
.icon-#{$size} {
font-size: $size;
height: $size;
width: $size;
}
}
@function scale-below($value, $base, $ratio: 1.618) {
@while $value > $base {
$value: $value / $ratio;
}
@return $value;
}
$normal-font-size: 16px;
sup {
font-size: scale-below(20px, 16px);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment