modif order

2019-10-09 21:07:23 +02:00
parent 130ebff543
commit c5b29bfdbe
276 changed files with 4413 additions and 1918 deletions
@@ -1,63 +1,95 @@
-.blog{
-  #start{
-    .cat-list {
-        width: 100%;
-        z-index: 999;
-        left: -100%;
-        &::after {
-          display: block;
+.cat-list{
+  width: calc(100% - 10px);
+  height: 50px;
+  margin-bottom: 20px;
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  position: relative;
+  &:after{
+    position: absolute;
+    bottom: 0;
+    display: block;
+    content: "";
+    width: 0%;
+  }
+  & > ul{
+    margin: auto 0 auto 10px;
+    label{
+      margin-right: 10px;
+      opacity: 0;
+      margin-left: -10px;
+      a{
+        &::after{
+          position: absolute;
          content: " ";
-          width: 0%;
-          height: 1px;
-          background: black;
+          width: 5px;
        }
-        ul {
-          opacity: 0;
-          display: -webkit-inline-box;
-          display: -ms-inline-flexbox;
-          display: inline-flex;
-          margin: 10px 0;
-          .btn-group{
-            display: -webkit-box;
-            display: -ms-flexbox;
-            display: flex;
-            .btn a{
-              margin-right: 10px;
-              &::after{
-                position: absolute;
-                content: " ";
-                width: 5px;
-              }
-              &:hover, &.active{
-                &::after{
-                  content: "\002022";
-                }
-              }
-              input{
-                display: none;
-              }
-            }
+        &:hover, &.active{
+          &::after{
+            content: "\002022";
          }
        }
      }
-    #items{
-      .full-works{
-        .card{
-          width: calc( (100vw / 3 - calc( 41px / 3 ) ) );
-        }
-      }
-    }
-  }
-  .down{
-    .cat-list{
-      &::after{
-        -webkit-animation: showborder 2.5s 1.6s ease forwards;
-                animation: showborder 2.5s 1.6s ease forwards;
-      }
-      ul{
-        -webkit-animation: ultranslate 1s 2.5s ease forwards;
-                animation: ultranslate 1s 2.5s ease forwards;
-      }
+    }
+  }
+}
+
+#page-wrapper{
+  padding-left: 10px;
+  z-index: 1000;
+  height: 100%;
+}
+
+.scroll{
+  cursor: pointer;
+}
+
+.full-works{
+  .card{
+    opacity: 0;
+    margin-top: 30px;
+  }
+}
+
+.down{
+  #start{
+    margin-top: 90px;
+    height: 100%;
+  }
+  .cat-list{
+    &:after{
+      width: 100%;
+      height: 1px;
+      background: black;
+    }
+    & > ul{
+      label{
+        opacity: 1;
+        margin-left: 0;
+      }
+    }
+  }
+  .full-works{
+    .card{
+      opacity: 1;
+      transition: 1.5s opacity 1s ease, 1.5s margin-top 1s ease;
+      margin-top: 0;
+    }
+  }
+}
+
+.down{
+  .cat-list{
+    &:after{
+      -webkit-transition: 2s 1.5s width ease;
+      transition: 2s 1.5s width ease;
+    }
+    & > ul{
+      label{
+        -webkit-transition: 2s 1.5s all ease;
+        transition: 2s 1.5s all ease;
+      }
    }
  }
 }