cleaning sass

resources/assets/sass/_fa-utils.scss

@@ -1,30 +1,30 @@
 
 // padding right for icons (must not use space next to it!)
 .fa-pr::before {
-	margin-right: $sp1;
+	margin-right: dist(2);
 }
 .fa-pl::before {
-	margin-left: $sp1;
+	margin-left: dist(2);
 }
 
 .fa-pr2::before {
-	 margin-right: $sp2;
+	 margin-right: dist(4);
  }
 .fa-pl2::before {
-	margin-left: $sp2;
+	margin-left: dist(4);
 }
 
 .fa-px::before {
-	margin-left: $sp1;
-	margin-right: $sp1;
+	margin-left: dist(2);
+	margin-right: dist(2);
 }
 .fa-px2::before {
-	margin-left: $sp2;
-	margin-right: $sp2;
+	margin-left: dist(4);
+	margin-right: dist(4);
 }
 
 .fa-large.fa-pr::before {
-	margin-right: $sp2;
+	margin-right: dist(4);
 }
 
 .fa-large {

resources/assets/sass/app.scss

@@ -23,6 +23,6 @@ html {
 
 .bio-table {
 	td {
-		padding-top: $sp1;
+		padding-top: dist(2);
 	}
 }

resources/assets/sass/bootstrap-customizations/_card.scss

@@ -34,8 +34,8 @@
 }
 
 .card-body .close {
-	margin-top:-$sp1;
-	margin-right:-$sp1;
+	margin-top: dist(-2);
+	margin-right: dist(-2);
 	min-width: 1.5rem;
 	text-align:center;
 }

resources/assets/sass/bootstrap-customizations/_navbar.scss

@@ -9,7 +9,8 @@
 }
 
 .nav-link {
-	padding: $sp1 $sp3;
+	@include py(2);
+	@include px(6);
 	display: inline-block;
 }
 

resources/assets/sass/bootstrap-customizations/_variables.scss

@@ -1,15 +1,3 @@
-$sp0: 0;
-$sp1_2: $spacer*.25;
-
-$sp1_4: $spacer*.125;
-$sp2_4: $sp1_2;
-$sp3_4: $spacer*.75;
-
-$sp1: $spacer*.5;
-$sp2: $spacer*1;
-$sp3: $spacer*1.5;
-$sp4: $spacer*2;
-
 // Body
 $body-bg: white;
 
@@ -35,5 +23,5 @@ $tooltip-max-width: 300px;
 $tooltip-bg: darken($primary, 20%);
 $tooltip-arrow-color: $tooltip-bg;
 
-$pagination-padding-y-sm: $sp1_2;
-$pagination-padding-x-sm: $sp3_4;
+$pagination-padding-y-sm: dist(1);
+$pagination-padding-x-sm: dist(3);