catppuccin / logseq Goto Github PK

View Code? Open in Web Editor NEW

122.0 4.0 3.0 1.41 MB

🦫 Soothing pastel theme for Logseq

License: MIT License

HTML 1.01% JavaScript 6.18% SCSS 92.81%

catppuccin logseq logseq-themes theme

logseq's Introduction

Catppuccin for Logseq

Previews

🌻 Latte

Selected Accent: Red

🪴 Frappé

Selected Accent: Pink

🌺 Macchiato

Selected Accent: Yellow

🌿 Mocha

Selected Accent: Green

Usage

Installation

There are couple of other methods you can use to set the theme up in Logseq. Later methods are more for development purpose.

Logseq Plugin Marketplace (Recommended)
1. Search for 'catppuccin' in Plugins > Marketplace > Themes and install the plugin.
2. Choose the the appropriate theme variant from Settings > Themes.

Editing custom theme: custom.css (recommended for mobile). Choose one of the following and restart Logseq

@import url('https://logseq.catppuccin.com/ctp-latte.css');
@import url('https://logseq.catppuccin.com/ctp-frappe.css');
@import url('https://logseq.catppuccin.com/ctp-macchiato.css');
@import url('https://logseq.catppuccin.com/ctp-mocha.css');
@import url('https://logseq.catppuccin.com/ctp-oled.css');

Editing custom configuration: config.edn (source) Set one of the following in your config and restart Logseq.

:custom-css-url "@import url('https://logseq.catppuccin.com/ctp-latte.css');"
:custom-css-url "@import url('https://logseq.catppuccin.com/ctp-frappe.css');"
:custom-css-url "@import url('https://logseq.catppuccin.com/ctp-macchiato.css');"
:custom-css-url "@import url('https://logseq.catppuccin.com/ctp-mocha.css');"

Add manually from GitHub Releases
1. Download .zip from latest release.
2. Extract it to desired location.
3. Enable Developer Mode under Settings > Advanced.
4. Use the new Load unpacked plugin option under Plugins, choosing extracted folder to install the theme.
Clone Repository and add manually
1. Clone repository (including submodules)
2. Run npm ci && npm run build
3. Enable Developer Mode under Settings > Advanced
4. Use the new Load unpacked plugin option under Plugins, choosing repo folder to install the theme.

Switching Accent Color

Theme settings can be accessed under Settings > Plugins > Catppuccin
Select an accent color of choice from the dropdown under CtpAccent setting.

Bonus: Oledppuccin

The niche dark side

You can choose this variant of dark theme under Settings > Themes.

💝 Thanks to

Current Maintainer(s)

griimick

Inspiration and Contribution

pengx17 for logseq-dev-theme

logseq's People

Contributors

Stargazers

Watchers

Forkers

latenighticecream tamouse mwidmann

logseq's Issues

Not enough contrast for foreground text on coloured headings

Cannot select an auto-completed slash command, template, etc... (regression)

I initially thought this was a LogSeq bug, but switching back to the default dark theme fixed it.

logseq/logseq#11211

Preserving Built CSS Files

The Logseq project supports importing online CSS files, is it possible to preserve the built CSS files for future imports?

https://github.com/logseq/logseq/blob/master/templates/config.edn#L72

Support setting latte for whiteboard in dark theme

Add a new setting to override whiteboard theme to latte
Organise all whiteboard style overrides and also simplify multiple color references like described here #25 (comment)

Related issue #25

Add styles for the new whiteboard feature

This was requested in the official Logseq discord. A few new CSS variables and overrides were used in the feature which stand out of the theme.

Single back tick quoted text background color is to very similar to the background color (Mocha)

Is it possible to change the single back tick background color its contrast with the background is low I am often just not seeing a back tick text block unless I go back and look again and again.
Possibly a border around the single back tick quotes would help.

Quite like the theme :)

The Yellow colour right sidebar tabs (for the tabbed sidebar plugin)

The right sidebar tabs have a piss yellow-ish colour that looks, well, quite frankly disgusting. This is likely the result of Logseq's recent update not being supported by the theme

It would be nice if you guys could fix :)

Color customization for TODO,DOING,LATER,WAITING,DONE,CANCELED and Priorities

Hello
Thanks for wonderful them, I really love it.

Is it possible to add coloring for TODO,DOING,LATER,WAITING,DONE,CANCELED and Priorities ?
like for example todo -> blue, done -> green , waiting -> yellow and customized priorities coloring

example used on dev theme

Coloring for priority
example used on dev theme

Wrong style for collapsed blocks

Logseq version 0.9.5

A collapsed block looks like this:

Selected text too hard to read

Hello!

I'm finding that selected text is too hard to read, I don't know if the text color here is the correct or not

I'm using LogSeq 0.10.6 with Catppuccin theme 0.6.1 (dark theme + Catpuccin Macchiato selected). I don't have any accent selected and I'm using full palette. I don't think I have modified any css or config file. Not intentionally.

I also noticed PR #21 which... seems related?

unthemed radix popup

reported over discord

Logseq v0.10.7
Catppuccin v0.6.0

Support Bullet Threading plugin color

Automatically set color for bullet threads if user has Bullet Threading plugin installed.

Change Whiteboard theme only

I'm struggling here to find all the areas specific to the whiteboard. What I would like to accomplish is Frappé all the journal pages, and Latte for the whiteboard. Basically so that I can have a "white" background in the whiteboard section.

Possible you can point me to the right areas? My current custom.css. I'm sure that I am missing a ton of areas though as my css knowledge is novice at best.

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500&display=swap');

.cp__sidebar-main-content .logseq-tools-multiple-calendars {
    display: flex;
    flex-wrap: wrap;
    padding: 0 15px;
}

.cp__sidebar-main-content .logseq-tools-multiple-calendars .logseq-tools-calendar {
    flex: 0 50%;
    box-sizing: border-box;
    padding: 0 15px;
}

.logseq-tools-calendar tr {
    background: none !important;
}

.logseq-tools-calendar th,
.logseq-tools-calendar td,
.logseq-tools-calendar tr {
    border: none;
}

.logseq-tools-calendar th,
.logseq-tools-calendar td {
    text-align: center;
}


/* Calendar - pages from other months */

.logseq-tools-calendar .outofmonth {
    opacity: .3;
}

