Yuzu Theme

from meowapps.com
2022-05-03 09:37:05 +02:00
commit 523ccac38e
75 changed files with 15482 additions and 0 deletions
--- a/assets/less/_header.less
+++ b/assets/less/_header.less
@@ -0,0 +1,139 @@
+// main: style.less
+
+.article-header {
+  text-align: center;
+  margin: 120px auto;
+  color: @body_color;
+  color: var(--body_color);
+
+  @media screen and (max-width: @phone) {
+    margin: 70px auto;
+  }
+
+  .article-categories {
+    margin-bottom: 10px;
+
+    .article-category {
+      display: inline-block;
+      text-transform: uppercase;
+      font-size: 14px;
+      opacity: .3;
+      color: @body_color;
+      color: var(--body_color);
+      transition: .1s;
+
+      &:hover {
+        opacity: .6;
+        transition: .1s;
+      }
+    }
+  }
+
+  .article-title {
+    font-size: 48px;
+    line-height: 160%;
+    font-weight: 400;
+    margin-top: 0;
+    margin-bottom: 20px;
+
+    @media screen and (max-width: @phone) {
+      font-size: 42px;
+      line-height: 140%;
+    }
+  }
+
+  .article-meta {
+    opacity: 1;
+    color: @body_color;
+    color: var(--body_color);
+
+    .author-picture {
+      display: inline-block;
+      width: 40px;
+      height: 40px;
+      border-radius: 50%;
+      background-size: cover;
+      background-position: center;
+      vertical-align: middle;
+      margin-right: 5px;
+    }
+  }
+}
+
+.single-article {
+  .article-featured-image {
+    text-align: center;
+    margin-bottom: 60px;
+
+    img {
+      max-width: 100%;
+    }
+  }
+}
+
+.page-header {
+  text-align: center;
+  margin: 120px auto;
+  color: @body_color;
+  color: var(--body_color);
+
+  @media screen and (max-width: @phone) {
+    margin: 70px auto;
+  }
+
+  .label {
+    text-transform: uppercase;
+    font-size: 14px;
+    opacity: .3;
+    color: @body_color;
+    color: var(--body_color);
+  }
+
+  .meow-breadcrumb .breadcrumb-items-container {
+
+    .breadcrumb-item {
+      text-transform: uppercase;
+      font-size: 14px;
+      opacity: .3;
+      color: @body_color;
+      color: var(--body_color);
+      transition: .1s;
+
+      &:hover {
+        opacity: .6;
+        transition: .1s;
+      }
+
+      &.active {
+        opacity: 1;
+      }
+    }
+
+    .divider {
+      opacity: .3;
+      margin: 0 5px;
+    }
+  }
+
+  .page-title {
+    font-size: 48px;
+    line-height: 160%;
+    font-weight: 400;
+    margin-top: 0;
+    margin-bottom: 20px;
+
+    @media screen and (max-width: @phone) {
+      font-size: 42px;
+      line-height: 140%;
+    }
+  }
+}
+
+.page-featured-image {
+  text-align: center;
+  margin-bottom: 60px;
+
+  img {
+    max-width: 100%;
+  }
+}