Add stark❕

1 files changed, 97 insertions, 0 deletions

diff --git a/src/css/_sommaire.scss b/src/css/_sommaire.scss
new file mode 100755
index 0000000..c4e002a
--- /dev/null
+++ b/src/css/_sommaire.scss
@@ -0,0 +1,97 @@
+#sommaire {
+  height: 40px; 
+  width: auto;
+  text-align: center;
+  @media #{$gt-gsm} {
+    padding-left: 290px;
+  }
+}
+.sommaire_blien {
+   display: inline-block;
+   width: 33%;
+   text-align: left;
+   color: #121311;
+   font-size: 0.8em;
+   font-weight: bold;
+   font-family:  monospace, serif;
+   text-shadow: 0 1px 0 #DDD;
+   color: #888888;
+   &:before {
+     content: "/";
+   }
+   a {
+     color: #888888;
+     outline: none;
+     text-decoration: none;
+   }
+   a:hover {
+     color: #BBAABB;
+   }
+}
+
+#side-bar {
+  text-align:center;
+  display: block;
+  width:100%;
+  height:auto;
+  text-rendering: optimizelegibility;
+  box-sizing: border-box;
+  background:#F5F6F5;
+  padding-top: 10px;
+
+  h1 {
+    font-family:  monospace, "Helvetica Neue", Arial, sans-serif;
+    /*font-family: "PT Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
+     */
+  }
+  svg { 
+    margin: 0 auto;
+    display: block;
+  }
+
+
+  @media #{$gt-gsm} {
+    position: fixed;
+    top: 0px;
+    bottom: 0px;
+    left: 0px;
+    height: 100%;
+    width: 290px;
+    transition: left 0.5s ease-in 0.25s;
+    text-align: center;
+    /*background: none repeat scroll 0% 0% #F5F6F5;*/
+    background:#FFF;
+    border-right: 3px solid rgba(51, 51, 51, 0.1);
+
+    &.hidden {
+      left: -290px;
+      transition: left 0.5s ease-out 0.15s;
+    }
+  }
+}
+#desc {
+  font-size: 90%;
+  margin-top: 15px;
+}
+#about {
+   font-size: 0.8em;
+   color: #666;
+}
+.about_bar {
+   display: inline-block;
+   width: 20%;
+   text-align: left;
+   color: #121311;
+   font-size: 0.8em;
+   font-weight: bold;
+   font-family:  monospace, serif;
+   text-shadow: 0 1px 0 #DDD;
+   margin:auto;
+}
+/*
+  <div id="sommaire">
+     <div id="sommaire_blien">Accueil</div>
+     <div id="sommaire_blien">Blog</div>
+     <div id="sommaire_blien">Liens</div>
+  </div>
+*/