psu / logseq-style-tweaks

A smorgasbord of small and large style tweaks to the Logseq UI.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

This repo is no longer maintained

I'm not using Logseq currently, so it's not viable for me to update the repo.


Logseq Style Tweaks Plugin

This is a smorgasbord of small and large tweaks, activate the ones you like. The plugin is to be used together with the default themes (or custom ones) to tweak specific parts of Logseq's UI. List of tweaks divided into three areas, Content, Font, and UI:

Content

  • Tags as rounded chips Display tags as chips with rounded sides, background color, and uppercase.
  • @-tags as hollow, rounded chips Display tags starting with at "@" as chips with a rounded border and capitalised.
  • Tasks as chips Display tasks as a chip togheter with its label.
  • Code background Use standard background colors for code blocks.
  • Tippy window Make the tippy/hover window look more like the rest of the content.

Font

  • System font Use the system's default font family for text and UI.
  • Smaller headings Display page title and headings with smaller font size.
  • Thinner text Change the regular text to font weight 300, and bold text to 500.
  • Font color Use black or white color for the default font, to increase contrast.

UI

  • Always dark sidebar Use a dark left sidebar for both light and dark themes, in the style of the Bear app.
  • Sidebar width Set the with of the left sidebar to 280 px.
  • Icons color Make all header icons have the same color.
  • UI headings Set the same font for References, Hierarchy, Tagged pages, and Custom query titles.
  • Hack rename "Hierarchies" A hack to rename the "Hierarchies" heading to "Namespace pages".
  • Close button color Make the close buttons less eye-catching.
  • UI toggle color Make UI toggles use the standard variable for checkboxes.
  • iOS style scrollbars Scrollbars with no background and rounded corners.
  • PDF view toolbar Restyle the PDF view toolbar: icons more protruding, vertical toolbar direction.
  • Filter icon Use prominent, standard colors on inactive and active filter button.
  • Filter chips Replace border with background color on filter chips.

Demo image

How to

  • Install it via Logseq marketplace.
  • Go to Settings > Plugin Settings > Style Tweaks, turn on the tweaks you find useful.
  • Reload Logseq (mod+r) for the UI changes to take effect.
  • Optionally copy/paste CSS to your custom.css to use the tweaks in the iOS app.

About

It should be fairly easy to figure out how to add your own tweaks if you download the plugin. You are also welcome to suggest new tweaks.

About

A smorgasbord of small and large style tweaks to the Logseq UI.

License:MIT License


Languages

Language:CSS 72.1%Language:JavaScript 27.0%Language:HTML 0.9%