diff --git a/contentcuration/contentcuration/frontend/administration/pages/AdministrationIndex.vue b/contentcuration/contentcuration/frontend/administration/pages/AdministrationIndex.vue
index e6589334da..5650631c1a 100644
--- a/contentcuration/contentcuration/frontend/administration/pages/AdministrationIndex.vue
+++ b/contentcuration/contentcuration/frontend/administration/pages/AdministrationIndex.vue
@@ -72,9 +72,6 @@
 
 <style lang="scss">
 
-  $first-col-width: 75px;
-  $first-col-expanded-width: 350px;
-
   @mixin freeze {
     position: sticky;
     z-index: 3;
diff --git a/contentcuration/contentcuration/frontend/channelEdit/components/ContentNodeListItem/index.vue b/contentcuration/contentcuration/frontend/channelEdit/components/ContentNodeListItem/index.vue
index e7ca53c7ec..23812af296 100644
--- a/contentcuration/contentcuration/frontend/channelEdit/components/ContentNodeListItem/index.vue
+++ b/contentcuration/contentcuration/frontend/channelEdit/components/ContentNodeListItem/index.vue
@@ -475,11 +475,11 @@
 
   .description-col {
     flex-shrink: 1 !important;
-    width: calc(100% - $thumbnail-width - 206px);
+    width: calc(100% - #{$thumbnail-width} - 206px);
     word-break: break-word;
 
     .compact & {
-      width: calc(100% - $compact-thumbnail-width - 206px);
+      width: calc(100% - #{$compact-thumbnail-width} - 206px);
     }
   }
 
diff --git a/contentcuration/contentcuration/frontend/shared/views/LazyListGroup.vue b/contentcuration/contentcuration/frontend/shared/views/LazyListGroup.vue
index 61b977d820..761d0f611c 100644
--- a/contentcuration/contentcuration/frontend/shared/views/LazyListGroup.vue
+++ b/contentcuration/contentcuration/frontend/shared/views/LazyListGroup.vue
@@ -82,7 +82,7 @@
 
   $icon-padding: 16px;
   $icon-width: 25px;
-  $header-width: calc(2 * $icon-padding + $icon-width);
+  $header-width: calc(2 * #{$icon-padding} + #{$icon-width});
 
   .list-group {
     box-sizing: border-box;
@@ -108,7 +108,7 @@
   }
 
   .header-content.has-icon {
-    width: calc(100% - $header-width);
+    width: calc(100% - #{$header-width});
   }
 
   .list-group.open > .list-group-header .v-icon {
diff --git a/contentcuration/contentcuration/frontend/shared/views/files/ImageOnlyThumbnail.vue b/contentcuration/contentcuration/frontend/shared/views/files/ImageOnlyThumbnail.vue
index 122648d22c..5c3adb02df 100644
--- a/contentcuration/contentcuration/frontend/shared/views/files/ImageOnlyThumbnail.vue
+++ b/contentcuration/contentcuration/frontend/shared/views/files/ImageOnlyThumbnail.vue
@@ -32,7 +32,7 @@
       :class="$isRTL ? 'rtl-image' : 'ltr-image'"
     >
       <KIcon
-        icon="image" 
+        icon="image"
         :x="-1"
         :y="y - 14"
         :style="{ fill: '#999999' }"
@@ -167,18 +167,18 @@
     overflow: hidden; // Don't show alt text outside of img boundaries
 
     .caption + & {
-      height: calc(100% - $caption-height);
+      height: calc(100% - #{$caption-height});
     }
   }
 
   $svg-scale: 1.25;
-  $svg-width: calc(100% * 9 / 16 / $svg-scale);
-  $svg-top: calc((100% * 9 / 16 / 2) - ($svg-width / 2));
+  $svg-width: calc(100% * 9 / 16 / #{$svg-scale});
+  $svg-top: calc((100% * 9 / 16 / 2) - (#{$svg-width} / 2));
 
   svg.thumbnail-image {
     top: 0;
-    left: calc(50% - ($svg-width / 4));
-    width: calc($svg-width / 4);
+    left: calc(50% - (#{$svg-width} / 4));
+    width: calc(#{$svg-width} / 4);
     margin: 0 auto;
     overflow: visible;
 
@@ -214,7 +214,7 @@
     }
 
     .caption + & {
-      top: calc(($caption-height / 2) + $svg-top);
+      top: calc((#{$caption-height} / 2) + #{$svg-top});
     }
 
     .icon-only & {
diff --git a/contentcuration/contentcuration/frontend/shared/views/files/Thumbnail.vue b/contentcuration/contentcuration/frontend/shared/views/files/Thumbnail.vue
index bf0c0f72f6..de37842627 100644
--- a/contentcuration/contentcuration/frontend/shared/views/files/Thumbnail.vue
+++ b/contentcuration/contentcuration/frontend/shared/views/files/Thumbnail.vue
@@ -53,7 +53,7 @@
       class="thumbnail-image"
     >
       <KIcon
-        icon="infoOutline" 
+        icon="infoOutline"
         :x="+10"
         :y="y + 20"
         :style="{ fill: '#ffffff' }"
@@ -67,7 +67,7 @@
       :class="$isRTL ? 'rtl-image' : 'ltr-image'"
     >
       <KIcon
-        icon="image" 
+        icon="image"
         :x="-3"
         :y="y - 14"
         :style="{ fill: '#999999' }"
@@ -212,18 +212,18 @@
     overflow: hidden; // Don't show alt text outside of img boundaries
 
     .caption + & {
-      height: calc(100% - $caption-height);
+      height: calc(100% - #{$caption-height});
     }
   }
 
   $svg-scale: 1.25;
-  $svg-width: calc(100% * 9 / 16 / $svg-scale);
+  $svg-width: calc(100% * 9 / 16 / #{$svg-scale});
   $svg-top: calc((100% * 9 / 16 / 2) - ($svg-width / 2));
 
   svg.thumbnail-image {
     top: 0;
-    left: calc(50% - ($svg-width / 4));
-    width: calc($svg-width / 4);
+    left: calc(50% - (#{$svg-width} / 4));
+    width: calc(#{$svg-width} / 4);
     margin: 0 auto;
     overflow: visible;
 
@@ -259,7 +259,7 @@
     }
 
     .caption + & {
-      top: calc(($caption-height / 2) + $svg-top);
+      top: calc((#{$caption-height} / 2) + #{$svg-top});
     }
 
     .icon-only & {