From 658e3dd62eb84bf72c38b1c01885c292a05151be Mon Sep 17 00:00:00 2001
From: Nicolas Constant <github@nicolas-constant.com>
Date: Tue, 9 Apr 2019 22:56:05 -0400
Subject: [PATCH] init scss structure

---
 docs/assets/css/style.css               | 25 +++++++++++++++++++++
 docs/assets/sass/abstracts/_mixins.scss | 29 ++++++++++++++++++++++++
 docs/assets/sass/base/_base.scss        | 30 +++++++++++++++++++++++++
 docs/assets/sass/layout/_header.scss    |  0
 docs/assets/sass/main.scss              |  5 +++++
 5 files changed, 89 insertions(+)
 create mode 100644 docs/assets/sass/abstracts/_mixins.scss
 create mode 100644 docs/assets/sass/base/_base.scss
 create mode 100644 docs/assets/sass/layout/_header.scss

diff --git a/docs/assets/css/style.css b/docs/assets/css/style.css
index e69de29b..94cbae9c 100644
--- a/docs/assets/css/style.css
+++ b/docs/assets/css/style.css
@@ -0,0 +1,25 @@
+*,
+*::after,
+*::before {
+  margin: 0;
+  padding: 0;
+  box-sizing: inherit; }
+
+html {
+  font-size: 62.5%; }
+  @media (max-width: 78em) {
+    html {
+      font-size: 56.25%; } }
+  @media (max-width: 56.25em) {
+    html {
+      font-size: 50%; } }
+  @media (min-width: 112.5em) {
+    html {
+      font-size: 75%; } }
+
+body {
+  box-sizing: border-box;
+  padding: 3rem; }
+  @media (max-width: 56.25em) {
+    body {
+      padding: 0rem; } }
diff --git a/docs/assets/sass/abstracts/_mixins.scss b/docs/assets/sass/abstracts/_mixins.scss
new file mode 100644
index 00000000..e203526e
--- /dev/null
+++ b/docs/assets/sass/abstracts/_mixins.scss
@@ -0,0 +1,29 @@
+@mixin clearfix {
+    &::after {
+        content: "";
+        display: table;
+        clear: both;        
+    }    
+}
+
+@mixin absCenter {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+}
+
+@mixin respond($breakpoint) {
+    @if $breakpoint == phone {
+        @media (max-width: 37.5em){ @content };     //600px
+    }
+    @if $breakpoint == tab-port {
+        @media (max-width: 56.25em){ @content };      //900px
+    }
+    @if $breakpoint == tab-land {
+        @media (max-width: 78em){ @content };     //1200px
+    }
+    @if $breakpoint == big-desktop {
+        @media (min-width: 112.5em){ @content };     //1800px
+    }
+}
\ No newline at end of file
diff --git a/docs/assets/sass/base/_base.scss b/docs/assets/sass/base/_base.scss
new file mode 100644
index 00000000..96ba668f
--- /dev/null
+++ b/docs/assets/sass/base/_base.scss
@@ -0,0 +1,30 @@
+*,
+*::after,
+*::before {
+    margin: 0;
+    padding: 0;
+    box-sizing: inherit;
+}
+
+html {
+    font-size: 62.5%;
+   
+    @include respond(tab-land) {
+        font-size: 56.25%;
+    }
+    @include respond(tab-port) {
+        font-size: 50%;
+    }
+    @include respond(big-desktop) {
+        font-size: 75%;
+    }
+}
+
+body {
+    box-sizing: border-box;
+    padding: 3rem;
+
+    @include respond(tab-port) {
+        padding: 0rem;
+    }
+}
\ No newline at end of file
diff --git a/docs/assets/sass/layout/_header.scss b/docs/assets/sass/layout/_header.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/docs/assets/sass/main.scss b/docs/assets/sass/main.scss
index e69de29b..edfae3fd 100644
--- a/docs/assets/sass/main.scss
+++ b/docs/assets/sass/main.scss
@@ -0,0 +1,5 @@
+@import "./abstracts/mixins";
+
+@import "./base/base";
+
+@import "./layout/header";
\ No newline at end of file