fix(layout): backlinks grid triage (#1447)

Emile Bangma

2024-09-30 1416f62a471f6b9910a86ae57e48bafc24af3278

fix(layout): backlinks grid triage (#1447)

* fix: mobile backlinks orientation

* temp: hide broken list gradient

* fix: backlinks overflow

 quartz/components/styles/backlinks.scss

@@ -1,11 +1,8 @@
@use "../../styles/variables.scss" as *;

.backlinks {
  @media all and not ($mobile) {
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    &:after {
  flex-direction: column;
  /*&:after {
      pointer-events: none;
      content: "";
      width: 100%;
@@ -16,29 +13,32 @@
      opacity: 1;
      transition: opacity 0.3s ease;
      background: linear-gradient(transparent 0px, var(--light));
    }
    }*/

    & > h3 {
      font-size: 1rem;
      margin: 0;
    }
  & > h3 {
    font-size: 1rem;
    margin: 0;
  }

    & > ul {
      list-style: none;
      padding: 0;
      margin: 0.5rem 0;
  & > ul {
    list-style: none;
    padding: 0;
    margin: 0.5rem 0;

      & > li {
        & > a {
          background-color: transparent;
        }
    & > li {
      & > a {
        background-color: transparent;
      }
    }
  }

    & > .overflow {
      &:after {
        display: none;
      }
  & > .overflow {
    &:after {
      display: none;
    }
    height: auto;
    @media all and ($desktop) {
      height: 250px;
    }
  }
}

 quartz/components/styles/explorer.scss

@@ -9,7 +9,7 @@
      display: flex;
    }
  }
  &:after {
  /*&:after {
    pointer-events: none;
    content: "";
    width: 100%;
@@ -20,7 +20,7 @@
    opacity: 1;
    transition: opacity 0.3s ease;
    background: linear-gradient(transparent 0px, var(--light));
  }
  }*/
}

button#explorer {

 quartz/styles/base.scss

@@ -554,7 +554,7 @@
  & > li:last-of-type {
    margin-bottom: 30px;
  }
  &:after {
  /*&:after {
    pointer-events: none;
    content: "";
    width: 100%;
@@ -565,7 +565,7 @@
    opacity: 1;
    transition: opacity 0.3s ease;
    background: linear-gradient(transparent 0px, var(--light));
  }
  }*/
}

.transclude {