+
div.list{
- display: flex;
-
- // flex properties
- flex-direction: column;
- justify-content: flex-start;
-
- & > *:first-child{ margin-top: 1em; }
- & > *:last-child{ margin-bottom: 3em; }
-
- /* (1) List element */
- & > section{
-
- display: block;
-
- margin: .3em 1em;
- padding: .8em 1em;
-
- border-radius: 5px / 5px;
-
- background-color: #fff;
-
- }
-
- /* (2) List title */
- & > h1{
- display: inline-block;
-
- margin: 0 1.2em;
- margin-top: .8em;
-
- font-size: inherit;
- color: darken($secondary-color, 5%);
-
- }
-
- /* (3) List separator */
- & > hr{
- display: block;
- position: relative;
-
- margin: 1em 1.5em;
-
- border: 0;
- border-bottom: 2px solid darken($bg-color, 5%);
- }
-
-}
-
-
-
-
-
+@import 'container/list';
+/* [2] Card style
+---------------------------------*/
@import 'container/card';
\ No newline at end of file
diff --git a/webpack/scss/container/list.scss b/webpack/scss/container/list.scss
new file mode 100644
index 0000000..f6b9b74
--- /dev/null
+++ b/webpack/scss/container/list.scss
@@ -0,0 +1,54 @@
+@import '../constants';
+
+
+
+/* [3] List style -> container
+---------------------------------*/
+#CONTAINER > div.list{
+ display: flex;
+
+ // flex properties
+ flex-direction: column;
+ justify-content: flex-start;
+
+ & > *:first-child{ margin-top: 1em; }
+ & > *:last-child{ margin-bottom: 3em; }
+
+ /* (1) List element */
+ & > section{
+
+ display: block;
+
+ margin: .3em 1em;
+ padding: .8em 1em;
+
+ border-radius: 5px / 5px;
+
+ background-color: #fff;
+
+ }
+
+ /* (2) List title */
+ & > h1{
+ display: inline-block;
+
+ margin: 0 1.2em;
+ margin-top: .8em;
+
+ font-size: inherit;
+ color: darken($secondary-color, 5%);
+
+ }
+
+ /* (3) List separator */
+ & > hr{
+ display: block;
+ position: relative;
+
+ margin: 1em 1.5em;
+
+ border: 0;
+ border-bottom: 2px solid darken($bg-color, 5%);
+ }
+
+}
\ No newline at end of file