:root {
  --color-base-00: rgb(var(--ctp-crust));
  --color-base-10: rgb(var(--ctp-mantle));
  --color-base-20: rgb(var(--ctp-base));
  --color-base-30: rgb(var(--ctp-surface0));
  --color-base-40: rgb(var(--ctp-surface1));
  --color-base-50: rgb(var(--ctp-surface2));
  --color-base-60: rgb(var(--ctp-overlay0));
  --color-base-70: rgb(var(--ctp-overlay1));
  --color-base-80: rgb(var(--ctp-overlay2));
  --color-base-90: rgb(var(--ctp-subtext0));
  --color-base-100: rgb(var(--ctp-text));
  /*whiteboard*/
  --wb-color-base-00: rgb(var(--wb-ctp-crust));
  --wb-color-base-10: rgb(var(--wb-ctp-mantle));
  --wb-color-base-20: rgb(var(--wb-ctp-base));
  --wb-color-base-30: rgb(var(--wb-ctp-surface0));
  --wb-color-base-40: rgb(var(--wb-ctp-surface1));
  --wb-color-base-50: rgb(var(--wb-ctp-surface2));
  --wb-color-base-60: rgb(var(--wb-ctp-overlay0));
  --wb-color-base-70: rgb(var(--wb-ctp-overlay1));
  --wb-color-base-80: rgb(var(--wb-ctp-overlay2));
  --wb-color-base-90: rgb(var(--wb-ctp-subtext0));
  --wb-color-base-100: rgb(var(--wb-ctp-text));
}

