org-roam-server icon indicating copy to clipboard operation
org-roam-server copied to clipboard

Custom CSS?

Open code-SL opened this issue 3 years ago • 1 comments

It's a bit difficult to follow the code on how roam-server implements the CSS for org-mode when previewing (hovering over a node). It does not seem to pull from orgcss via a link. Is the code in /assets/org.css just "copy and pasted" CSS from orgcss?

Seems like the only way to change the CSS for preview is to edit the /assets/org.css file directly? Is that the file holding the CSS for preview? Or is there another mechanism?

code-SL avatar Jun 15 '21 02:06 code-SL

You can change the CSS with the org-roam-server-style variable, see this snippet from my config:

(setq org-roam-server-style
	  (concat
	   "button#toggle-preview { margin: 4px; }"
	   "div#view-menu { margin: 4px; }"
	   "div#controls { right: 4px; left: 4px; bottom: 4px; }"
	   "button#toggle-list-type-button { margin: 0 4px; }"
	   "label#colormode { transform: translate(-25%, 0); }"
	   "label.toggle-off.btn-sm { padding-left: 0px; }"
	   ))

Riyyi avatar Jul 27 '21 17:07 Riyyi