From 7d7e3349763b0c1ade94b8a6d13986e171861bc1 Mon Sep 17 00:00:00 2001
From: Emile Bangma <github@emilebangma.com>
Date: Mon, 23 Sep 2024 20:40:12 +0000
Subject: [PATCH] feat: responsive design grid (#1354)
---
quartz/components/styles/backlinks.scss | 55 +++++++++++++++++++++++++++++++++++++++++++------------
1 files changed, 43 insertions(+), 12 deletions(-)
diff --git a/quartz/components/styles/backlinks.scss b/quartz/components/styles/backlinks.scss
index 04302f2..3b7ab5b 100644
--- a/quartz/components/styles/backlinks.scss
+++ b/quartz/components/styles/backlinks.scss
@@ -1,19 +1,50 @@
+@use "../../styles/variables.scss" as *;
+
.backlinks {
- position: relative;
+ @media all and not ($desktop) {
+ overflow-y: auto;
+ display: initial;
+ &: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));
+ }
- & > h3 {
- font-size: 1rem;
- margin: 0;
- }
+ &:has(> .overflow) {
+ position: unset;
+ }
- & > ul {
- list-style: none;
- padding: 0;
- margin: 0.5rem 0;
+ & > h3 {
+ font-size: 1rem;
+ margin: 0;
+ }
- & > li {
- & > a {
- background-color: transparent;
+ & > ul {
+ list-style: none;
+ padding: 0;
+ margin: 0.5rem 0;
+
+ & > li {
+ & > a {
+ background-color: transparent;
+ }
+ }
+ }
+
+ & > .overflow {
+ max-height: unset;
+ & > li:last-of-type {
+ margin-bottom: 0;
+ }
+ &:after {
+ display: none;
}
}
}
--
Gitblit v1.10.0