3 $footer-link-color: darken(theme-color("success"), 10%);
4 $footer-link-hover-color: darken($footer-link-color, 10%);
6 // apply this to a div inside the body tag
7 // prevents page shifting to left/right as scrollbar appears/disappears
8 // it works by calculating the width of the scrollbar and then adding
9 // the corresponding amount of padding to left to keep things centered
10 // see https://stackoverflow.com/questions/45524214/how-do-i-stop-my-web-content-from-shifting-left-when-the-vertical-scrollbar-appe
12 padding-left: calc(100vw - 100%);
15 // needed for svg icons inside buttons, card headers, etc
16 // creates an inline element with correct width but no height
17 // the svg is positioned within this to vertically centre on a capital letter
24 @each $icon-size, $icon-size-px in $icon-sizes {
25 .icon#{$icon-size}-outer {
26 display: inline-block;
30 vertical-align: baseline;
32 .icon#{$icon-size}-inner {
35 top: calc(-.5 * $icon-size-px - .35em); // .35em = approx half cap height
37 height: $icon-size-px;
43 // use this to display the pi symbol without horrible blocky look in Sans
45 font-family: $font-family-serif;
48 // apply this to table to get an icon with vertically centred text next to it
50 vertical-align: middle;
63 background-color: $gray-400;
65 color: $footer-link-color;
69 color: $footer-link-hover-color;
70 //background-color: $footer-link-hover-bg;