css/bootstrap/_custom.scss

   1 // Nick
   2
   3 $footer-link-color: darken(theme-color("success"), 10%);
   4 $footer-link-hover-color: darken($footer-link-color, 10%);
   5
   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
  11 .scrollbar-fix {
  12   padding-left: calc(100vw - 100%);
  13 }
  14
  15 // needed for svg icons inside card headers
  16 // creates an inline element with correct width but no height
  17 // the svg is positioned at an arbitrary position within this
  18 .icon32-outer {
  19   display: inline-block;
  20   position: relative;
  21   width: calc(32px + 1rem);
  22   height: 0;
  23 }
  24 .icon32-inner {
  25   position: absolute;
  26   top: -22px;
  27 }
  28
  29 // apply this to svg, see _svg/icon_search.svg
  30 .svg-icon {
  31   display: inline-block;
  32   width: 1em;
  33   height: 1em;
  34   stroke-width: 0;
  35   stroke: currentColor;
  36   fill: currentColor;
  37   position: relative;
  38   //bottom: -.125em;
  39 }
  40
  41 // use this to display the pi symbol without horrible blocky look in Sans
  42 .serif {
  43   font-family: $font-family-serif;
  44 }
  45
  46 // apply this to table to get an icon with vertically centred text next to it
  47 .icon-and-text {
  48   vertical-align: middle;
  49   td {
  50     padding: .25em .5em;
  51   }
  52 }
  53
  54 .search-results li {
  55   margin-bottom: .5em;
  56 }
  57
  58 footer, .footer {
  59   padding-top: 35px;
  60   padding-bottom: 25px;
  61   background-color: $gray-400;
  62   a {
  63     color: $footer-link-color;
  64
  65     &:hover,
  66     &:focus {
  67       color: $footer-link-hover-color;
  68       //background-color: $footer-link-hover-bg;
  69     }
  70   }
  71 }