:root {
  --ctp-primary-background-color: rgb(var(--ctp-base));
  --ctp-secondary-background-color: rgb(var(--ctp-mantle));
  --ctp-tertiary-background-color: rgb(var(--ctp-crust));
  --ctp-quaternary-background-color: rgb(var(--ctp-surface0));
  --ctp-color-level-1: var(--color-base-10);
  --ctp-color-level-2: var(--color-base-20);
  --ctp-color-level-3: var(--color-base-30);
  --ctp-color-level-4: var(--color-base-40);
  --ctp-color-level-5: var(--color-base-50);
  --ctp-color-level-6: var(--color-base-60);
  --ctp-active-primary-color: rgb(var(--ctp-accent));
  --ctp-active-secondary-color: rgb(var(--ctp-accent), 0.9);
  --ctp-table-tr-even-background-color: var(--ctp-secondary-background-color);
  --ctp-block-properties-background-color: var(--ctp-secondary-background-color);
  --ctp-page-properties-background-color: var(--ctp-secondary-background-color);
  --ctp-block-ref-link-text-color: rgb(var(--ctp-subtext0));
  --ctp-search-background-color: var(--ctp-primary-background-color);
  --ctp-border-color: rgb(var(--ctp-surface0));
  --ctp-secondary-border-color: rgb(var(--ctp-surface0));
  --ctp-tertiary-border-color: rgba(var(--ctp-surface0), 0.10);
  --ctp-guideline-color: rgb(var(--ctp-surface1));
  --ctp-menu-hover-color: var(--ctp-color-level-3);
  --ctp-primary-text-color: rgb(var(--ctp-text));
  --ctp-secondary-text-color: rgb(var(--ctp-subtext0));
  --ctp-title-text-color: rgb(var(--ctp-subtext1));
  --ctp-link-text-color: rgb(var(--ctp-accent, var(--ctp-teal)));
  --ctp-link-text-hover-color: rgb(var(--ctp-accent, var(--ctp-mauve)));
  --ctp-link-ref-text-color: rgb(var(--ctp-accent, var(--ctp-blue)));
  --ctp-link-ref-text-hover-color: rgb(var(--ctp-accent, var(--ctp-blue)));
  --ctp-tag-text-color: rgb(var(--ctp-accent, var(--ctp-maroon)));
  --ctp-tag-text-hover-color: rgb(var(--ctp-accent, var(--ctp-maroon)));
  --ctp-slide-background-color: var(--ctp-primary-background-color);
  --ctp-block-bullet-border-color: rgba(var(--ctp-accent, var(--ctp-sky)), 0.4);
  --ctp-block-bullet-color: rgb(var(--ctp-accent, var(--ctp-sky)));
  --ctp-block-highlight-color: var(--color-base-30);
  --ctp-selection-background-color: rgba(var(--ctp-yellow, 0.9));
  --ctp-selection-text-color: rgb(var(--color-base-00));
  --ctp-page-checkbox-color: rgb(var(--ctp-accent, var(--ctp-blue)));
  --ctp-page-checkbox-border-color: var(--ctp-primary-background-color);
  --ctp-page-blockquote-color: var(--ctp-primary-text-color);
  --ctp-page-blockquote-bg-color: var(--ctp-secondary-background-color);
  --ctp-page-blockquote-border-color: var(--ctp-border-color);
  --ctp-page-inline-code-color: rgb(var(--ctp-green));
  --ctp-page-inline-code-bg-color: var(--color-base-10);
  --ctp-scrollbar-foreground-color: rgba(var(--ctp-text), 0.2);
  --ctp-scrollbar-background-color: rgba(var(--ctp-text), 0.05);
  --ctp-scrollbar-thumb-hover-color: rgba(var(--ctp-text), 0.2);
  --ctp-head-text-color: var(--ctp-link-text-color);
  --ctp-cloze-text-color: rgb(var(--ctp-accent));
  --ctp-icon-color: var(--ctp-link-text-color);
  --ctp-search-icon-color: var(--ctp-link-text-color);
  --ctp-a-chosen-bg: var(--ctp-quaternary-background-color);
  --ctp-right-sidebar-code-bg-color: var(--color-base-30);
  --ctp-pie-bg-color: var(--ctp-primary-background-color);
  --ctp-pie-fg-color: var(--ctp-secondary-background-color);
  --ctp-highlight-color-gray: rgb(var(--ctp-overlay2));
  --ctp-highlight-color-red: rgb(var(--ctp-red));
  --ctp-highlight-color-yellow: rgb(var(--ctp-yellow));
  --ctp-highlight-color-green: rgb(var(--ctp-green));
  --ctp-highlight-color-blue: rgb(var(--ctp-blue));
  --ctp-highlight-color-purple: rgb(var(--ctp-mauve));
  --ctp-highlight-color-pink: rgb(var(--ctp-pink));
  --ctp-error-text-color: var(--color-red-100);
  --ctp-error-background-color: var(--color-red-900);
  --ctp-warning-text-color: var(--color-yellow-100);
  --ctp-warning-background-color: var(--color-yellow-900);
  --ctp-success-text-color: var(--color-green-100);
  --ctp-success-background-color: var(--color-green-900);
  --ctp-focus-ring-color: rgb(var(--ctp-overlay2));
  --ctp-header-button-background: rgb(var(--ctp-text));
  --ctp-error-color: var(--ctp-red);
  --ctp-warning-color: var(--ctp-peach);
  --ctp-success-color: var(--ctp-green);
  --ctp-info-color: var(--ctp-yellow);
  /* Whiteboard */
  /* Whiteboard object colors */
  --ctp-wb-background-color-gray: color-mix(in srgb, rgb(var(--wb-ctp-gray)), rgb(var(--wb-ctp-base)) 60%);
  --ctp-wb-background-color-red: color-mix(in srgb, rgb(var(--wb-ctp-red)), rgb(var(--wb-ctp-base)) 60%);
  --ctp-wb-background-color-yellow: color-mix(in srgb, rgb(var(--wb-ctp-yellow)), rgb(var(--wb-ctp-base)) 60%);
  --ctp-wb-background-color-green: color-mix(in srgb, rgb(var(--wb-ctp-green)), rgb(var(--wb-ctp-base)) 60%);
  --ctp-wb-background-color-blue: color-mix(in srgb, rgb(var(--wb-ctp-blue)), rgb(var(--wb-ctp-base)) 60%);
  --ctp-wb-background-color-purple: color-mix(in srgb, rgb(var(--wb-ctp-mauve)), rgb(var(--wb-ctp-base)) 60%);
  --ctp-wb-background-color-pink: color-mix(in srgb, rgb(var(--wb-ctp-pink)), rgb(var(--wb-ctp-base)) 60%);
  --ctp-wb-stroke-color-gray: rgb(var(--wb-ctp-overlay2));
  --ctp-wb-stroke-color-red: rgb(var(--wb-ctp-red));
  --ctp-wb-stroke-color-yellow: rgb(var(--wb-ctp-yellow));
  --ctp-wb-stroke-color-green: rgb(var(--wb-ctp-green));
  --ctp-wb-stroke-color-blue: rgb(var(--wb-ctp-blue));
  --ctp-wb-stroke-color-purple: rgb(var(--wb-ctp-mauve));
  --ctp-wb-stroke-color-pink: rgb(var(--wb-ctp-pink));
  --ctp-wb-text-color-gray: rgb(var(--wb-ctp-overlay2));
  --ctp-wb-text-color-red: rgb(var(--wb-ctp-red));
  --ctp-wb-text-color-yellow: rgb(var(--wb-ctp-yellow));
  --ctp-wb-text-color-green: rgb(var(--wb-ctp-green));
  --ctp-wb-text-color-blue: rgb(var(--wb-ctp-blue));
  --ctp-wb-text-color-purple: rgb(var(--wb-ctp-mauve));
  --ctp-wb-text-color-pink: rgb(var(--wb-ctp-pink));
  --ctp-wb-shape-label-color-gray: rgb(var(--wb-ctp-gray));
  --ctp-wb-shape-label-color-red: rgb(var(--wb-ctp-red));
  --ctp-wb-shape-label-color-yellow: rgb(var(--wb-ctp-yellow));
  --ctp-wb-shape-label-color-green: rgb(var(--wb-ctp-green));
  --ctp-wb-shape-label-color-blue: var(--wb-ctp-blue);
  --ctp-wb-shape-label-color-purple: rgb(var(--wb-ctp-purple));
  --ctp-wb-shape-label-color-pink: rgb(var(--wb-ctp-pink));
  --ctp-switch-background: var(--wb-color-base-50);
  --ctp-switch-handle-color: var(--wb-ctp-accent, var(--wb-ctp-blue));
  --ctp-button-background: var(--wb-ctp-accent, var(--wb-ctp-blue));
  --ctp-button-text: var(--wb-color-base-10);
  --ctp-tooltip-background: var(--wb-ctp-tertiary-background-color);
  --ctp-tooltip-text: rgb(var(--wb-ctp-text));
  --ctp-search-input-placeholder: rgb(var(--wb-ctp-text));
  --ctp-header-icon: rgb(var(--wb-ctp-accent));
  --ctp-header-icon-background: var(--wb-ctp-menu-hover-color);
  --ctp-text-highlight: rgb(var(--wb-ctp-yellow));
  --ctp-bullet-thread-color: rgb(var(--wb-ctp-accent, var(--wb-ctp-teal)));
  --ctp-dropdown-border-color: var(--wb-color-base-50);
  --ctp-text-bold: var(var(--wb-ctp-primary-text-color));
  --ctp-text-heading: var(--wb-ctp-accent, var(--wb-ctp-lavender));
  --ctp-text-italics: var(--wb-ctp-accent, var(--wb-ctp-green));
  --ctp-text-underline: var(--wb-ctp-primary-text-color);
  --ctp-text-strikethrough: var(--wb-ctp-accent, var(--wb-ctp-maroon));
  --ctp-blockquote-line: var(--wb-ctp-accent);
  --ctp-active-setting: var(--wb-ctp-accent, var(--wb-ctp-blue));
  --ctp-wb-button-selected-foreground: var(--wb-ctp-accent, var(--wb-ctp-mauve));
  --ctp-wb-button-selected-background: var(--wb-ctp-surface0);
  --ctp-wb-button-foreground: var(--wb-ctp-text);
  --ctp-wb-button-menu-foreground: var(--wb-ctp-accent, var(--wb-ctp-teal));
  --ctp-wb-button-type-tag-background-active: var(--wb-ctp-accent, var(--wb-ctp-mauve));
  --ctp-wb-button-type-tag-background-inactive: var(--wb-ctp-surface0);
  --ctp-wb-button-type-tag-foreground: var(--wb-ctp-text);
  --ctp-wb-quick-links-button: var(--wb-ctp-accent, var(--wb-ctp-blue));
  --ctp-wb-quick-links-button-hover: var(--wb-ctp-sky);
  --ctp-wb-layout-button-foreground: var(--wb-ctp-accent, var(--wb-ctp-teal));
  --ctp-tl-select-input-select-item: var(--wb-ctp-surface2);
  --ctp-tl-selectFill: var(--wb-ctp-accent, var(--wb-ctp-blue));
  --ctp-tl-selectStroke: var(--wb-ctp-accent, var(--wb-ctp-blue));
  --ctp-priority-bg-color: var(--wb-ctp-crust);
  --ctp-priority-todo: var(--wb-ctp-teal);
  --ctp-priority-doing: var(--wb-ctp-blue);
  --ctp-priority-done: var(--wb-ctp-green);
  --ctp-priority-now: var(--wb-ctp-teal);
  --ctp-priority-later: var(--wb-ctp-yellow);
  --ctp-priority-waiting: var(--wb-ctp-maroon);
  --ctp-priority-a: var(--wb-ctp-red);
  --ctp-priority-b: var(--wb-ctp-yellow);
  --ctp-priority-c: var(--wb-ctp-green);
  --ctp-marker-border-radius: 4px;
  --ctp-checkbox-color: var(--wb-ctp-accent, var(--wb-ctp-teal));
  --ctp-marker-size: 16px;
}

