first commit

user/themes/gilles_acezat/scss/theme/all.scss

@@ -0,0 +1,120 @@
+html, body{
+  overflow: hidden;
+}
+
+.card{
+  width: calc((100% / 3) - (10px));
+  margin-bottom: 7px;
+  .card-header{
+    width: 100%;
+    display: -webkit-inline-box;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-box-align: baseline;
+        -ms-flex-align: baseline;
+            align-items: baseline;
+    & > div {
+      margin-right: 5px;
+    }
+  }
+}
+
+.contact{
+  z-index: 999;
+  position: fixed;
+  right: 0;
+  top: 0;
+  width: 90px;
+  height: 90px;
+  -webkit-transition: width 0.5s ease, margin 0.5s;
+  transition: width 0.5s ease, margin 0.5s;
+  & > svg{
+    -webkit-animation: rotation 12s infinite linear;
+    animation: rotation 12s infinite linear;
+  }
+  h3{
+    cursor: pointer;
+    z-index: 999;
+    position: fixed;
+    top: 34px;
+    right: 37px;
+    color: white;
+    -webkit-transform: rotate(45deg);
+    transform: rotate(45deg);
+    transition: transform 0.5s ease;
+  }
+  .txt{
+    text-align: right;
+    position: fixed;
+    right: -200%;
+    left: 200%;
+    -webkit-transition: color 0.5s ease, right 0s;
+    color: transparent;
+    transition: color 0.5s ease, right 0s;
+    p{
+      margin-top: 1rem;
+      font-size: 1.5rem;
+      line-height: 2rem;
+      a{
+        display: inline-block;
+        width: 20px;
+        height: 20px;
+      }
+      em{
+        font-size: 1rem;
+      }
+      &:nth-last-of-type(2){
+        font-size: 1.2rem;
+        line-height: 1.6rem;
+      }
+    }
+  }
+  &.open{
+    width: 2000px;
+    height: auto;
+    margin: -550px;
+    -webkit-transition: width 0.5s ease, margin 0.5s;
+    transition: width 0.5s ease, margin 0.5s;
+   .txt{
+     color: white;
+    -webkit-transition: color 0.5s ease, right 0s;
+     transition: color 0.5s ease, right 0s;
+     text-align: right;
+     position: fixed;
+     top: 50px;
+     left: auto;
+     right: 70px;
+     width: 650px;
+     .reso{
+        & > div{
+          opacity: 1;
+          -webkit-transition: opacity 0.5s 0.5s ease;
+          transition: opacity 0.5s 0.5s ease;
+        }
+      }
+    }
+    h3{
+      color: transparent;
+      -webkit-transform: rotate(0deg);
+      transform: rotate(0deg);
+      transition: transform 0.5s ease;
+    }
+  }
+  &.close{
+    width: 90px;
+    height: 90px;
+     .txt{
+      color: transparent;
+      text-align: right;
+      position: fixed;
+      right: -200%;
+      -webkit-transition: color 0.5s ease, right 0s;
+      transition: color 0.5s ease, right 0s;
+    }
+    h3{
+      -webkit-transform: rotate(45deg);
+      transform: rotate(45deg);
+      transition: transform 0.5s ease;
+    }
+  }
+}