logseq-dev-theme icon indicating copy to clipboard operation
logseq-dev-theme copied to clipboard

apply dark theme to pdf viewer

Open ChangqingW opened this issue 2 years ago • 0 comments

Hi peng, I tried matching the dark theme in the PDF viewer. I never coded CSS before though so not sure how match the margin color without hard-coding hex values. Here's how it looked on my end: Screen Shot 2023-09-28 at 4 09 41 pm My custom.css:

@import url("https://cdn.jsdelivr.net/gh/pengx17/logseq-dev-theme@main/custom.css");
.dark-theme .image-resize {
  filter: brightness(1) saturate(1);
}
blockquote {
  background-color: #2C3333;
  border-left: 5px solid;
  display: block;
  margin: 1rem 0;
  padding: 8px 20px;
  text-indent: 0;
  border-radius: 2px;
}

.extensions__pdf-settings-item.theme-picker>button.dark {
    background-color: #272c35;
}
.extensions__pdf-container {
  background-color: transparent;

  &[data-theme=dark] {
    background-color: #262E37;

    .textLayer {
      background-color: #272c35;
      opacity: 1;
      /* mix-blend-mode: multiply; */
    }

    .extensions__pdf-hls-text-region {
      mix-blend-mode: normal;
      opacity: .4;
    }

  }
}

ChangqingW avatar Sep 28 '23 05:09 ChangqingW