:root {
  --ls-error-color: var(--ctp-error-color);
  --ls-warning-color: var(--ctp-warning-color);
  --ls-success-color: var(--ctp-success-color);
  --ls-text-on-accent: rgb(var(--ctp-base));
}
:root .logseq-tldraw {
  --tl-selectFill: rgba(var(--ctp-tl-selectFill), 0.05);
  --tl-selectStroke: rgb(var(--ctp-tl-selectStroke));
}
:root .tl-text-label-inner-wrapper {
  --ls-wb-text-color-gray: var(--ctp-wb-shape-label-color-gray);
  --ls-wb-text-color-red: var(--ctp-wb-shape-label-color-red);
  --ls-wb-text-color-yellow: var(--ctp-wb-shape-label-color-yellow);
  --ls-wb-text-color-green: var(--ctp-wb-shape-label-color-green);
  --ls-wb-text-color-blue: var(--ctp-wb-shape-label-color-blue);
  --ls-wb-text-color-purple: var(--ctp-wb-shape-label-color-purple);
  --ls-wb-text-color-pink: var(--ctp-wb-shape-label-color-pink);
}

@media (prefers-color-scheme: dark) {
  html {
    background-color: rgb(var(--ctp-primary-background-color));
  }
  html[data-theme=light] {
    background-color: transparent;
  }
}
.light-theme,
.dark-theme,
html[data-theme=light],
html[data-theme=dark] {
  --ls-primary-background-color: var(--ctp-primary-background-color);
  --ls-secondary-background-color: var(--ctp-secondary-background-color);
  --ls-tertiary-background-color: var(--ctp-tertiary-background-color);
  --ls-quaternary-background-color: var(--ctp-quaternary-background-color);
  --color-level-1: var(--ctp-color-level-1);
  --color-level-2: var(--ctp-color-level-2);
  --color-level-3: var(--ctp-color-level-3);
  --color-level-4: var(--ctp-color-level-4);
  --color-level-5: var(--ctp-color-level-5);
  --color-level-6: var(--ctp-color-level-6);
  --ls-active-primary-color: var(--ctp-active-primary-color);
  --ls-active-secondary-color: var(--ctp-active-secondary-color);
  --ls-table-tr-even-background-color: var(--ctp-table-tr-even-background-color);
  --ls-block-properties-background-color: var(--ctp-block-properties-background-color);
  --ls-page-properties-background-color: var(--ctp-page-properties-background-color);
  --ls-block-ref-link-text-color: var(--ctp-block-ref-link-text-color);
  --ls-search-background-color: var(--ctp-search-background-color);
  --ls-border-color: var(--ctp-border-color);
  --ls-secondary-border-color: var(--ctp-secondary-border-color);
  --ls-tertiary-border-color: var(--ctp-tertiary-border-color);
  --ls-guideline-color: var(--ctp-guideline-color);
  --ls-menu-hover-color: var(--ctp-menu-hover-color);
  --ls-primary-text-color: var(--ctp-primary-text-color);
  --ls-secondary-text-color: var(--ctp-secondary-text-color);
  --ls-title-text-color: var(--ctp-title-text-color);
  --ls-link-text-color: var(--ctp-link-text-color);
  --ls-link-text-hover-color: var(--ctp-link-text-hover-color);
  --ls-link-ref-text-color: var(--ctp-link-ref-text-color);
  --ls-link-ref-text-hover-color: var(--ctp-link-ref-text-hover-color);
  --ls-tag-text-color: var(--ctp-tag-text-color);
  --ls-tag-text-hover-color: var(--ctp-tag-text-hover-color);
  --ls-slide-background-color: var(--ctp-slide-background-color);
  --ls-block-bullet-border-color: var(--ctp-block-bullet-border-color);
  --ls-block-bullet-color: var(--ctp-block-bullet-color);
  --ls-block-highlight-color: var(--ctp-block-highlight-color);
  --ls-selection-background-color: var(--ctp-selection-background-color);
  --ls-selection-text-color: var(--ctp-selection-text-color);
  --ls-page-checkbox-color: var(--ctp-page-checkbox-color);
  --ls-page-checkbox-border-color: var(--ctp-page-checkbox-border-color);
  --ls-page-blockquote-color: var(--ctp-page-blockquote-color);
  --ls-page-blockquote-bg-color: var(--ctp-page-blockquote-bg-color);
  --ls-page-blockquote-border-color: var(--ctp-page-blockquote-border-color);
  --ls-page-inline-code-color: var(--ctp-page-inline-code-color);
  --ls-page-inline-code-bg-color: var(--ctp-page-inline-code-bg-color);
  --ls-scrollbar-foreground-color: var(--ctp-scrollbar-foreground-color);
  --ls-scrollbar-background-color: var(--ctp-scrollbar-background-color);
  --ls-scrollbar-thumb-hover-color: var(--ctp-scrollbar-thumb-hover-color);
  --ls-head-text-color: var(--ctp-head-text-color);
  --ls-cloze-text-color: var(--ctp-cloze-text-color);
  --ls-icon-color: var(--ctp-icon-color);
  --ls-search-icon-color: var(--ctp-search-icon-color);
  --ls-a-chosen-bg: var(--ctp-a-chosen-bg);
  --ls-right-sidebar-code-bg-color: var(--ctp-right-sidebar-code-bg-color);
  --ls-pie-bg-color: var(--ctp-pie-bg-color);
  --ls-pie-fg-color: var(--ctp-pie-fg-color);
  --ls-highlight-color-gray: var(--ctp-highlight-color-gray);
  --ls-highlight-color-red: var(--ctp-highlight-color-red);
  --ls-highlight-color-yellow: var(--ctp-highlight-color-yellow);
  --ls-highlight-color-green: var(--ctp-highlight-color-green);
  --ls-highlight-color-blue: var(--ctp-highlight-color-blue);
  --ls-highlight-color-purple: var(--ctp-highlight-color-purple);
  --ls-highlight-color-pink: var(--ctp-highlight-color-pink);
  --ls-error-text-color: var(--ctp-error-text-color);
  --ls-error-background-color: var(--ctp-error-background-color);
  --ls-warning-text-color: var(--ctp-warning-text-color);
  --ls-warning-background-color: var(--ctp-warning-background-color);
  --ls-success-text-color: var(--ctp-success-text-color);
  --ls-success-background-color: var(--ctp-success-background-color);
  --ls-focus-ring-color: var(--ctp-focus-ring-color);
  --ls-header-button-background: var(--ctp-header-button-background);
  /* Whiteboard */
  /* Whiteboard object colors */
  --ls-wb-background-color-gray: var(--ctp-wb-background-color-gray);
  --ls-wb-background-color-red: var(--ctp-wb-background-color-red);
  --ls-wb-background-color-yellow: var(--ctp-wb-background-color-yellow);
  --ls-wb-background-color-green: var(--ctp-wb-background-color-green);
  --ls-wb-background-color-blue: var(--ctp-wb-background-color-blue);
  --ls-wb-background-color-purple: var(--ctp-wb-background-color-purple);
  --ls-wb-background-color-pink: var(--ctp-wb-background-color-pink);
  --ls-wb-stroke-color-gray: var(--ctp-wb-stroke-color-gray);
  --ls-wb-stroke-color-red: var(--ctp-wb-stroke-color-red);
  --ls-wb-stroke-color-yellow: var(--ctp-wb-stroke-color-yellow);
  --ls-wb-stroke-color-green: var(--ctp-wb-stroke-color-green);
  --ls-wb-stroke-color-blue: var(--ctp-wb-stroke-color-blue);
  --ls-wb-stroke-color-purple: var(--ctp-wb-stroke-color-purple);
  --ls-wb-stroke-color-pink: var(--ctp-wb-stroke-color-pink);
  --ls-wb-text-color-gray: var(--ctp-wb-text-color-gray);
  --ls-wb-text-color-red: var(--ctp-wb-text-color-red);
  --ls-wb-text-color-yellow: var(--ctp-wb-text-color-yellow);
  --ls-wb-text-color-green: var(--ctp-wb-text-color-green);
  --ls-wb-text-color-blue: var(--ctp-wb-text-color-blue);
  --ls-wb-text-color-purple: var(--ctp-wb-text-color-purple);
  --ls-wb-text-color-pink: var(--ctp-wb-text-color-pink);
}

