refactor: list convert Light DOM LESS to SCSS

Author: BadeJaya

src/less/components.less

@@ -29,7 +29,6 @@
 @import 'components/dropdown-select/index';
 @import 'components/file/index';
 @import 'components/form/index';
-@import 'components/list/index';
 @import 'components/popover/index';
 @import 'components/radio/index';
 @import 'components/search/index';

src/scss/components/_index.scss

@@ -8,6 +8,7 @@
 @import "grid/index";
 @import "icon/index";
 @import "layout/index";
+@import "list/index";
 @import "loader/index";
 @import "menu/index";
 @import "modal/index";

src/less/components/list/index.less renamed to src/scss/components/list/_index.scss

@@ -1,34 +1,30 @@
-@import (reference) 'components/grid/index';
-
-#List {
-  .reset() {
-    margin: 1em 0;
-  }
-}
+@import "components/grid/config";
 
 dl.hxList {
-  #List.reset();
+  margin: 1em 0;
   display: block;
 
   > div {
     display: flex;
 
     + div {
-      margin-top: @grid-gutter-size; // 20px
+      margin-top: $gutter-size; // 20px
     }
   }
 
   dd {
-    #grid.span(10);
+    @include grid-span(10);
+
     display: block;
     flex-shrink: 1;
-    margin-left: @grid-gutter-size; // 20px
+    margin-left: $gutter-size; // 20px
     order: 2;
   }
 
   dt {
-    #grid.span(2);
-    color: @gray-750;
+    @include grid-span(2);
+
+    color: $gray-750;
     display: block;
     flex-shrink: 1;
     order: 1;
@@ -71,12 +67,16 @@ ul.hxList {
 
 ol.hxList {
   list-style-type: decimal;
+
   ol {
     list-style-type: upper-alpha;
+
     ol {
       list-style-type: upper-roman;
+
       ol {
         list-style-type: lower-alpha;
+
         ol {
           list-style-type: lower-roman;
         }
@@ -87,14 +87,15 @@ ol.hxList {
 
 ul.hxList {
   list-style-type: square;
+
   ul {
     list-style-type: square;
   }
 }
 
 // DEPRECATED: remove in v1.0.0
 hx-def + hx-def {
-  margin-top: @grid-gutter-size; // 20px
+  margin-top: $gutter-size; // 20px
 }
 
 hx-dl.hxVertical {