styles: add ruins visual polish

2026-03-29 02:10:03 +00:00
parent 30c8ec7438
commit 7ea89b4d80
1 changed files with 83 additions and 0 deletions
@@ -1,3 +1,86 @@
@use "./base.scss";

 // put your custom CSS here!
+.page-title {
+  font-size: 2.6rem;
+  margin: 0;
+
+  font-family: var(--titleFont);
+
+  position: relative;
+
+  a {
+    font-weight: 500;
+    letter-spacing: 0.5px;
+
+    &::after {
+      content: "";
+      position: absolute;
+      left: -10rem;
+      top: 2rem;
+      width: 28rem;
+      height: 28px;
+      background-image: linear-gradient(to right, transparent 0%, #7ba9ef 100%);
+      z-index: -1;
+      transform: rotate(-30deg);
+      border-radius: 5px;
+      filter: blur(40px);
+    }
+  }
+}
+
+.article-title {
+  font-size: 2.2rem;
+  margin: 2rem 0 1.2rem 0;
+}
+
+.content-meta {
+  font-family: var(--metaFont);
+  font-size: 1.3rem;
+}
+
+.center article {
+  font-size: 1.05rem;
+  text-align: justify;
+
+  p {
+    hyphens: none;
+  }
+}
+
+.floating-image {
+  @media all and (max-width: 800px) {
+    display: none;
+  }
+
+  position: relative;
+  display: inline-block;
+
+  img:first-child {
+    position: relative;
+    z-index: 2;
+    height: 100%;
+    width: 100%;
+  }
+
+  img:last-child {
+    position: absolute;
+    top: 0;
+    left: 0;
+    z-index: 1;
+    height: 100%;
+    width: 100%;
+    filter: blur(20px) brightness(0.6);
+  }
+}
+
+.footer {
+  font-family: var(--metaFont);
+  font-size: 1.3rem;
+  color: var(--gray);
+  margin-bottom: 2rem;
+}
+
+.explorer-toggle {
+  margin-bottom: 0.8rem;
+}