div.input-wrap > input::placeholder {
  color: var(--ctp-search-input-placeholder);
}

.recent-search a > div > div {
  border-color: rgb(var(--ctp-text));
}

a.ui__toggle .wrapper:focus {
  --tw-shadow: 0 0 0 3px rgba(var(--ctp-switch-handle-color), 0.5) ;
}
a.ui__toggle > span {
  background-color: var(--ctp-switch-background);
}
a.ui__toggle > span > span.switcher {
  background-color: rgb(var(--ctp-switch-handle-color));
}

button.ui__button {
  color: var(--ctp-button-text);
  background-color: rgb(var(--ctp-button-background));
}
button.ui__button[intent=logseq]:hover:not(.active) {
  color: var(--ctp-button-text);
  background-color: rgb(var(--ctp-button-background));
}
button.ui__button:hover {
  background-color: rgb(var(--ctp-button-background));
}

.tippy-tooltip {
  background: var(--ctp-tooltip-background);
  color: var(--ctp-tooltip-text);
}

.tippy-popper .arrow-regular {
  display: none;
  /* Hide the arrow */
}

.dark .ui__button[intent=logseq]:hover {
  color: var(--ls-link-text-color);
}

svg.warning {
  fill: rgb(var(--ctp-warning-color));
}

svg.important {
  fill: rgb(var(--ctp-error-color));
}

svg.note {
  fill: rgb(var(--ctp-info-color));
}

div.nav-content-item:not(.is-expand) .header {
  background-color: var(--ls-tertiary-background-color);
}
div.nav-content-item:not(.is-expand) .header a {
  color: var(--ctp-link-text-hover-color);
}

.left-sidebar-inner a.item.active,
.left-sidebar-inner a.item:active {
  color: var(--ctp-link-text-hover-color);
}

.left-sidebar-inner a.item:hover {
  background: var(--ctp-color-level-3);
}
.left-sidebar-inner a.item:hover span {
  color: var(--ctp-blue);
}

.cp__sidebar-left-layout .header:hover a {
  color: var(--ctp-link-text-hover-color);
}

.ui__modal-panel {
  border: 1px solid;
  border-color: var(--ctp-dropdown-border-color);
}

.dropdown-wrapper {
  border: 1px solid;
  border-color: var(--ctp-dropdown-border-color);
}

.block-children-left-border:hover {
  width: 2px;
  background-color: var(--ctp-bullet-thread-color);
}

mark {
  background: var(--ctp-text-highlight);
}

.form-input:focus {
  box-shadow: 0 0 0 2px rgba(var(--ctp-accent, var(--ctp-sapphire)), 0.5);
  border-color: rgba(var(--ctp-accent, var(--ctp-sapphire)), 0.5);
}

.bullet-container.bullet-closed {
  background-color: rgb(var(--ctp-accent, var(--ctp-blue)), 0.15);
}
.bullet-container.bullet-closed:hover {
  background-color: rgb(var(--ctp-accent, var(--ctp-blue)), 0.65);
}

.bullet-container:hover {
  background-color: rgb(var(--ctp-accent, var(--ctp-blue)), 0.15);
}

button.button.icon:hover {
  color: rgb(var(--ctp-accent, var(--ctp-pink)));
  background-color: var(--ctp-header-icon-background);
}
button.button.icon:hover > i {
  color: var(--ctp-header-icon);
}

.cp__sidebar-left-layout a {
  color: inherit;
}

.left-sidebar-inner .nav-content-item .header {
  background-color: var(--ls-tertiary-background-color);
}

html[data-theme=dark] .cp__header a,
html[data-theme=dark] .cp__header button,
html[data-theme=dark] .cp__right-sidebar-topbar button {
  opacity: 1;
}

::selection {
  color: var(--ls-text-on-accent);
}

.inline.with-bg-color {
  color: var(--ctp-primary-background-color);
}
.inline.with-bg-color b, .inline.with-bg-color .page-ref {
  color: var(--ctp-primary-background-color);
}
.inline.with-bg-color .page-reference:hover {
  color: var(--ctp-primary-text-color);
}
.inline.with-bg-color .page-reference:hover b, .inline.with-bg-color .page-reference:hover .page-ref, .inline.with-bg-color .page-reference:hover span {
  color: var(--ctp-primary-text-color);
}

.ls-block .with-bg-color:is(h1, h2, h3, h4, h5, h6) {
  color: var(--ctp-primary-background-color);
}

.menu-links-wrapper,
.menu-link {
  background-color: var(--ctp-secondary-background-color);
}

