ux(): completed gf-size class rename

public/sass/_grafana.scss

@@ -22,6 +22,7 @@
 @import "utils/validation";
 @import "utils/angular";
 @import "utils/spacings";
+@import "utils/widths";
 
 // LAYOUTS
 @import "layout/page";

public/sass/_variables.scss

@@ -77,17 +77,6 @@ $grid-gutter-width: 30px !default;
 
 $enable-flex: false;
 
-$form-sizes: (
-  xs: 5.7rem,
-  sm: 7rem,
-  md: 8.5rem,
-  lg: 10rem,
-  xl: 14rem,
-  xxl: 21rem,
-  xxxl: 28rem
-) !default;
-
-
 // Typography
 // -------------------------
 

public/sass/components/_gf-form.scss

@@ -57,18 +57,6 @@ $gf-form-margin: 0.2rem;
   flex-shrink: 0;
 }
 
-@each $size, $value in $form-sizes {
-  .gf-size-#{$size} { width: $value; }
-
-  .gf-size-max-#{$size} {
-    flex-grow: 1;
-    max-width: $value;
-  }
-}
-
-.gf-size-max { width: 100%; }
-.gf-size-auto { width: auto; }
-
 .gf-form-input {
   display: block;
   width: 100%;

public/sass/utils/_spacings.scss

@@ -28,19 +28,6 @@
   }
 }
 
-// widths
-@for $i from 1 through 30 {
-  .width-#{$i} {
-    width: ($spacer * $i) - $gf-form-margin;
-  }
-}
-
-@for $i from 1 through 30 {
-  .max-width-#{$i} {
-    max-width: ($spacer * $i) - $gf-form-margin;
-    flex-grow: 1;
-  }
-}
 
 // Positioning
 

public/sass/utils/_widths.scss

@@ -0,0 +1,19 @@
+
+
+.max-width { width: 100%; }
+.width-auto { width: auto; }
+
+// widths
+@for $i from 1 through 30 {
+  .width-#{$i} {
+    width: ($spacer * $i) - $gf-form-margin;
+  }
+}
+
+@for $i from 1 through 30 {
+  .max-width-#{$i} {
+    max-width: ($spacer * $i) - $gf-form-margin;
+    flex-grow: 1;
+  }
+}
+