hexo-theme-shokax 0.0.1-alpha1

package/source/css/_common/scaffolding/pagination.styl

@@ -0,0 +1,81 @@
+$page-number-basic {
+  display: inline-block;
+  margin: 0 .5rem;
+  padding: 0 .75rem;
+  position: relative;
+  border-radius: .3125rem;
+
+  +mobile() {
+    margin: 0 .3125rem;
+  }
+}
+
+.pagination {
+  width: 100%;
+  padding: 1.25rem 3.125rem;
+  text-align: center;
+  display: inline-block;
+  color: var(--grey-5);
+
+  +mobile() {
+    padding: 1.25rem .625rem;
+  }
+
+  .inner {
+    width: auto;
+    border-radius: .9375rem;
+  }
+
+  .prev,
+  .next,
+  .page-number {
+    @extend $page-number-basic;
+
+    the-transition();
+
+    &:hover {
+      @extend $color-btn;
+    }
+  }
+
+  .space {
+    @extend $page-number-basic;
+    margin: 0;
+    padding: 0;
+  }
+
+  .prev {
+    margin-left: 0;
+  }
+
+  .next {
+    margin-right: 0;
+  }
+
+  .page-number.current {
+    @extend $color-btn;
+
+    &:hover {
+      box-shadow: 0 0 .3125rem var(--primary-color);
+    }
+  }
+}
+
+/*+mobile() {
+  .pagination {
+    border-top: none;
+  }
+
+  .pagination {
+    .prev, .next, .page-number {
+      border-bottom: .0625rem solid var(--grey-3);
+      border-top: 0;
+      margin-bottom: .625rem;
+      padding: 0 .625rem;
+
+      &:hover {
+        border-bottom-color: var(--color-red);
+      }
+    }
+  }
+}*/

package/source/css/_common/scaffolding/ribbon.styl

@@ -0,0 +1,38 @@
+.ribbon {
+  display: inline-block;
+  align-self: flex-start;
+  position: relative;
+  padding: 0 1rem 0 2rem;
+  border-radius: 0 .3rem .3rem 0;
+  background-image: linear-gradient(to right,var(--color-orange) 0,var(--color-pink) 100%);
+  color: var(--grey-0);
+
+  &::after {
+    content: "";
+    position: absolute;
+    top: 100%;
+    left: 0;
+    width: 0;
+    height: 0;
+    background-color: transparent;
+    border-style: solid;
+    border-width: 0 1rem 1rem 0;
+    border-color: transparent;
+    border-right-color: var(--color-orange);
+    filter: brightness(.9);
+  }
+
+  a {
+    display: block;
+    margin: 0;
+    text-align: center;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+
+    &:hover {
+      color: currentColor;
+      @extend .shake;
+    }
+  }
+}

package/source/css/_common/scaffolding/scaffolding.styl

@@ -0,0 +1,14 @@
+//
+// Scaffolding
+// ==================================================
+@import 'normalize';
+@import 'scrollbar';
+@import 'animate';
+@import 'base';
+@import 'tables';
+@import 'buttons';
+@import 'toggles';
+@import 'pagination';
+@import 'tip';
+@import 'ribbon';
+@import 'divider';

package/source/css/_common/scaffolding/scrollbar.styl

@@ -0,0 +1,37 @@
+::-webkit-scrollbar {
+  width: .3125rem;
+  height: .3125rem;
+  background: transparent;
+}
+
+::-webkit-scrollbar-track {
+  border-radius: .3125rem;
+  background: transparent;
+}
+
+::-webkit-scrollbar-track-piece {
+  background: transparent;
+}
+
+::-webkit-scrollbar-button {
+  background: transparent;
+  height: 0;
+}
+
+::-webkit-scrollbar-thumb {
+  border-radius: 1.25rem;
+  background-clip: padding-box;
+  background-color: var(--grey-3);
+  background-image: linear-gradient(45deg,var(--grey-1-a5) 25%,transparent 0,transparent 50%,var(--grey-1-a5) 0,var(--grey-1-a5) 75%,transparent 0,transparent);
+}
+
+$big-scrollbar {
+  &::-webkit-scrollbar {
+    width: .5rem;
+    height: .5rem;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background-color: var(--color-pink-light);
+  }
+}

package/source/css/_common/scaffolding/tables.styl

@@ -0,0 +1,50 @@
+.table-container {
+  overflow: auto;
+
+  table {
+    border-collapse: collapse;
+    border-spacing: 0;
+    font-size: $font-size-small;
+    margin: 0 0 1.25rem 0;
+    width: 100%;
+    overflow: auto;
+
+    tbody tr {
+      &:nth-of-type(even) {
+        background: var(--grey-0);
+      }
+
+      &:hover {
+        background: var(--grey-2);
+      }
+    }
+
+    caption, th, td {
+      font-weight: normal;
+      padding: .5rem;
+      text-align: left;
+      vertical-align: middle;
+    }
+
+    th, td {
+      border: .0625rem solid var(--grey-3);
+      border-bottom: .1875rem solid var(--grey-3);
+    }
+
+    th {
+      font-weight: 700;
+      padding-bottom: .625rem;
+      text-align: center;
+    }
+
+    td {
+      border-bottom-width: .0625rem;
+
+      p:last-child, pre:last-child, .highlight:last-child {
+        margin: 0;
+      }
+
+    }
+  }
+
+}

package/source/css/_common/scaffolding/tip.styl

@@ -0,0 +1,19 @@
+.tip {
+  position: fixed;
+  background: var(--grey-9-a5);
+  color: #fff;
+  top: 50%;
+  left: 50%;
+  z-index: $zindex-5;
+  padding: .625rem 1rem;
+  border-radius: .625rem;
+  transform: translate(-50%,-50%);
+  text-align: center;
+  font-size: $font-size-small;
+  backdrop-filter: blur(.625rem);
+  @extend .fade-in;
+
+  &.hide {
+    @extend .fade-out;
+  }
+}

package/source/css/_common/scaffolding/toggles.styl

@@ -0,0 +1,59 @@
+.toggle {
+  line-height: 0;
+  cursor: pointer;
+
+  .line {
+    background: var(--header-text-color);
+    display: inline-block;
+    height: .125rem;
+    left: 0;
+    position: relative;
+    border-radius: .0625rem;
+    top: 0;
+    transition: all .4s;
+    vertical-align: top;
+    width: 100%;
+    box-shadow: 0 0 .5rem alpha(#000, .5);
+
+    &:not(:first-child) {
+      margin-top: .1875rem;
+    }
+  }
+
+  &.toggle-arrow {
+    .toggle-line-first {
+      left: 50%;
+      top: .125rem;
+      transform: rotate(45deg);
+      width: 50%;
+    }
+
+    .toggle-line-middle {
+      left: .125rem;
+      width: 90%;
+    }
+
+    .toggle-line-last {
+      left: 50%;
+      top: -.125rem;
+      transform: rotate(-45deg);
+      width: 50%;
+    }
+  }
+
+  &.close {
+    .line:nth-child(1) {
+      transform: rotate(-45deg);
+      top: .3125rem;
+    }
+
+    .line:nth-child(2) {
+      opacity: 0;
+    }
+
+    .line:nth-child(3) {
+      transform: rotate(45deg);
+      top: -.3125rem;
+    }
+  }
+}