.menu-link,
.menu-link:hover {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  border-radius: 5px;
}

.cp__settings-inner > aside ul > li > a > strong {
  color: rgb(var(--ctp-primary-text-color));
}

.cp__settings-inner > aside ul > li.active .ui__icon, .cp__settings-inner > aside ul > li.active strong {
  color: rgb(var(--ctp-active-setting));
}

.cp__all_pages_table td > span {
  color: rgb(var(--ctp-primary-text-color));
}

.editor-inner .multiline-block:is(.h1, .h2, .h3, .h4, .h5, .h6):first-line,
.editor-inner .uniline-block:is(.h1, .h2, .h3, .h4, .h5, .h6),
.ls-block :is(h1, h2, h3, h4, h5, h6) {
  color: rgb(var(--ctp-text-heading));
}

b, strong {
  color: rgb(var(--ctp-text-bold));
}

i {
  color: rgb(var(--ctp-text-italics));
}

del {
  color: rgb(var(--ctp-text-strikethrough));
}

blockquote {
  border-left: 2px solid;
  border-left-color: rgb(var(--ctp-blockquote-line));
}

a[title=Yellow].shadow-sm > .heading-bg {
  background-color: var(--ls-highlight-color-yellow) !important;
}

a[title=Red].shadow-sm > .heading-bg {
  background-color: var(--ls-highlight-color-red) !important;
}

a[title=Pink].shadow-sm > .heading-bg {
  background-color: var(--ls-highlight-color-pink) !important;
}

a[title=Green].shadow-sm > .heading-bg {
  background-color: var(--ls-highlight-color-green) !important;
}

a[title=Blue].shadow-sm > .heading-bg {
  background-color: var(--ls-highlight-color-blue) !important;
}

a[title=Purple].shadow-sm > .heading-bg {
  background-color: var(--ls-highlight-color-purple) !important;
}

a[title=Gray].shadow-sm > .heading-bg {
  background-color: var(--ls-highlight-color-gray) !important;
}

#ui__ac-inner {
  background: var(--ctp-secondary-background-color);
}

.ui__ac-group-name {
  background: var(--ctp-tertiary-background-color);
}

.tl-button[data-selected=true] {
  background: rgb(var(--ctp-wb-button-selected-background));
}
.tl-button[data-selected=true] i {
  color: rgb(var(--ctp-wb-button-selected-foreground));
}

.ti, .tie {
  color: rgb(var(--ctp-wb-button-foreground));
}

.tl-context-bar .ti, .tl-context-bar .tie {
  color: rgb(var(--ctp-wb-button-menu-foreground));
}

.tl-type-tag {
  background-color: rgb(var(--ctp-wb-button-type-tag-background-inactive));
  border-color: rgb(var(--ctp-wb-button-type-tag-background-inactive));
}
.tl-type-tag .tie {
  color: rgb(var(--ctp-wb-button-type-tag-foreground));
}

html[data-theme=dark] .tl-type-tag[data-active=true] {
  background-color: rgba(var(--ctp-wb-button-type-tag-background-active), 0.8);
  border-color: rgb(var(--ctp-wb-button-type-tag-background-active));
}
html[data-theme=dark] .tl-type-tag[data-active=true] .tie {
  color: rgb(var(--ctp-wb-button-type-tag-foreground));
}

.tl-menu-item i {
  color: rgb(var(--ctp-wb-button-menu-foreground));
}

.tl-quick-links-row:first-child {
  background-color: rgb(var(--ctp-wb-quick-links-button));
}
.tl-quick-links-row:first-child :hover {
  background-color: rgb(var(--ctp-wb-quick-links-button-hover));
}

.tl-select-input-select-item[data-state=checked] {
  background: rgb(var(--ctp-tl-select-input-select-item));
}

i[class*=ti-layout-] {
  color: rgb(var(--ctp-wb-layout-button-foreground));
}

.bg-gray-500 {
  background-color: rgb(var(--ctp-gray));
}

.bg-red-500 {
  background-color: rgb(var(--ctp-red));
}

.bg-yellow-500 {
  background-color: rgb(var(--ctp-yellow));
}

.bg-green-500 {
  background-color: rgb(var(--ctp-green));
}

.bg-blue-500 {
  background-color: rgb(var(--ctp-blue));
}

.bg-purple-500 {
  background-color: rgb(var(--ctp-mauve));
}

.bg-pink-500 {
  background-color: rgb(var(--ctp-pink));
}

.block-marker {
  background-color: rgb(var(--ctp-priority-bg-color));
  border-radius: var(--ctp-marker-border-radius);
  font-size: 75%;
}
.block-marker.TODO {
  color: rgb(var(--ctp-priority-todo));
}
.block-marker.DOING {
  color: rgb(var(--ctp-priority-doing));
}
.block-marker.NOW {
  color: rgb(var(--ctp-priority-now));
}
.block-marker.LATER {
  color: rgb(var(--ctp-priority-later));
}
.block-marker.waiting {
  color: rgb(var(--ctp-priority-waiting));
}

.form-checkbox, .form-checkbox:focus {
  border-radius: var(--ctp-marker-border-radius);
  border: 2px solid rgb(var(--ctp-checkbox-color)) !important;
  background-color: transparent !important;
  height: var(--ctp-marker-size);
  width: var(--ctp-marker-size);
}

.form-checkbox:checked {
  background-color: rgb(var(--ctp-checkbox-color)) !important;
}

.form-checkbox:hover {
  transform: scale(1.1);
}

a[priority], a.priority {
  font-size: 0px;
}

a.priority[href="#/page/A" i], [href="#/page/B" i], [href="#/page/C" i] {
  display: inline-flex;
  opacity: 1 !important;
}

