From 4e4930ef9c2e2ddb9bcb1436660d3a3002c19844 Mon Sep 17 00:00:00 2001
From: Anton Bulakh <him@necauq.ua>
Date: Fri, 24 Jan 2025 03:19:46 +0000
Subject: [PATCH] chore(styles): omit sass deprecation warnings (#1737)

---
 quartz/components/styles/explorer.scss |   51 +++++++++++++++++++++++++++++++++++++++++++--------
 1 files changed, 43 insertions(+), 8 deletions(-)

diff --git a/quartz/components/styles/explorer.scss b/quartz/components/styles/explorer.scss
index 304fd45..397fd02 100644
--- a/quartz/components/styles/explorer.scss
+++ b/quartz/components/styles/explorer.scss
@@ -1,5 +1,29 @@
+@use "../../styles/variables.scss" as *;
+
+.explorer {
+  display: flex;
+  flex-direction: column;
+  overflow-y: hidden;
+  &.desktop-only {
+    @media all and not ($mobile) {
+      display: flex;
+    }
+  }
+  /*&:after {
+    pointer-events: none;
+    content: "";
+    width: 100%;
+    height: 50px;
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    opacity: 1;
+    transition: opacity 0.3s ease;
+    background: linear-gradient(transparent 0px, var(--light));
+  }*/
+}
+
 button#explorer {
-  all: unset;
   background-color: transparent;
   border: none;
   text-align: left;
@@ -9,7 +33,7 @@
   display: flex;
   align-items: center;
 
-  & h1 {
+  & h2 {
     font-size: 1rem;
     display: inline-block;
     margin: 0;
@@ -43,12 +67,20 @@
 #explorer-content {
   list-style: none;
   overflow: hidden;
-  max-height: none;
-  transition: max-height 0.35s ease;
+  overflow-y: auto;
+  max-height: 100%;
+  transition:
+    max-height 0.35s ease,
+    visibility 0s linear 0s;
   margin-top: 0.5rem;
+  visibility: visible;
 
-  &.collapsed > .overflow::after {
-    opacity: 0;
+  &.collapsed {
+    max-height: 0;
+    transition:
+      max-height 0.35s ease,
+      visibility 0s linear 0.35s;
+    visibility: hidden;
   }
 
   & ul {
@@ -65,6 +97,9 @@
       pointer-events: all;
     }
   }
+  > #explorer-ul {
+    max-height: none;
+  }
 }
 
 svg {
@@ -85,7 +120,7 @@
     color: var(--secondary);
     font-family: var(--headerFont);
     font-size: 0.95rem;
-    font-weight: 600;
+    font-weight: $semiBoldWeight;
     line-height: 1.5rem;
     display: inline-block;
   }
@@ -110,7 +145,7 @@
       font-size: 0.95rem;
       display: inline-block;
       color: var(--secondary);
-      font-weight: 600;
+      font-weight: $semiBoldWeight;
       margin: 0;
       line-height: 1.5rem;
       pointer-events: none;

--
Gitblit v1.10.0