a[priority]::before, a.priority::before {
  transform: translateY(-1px);
  border: 1px solid rgb(var(--ctp-priority-bg-color));
  border-radius: var(--ctp-marker-border-radius);
  font-size: 12px;
  font-weight: 600;
  height: calc(var(--ctp-marker-size) + 4px);
  width: calc(var(--ctp-marker-size) + 4px);
  line-height: 1.5;
  text-align: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

a[priority=A]::before, a.priority[href="#/page/A" i]:before {
  content: "A";
  background: rgb(var(--ctp-priority-a));
  color: var(--ctp-primary-background-color);
}

a[priority=B]::before, a.priority[href="#/page/B" i]:before {
  content: "B";
  background: rgb(var(--ctp-priority-b));
  color: var(--ctp-primary-background-color);
}

a[priority=C]::before, a.priority[href="#/page/C" i]:before {
  content: "C";
  background: rgb(var(--ctp-priority-c));
  color: var(--ctp-primary-background-color);
}

a.priority:hover {
  transform: scale(1.1);
}

div.cm-s-solarized.CodeMirror {
  --bg0: rgb(var(--ctp-base));
  --bg1: rgb(var(--ctp-overlay1));
  --bg4: rgb(var(--ctp-overlay0));
  --fg: rgb(var(--ctp-text));
  --fg3: rgb(var(--ctp-subtext0));
  --gray: rgb(var(--ctp-subtext1));
  --blue: rgb(var(--ctp-blue));
  --yellow: rgb(var(--ctp-yellow));
  --aqua: rgb(var(--ctp-blue));
  --orange: rgb(var(--ctp-peach));
  --primary-bg: rgb(var(--ctp-base));
  --current-line: rgb(var(--ctp-surface0));
  --selection: rgb(var(--ctp-surface2));
  --atom: rgb(var(--ctp-lavender));
  --cursor: rgb(var(--ctp-overlay1));
  --keyword: rgb(var(--ctp-red));
  --operator: rgb(var(--ctp-sky));
  --number: rgb(var(--ctp-peach));
  --definition: rgb(var(--ctp-blue));
  --string: rgb(var(--ctp-green));
}

.cm-s-solarized.cm-s-light, .cm-s-solarized.cm-s-dark {
  text-shadow: unset;
  box-shadow: inset 7px 0 12px -6px var(--ctp-secondary-background-color);
}
.cm-s-solarized.cm-s-light.CodeMirror,
.cm-s-solarized.cm-s-light .CodeMirror-gutters, .cm-s-solarized.cm-s-dark.CodeMirror,
.cm-s-solarized.cm-s-dark .CodeMirror-gutters {
  background-color: var(--primary-bg);
  color: var(--fg3);
}
.cm-s-solarized.cm-s-light .CodeMirror-gutters, .cm-s-solarized.cm-s-dark .CodeMirror-gutters {
  background: var(--primary-bg);
  border-right: 0px;
}
.cm-s-solarized.cm-s-light .CodeMirror-linenumber, .cm-s-solarized.cm-s-dark .CodeMirror-linenumber {
  color: var(--bg4);
}
.cm-s-solarized.cm-s-light .CodeMirror-cursor, .cm-s-solarized.cm-s-dark .CodeMirror-cursor {
  border-left: 1px solid var(--fg);
}
.cm-s-solarized.cm-s-light.cm-fat-cursor .CodeMirror-cursor, .cm-s-solarized.cm-s-dark.cm-fat-cursor .CodeMirror-cursor {
  background-color: var(--cursor) !important;
}
.cm-s-solarized.cm-s-light .cm-animate-fat-cursor, .cm-s-solarized.cm-s-dark .cm-animate-fat-cursor {
  background-color: var(--cursor) !important;
}
.cm-s-solarized.cm-s-light div.CodeMirror-selected, .cm-s-solarized.cm-s-dark div.CodeMirror-selected {
  background: var(--selection);
}
.cm-s-solarized.cm-s-light span.cm-meta, .cm-s-solarized.cm-s-dark span.cm-meta {
  color: var(--blue);
}
.cm-s-solarized.cm-s-light span.cm-comment, .cm-s-solarized.cm-s-dark span.cm-comment {
  color: var(--gray);
}
.cm-s-solarized.cm-s-light span.cm-number, .cm-s-solarized.cm-s-dark span.cm-number {
  color: var(--number);
}
.cm-s-solarized.cm-s-light span.cm-atom, .cm-s-solarized.cm-s-dark span.cm-atom {
  color: var(--atom);
}
.cm-s-solarized.cm-s-light span.cm-keyword, .cm-s-solarized.cm-s-dark span.cm-keyword {
  color: var(--keyword);
}
.cm-s-solarized.cm-s-light span.cm-variable, .cm-s-solarized.cm-s-dark span.cm-variable {
  color: var(--fg);
}
.cm-s-solarized.cm-s-light span.cm-variable-2, .cm-s-solarized.cm-s-dark span.cm-variable-2 {
  color: var(--fg);
}
.cm-s-solarized.cm-s-light span.cm-variable-3,
.cm-s-solarized.cm-s-light .cm-s-gruvbox-dark span.cm-type, .cm-s-solarized.cm-s-dark span.cm-variable-3,
.cm-s-solarized.cm-s-dark .cm-s-gruvbox-dark span.cm-type {
  color: var(--yellow);
}
.cm-s-solarized.cm-s-light span.cm-operator, .cm-s-solarized.cm-s-dark span.cm-operator {
  color: var(--operator);
}
.cm-s-solarized.cm-s-light span.cm-callee, .cm-s-solarized.cm-s-dark span.cm-callee {
  color: var(--fg);
}
.cm-s-solarized.cm-s-light span.cm-def, .cm-s-solarized.cm-s-dark span.cm-def {
  color: var(--definition);
}
.cm-s-solarized.cm-s-light span.cm-property, .cm-s-solarized.cm-s-dark span.cm-property {
  color: var(--fg);
}
.cm-s-solarized.cm-s-light span.cm-string, .cm-s-solarized.cm-s-dark span.cm-string {
  color: var(--string);
}
.cm-s-solarized.cm-s-light span.cm-string-2, .cm-s-solarized.cm-s-dark span.cm-string-2 {
  color: var(--aqua);
}
.cm-s-solarized.cm-s-light span.cm-qualifier, .cm-s-solarized.cm-s-dark span.cm-qualifier {
  color: var(--aqua);
}
.cm-s-solarized.cm-s-light span.cm-attribute, .cm-s-solarized.cm-s-dark span.cm-attribute {
  color: var(--aqua);
}
.cm-s-solarized.cm-s-light .CodeMirror-activeline-background, .cm-s-solarized.cm-s-dark .CodeMirror-activeline-background {
  background: var(--current-line);
}
.cm-s-solarized.cm-s-light .CodeMirror-matchingbracket, .cm-s-solarized.cm-s-dark .CodeMirror-matchingbracket {
  background: var(--gray);
  color: var(--bg0) !important;
}
.cm-s-solarized.cm-s-light span.cm-builtin, .cm-s-solarized.cm-s-dark span.cm-builtin {
  color: var(--orange);
}
.cm-s-solarized.cm-s-light span.cm-tag, .cm-s-solarized.cm-s-dark span.cm-tag {
  color: var(--orange);
}
.cm-s-solarized.cm-s-light.CodeMirror, .cm-s-solarized.cm-s-light .CodeMirror-gutters, .cm-s-solarized.cm-s-dark.CodeMirror, .cm-s-solarized.cm-s-dark .CodeMirror-gutters {
  background-color: var(--ctp-secondary-background-color);
}
.cm-s-solarized.cm-s-light .CodeMirror-linenumber, .cm-s-solarized.cm-s-dark .CodeMirror-linenumber {
  text-shadow: unset;
}

.embed.embed-page .cm-s-solarized.cm-s-dark.CodeMirror, .embed.embed-page .cm-s-solarized.cm-s-dark .CodeMirror-gutters, .embed.embed-page .cm-s-solarized.cm-s-light.CodeMirror, .embed.embed-page .cm-s-solarized.cm-s-light .CodeMirror-gutters {
  background-color: var(--ctp-tertiary-background-color);
}

:root {
  --ctp-cm-theme: "ctp-frappe";
}

:root,
.theme-dark,
.theme-dark.ctp-frappe {
  --ctp-rosewater: 242, 213, 207;
  --ctp-flamingo: 238, 190, 190;
  --ctp-pink: 244, 184, 228;
  --ctp-mauve: 202, 158, 230;
  --ctp-red: 231, 130, 132;
  --ctp-maroon: 234, 153, 156;
  --ctp-peach: 239, 159, 118;
  --ctp-yellow: 229, 200, 144;
  --ctp-green: 166, 209, 137;
  --ctp-teal: 129, 200, 190;
  --ctp-sky: 153, 209, 219;
  --ctp-sapphire: 133, 193, 220;
  --ctp-blue: 140, 170, 238;
  --ctp-lavender: 186, 187, 241;
  --ctp-text: 198, 206, 239;
  --ctp-subtext1: 181, 189, 220;
  --ctp-subtext0: 165, 172, 201;
  --ctp-overlay2: 148, 155, 183;
  --ctp-overlay1: 131, 138, 164;
  --ctp-overlay0: 115, 120, 145;
  --ctp-surface2: 98, 103, 126;
  --ctp-surface1: 81, 86, 108;
  --ctp-surface0: 65, 69, 89;
  --ctp-base: 48, 52, 70;
  --ctp-mantle: 41, 44, 60;
  --ctp-crust: 35, 38, 52;
  /*WHITBOARD COLORS*/
  --wb-ctp-rosewater: 222, 149, 132;
  --wb-ctp-flamingo: 221, 120, 120;
  --wb-ctp-pink: 236, 131, 208;
  --wb-ctp-mauve: 136, 57, 239;
  --wb-ctp-red: 210, 15, 57;
  --wb-ctp-maroon: 230, 69, 83;
  --wb-ctp-peach: 254, 100, 11;
  --wb-ctp-yellow: 228, 147, 32;
  --wb-ctp-green: 64, 160, 43;
  --wb-ctp-teal: 23, 146, 153;
  --wb-ctp-sky: 4, 165, 229;
  --wb-ctp-sapphire: 32, 159, 181;
  --wb-ctp-blue: 42, 110, 245;
  --wb-ctp-lavender: 114, 135, 253;
  --wb-ctp-text: 76, 79, 105;
  --wb-ctp-subtext1: 92, 95, 119;
  --wb-ctp-subtext0: 108, 111, 133;
  --wb-ctp-overlay2: 124, 127, 147;
  --wb-ctp-overlay1: 140, 143, 161;
  --wb-ctp-overlay0: 156, 160, 176;
  --wb-ctp-surface2: 172, 176, 190;
  --wb-ctp-surface1: 188, 192, 204;
  --wb-ctp-surface0: 204, 208, 218;
  --wb-ctp-base: 239, 241, 245;
  --wb-ctp-mantle: 230, 233, 239;
  --wb-ctp-crust: 220, 224, 232;
}

.form-checkbox:checked {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='rgb(48, 52, 70)' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0z'/%3E%3C/svg%3E") !important;
}

plugin tools in header are inconsistent

Fix styles of plugin tools in headers to match other items
Add accent color (and fallback color) for bold+italic text as italic only also has one.

Originally posted by @griimick in #34 (comment)

switching from light to dark theme using `t t` made undoable change to the accent of bold + italics accent ( using `text`) and the accent of header tools.

I was previewing themes using the t t shortcut but it caused colors to swap, mainly the accent color of the bold+underline texts and the tool section in the headerbar.
I have tried reinstalling the theme and refreshing logseq but nothing works. Please help!

new unthemed elements in flashcard

Logseq v0.10.7
Catppuccin v0.6.0

unthemed search modal

reported over discord

Logseq v0.10.7
Catppuccin v0.6.0

Editor colors are off since last update

Hello,

I don't know if it's something that broke in the last update, but since it the editor colors at least in the light themes are not conform anymore. I'm back to something that very much looks like the standard logseq light theme.

Anybody experiencing the same thing ?

Links are barely visible on highlight

Can't choose theme variant

I installed the theme through the Plugin Marketplace. The Latte variant is active and there is no other variant in menu -> Themes. In menu -> Settings -> General, light, dark and system do not work.

Light theme and dark theme code block background color cannot be displayed correctly

Light theme and dark theme code block background color cannot be displayed correctly
v0.2.3
0.99

line wrapping in code block

I have been trying to locate where to place the CSS for line wrapping in code blocks (``` created blocks).

Using the inspector I have added
text-wrap: pretty; and white-space: pre-line; (the latter gives a black bar at the top of LogSeq, so I dont think this one is right. The former does what I want)... to the section below in the inspector does work, but then the cursor presents weirdly (see screeshot). Any suggestions?

*, :after, :before {

}

As you can see, that long line between the two lines of wrapped text is the cursor... Its presently at the end of the line after css, but if I was to move the cursor to the start of the line it would still span all lines.

This sounds like maybe a Logseq bug but I wanted to check in and see if you thought maybe I'm just screwing up my css placement instead.

Regression issues from v0.5

Issues reported over Logseq discord and DM,

button icon color not visible (Recent and Favorite item options)
Theme selection item on hover picks default theme color
theme breaks completely with v0.10.6 which does not have the option to cancel accent selection (reported by @Chais)
whiteboard tooltips and status bar colors (reported by @jh-devv)

Can't select items from the drop-dwon list

In original logseq theme, we can select items from the drop-down list with up/down arrow keys.
However, it not doable with catppuccin theme. Similar behavior is only available via mouse.

For example, the Zotero item is only highlighted when my mouse is on it.

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
D3

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web

Some thing interesting about web. New door for the world.
server

A server is a program made to process requests and deliver data to clients.
Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.

Jobs

Jooble