[Wiki] CSS snippets to make things more compact and information dense and/or less visually obtrusive

Plugins and Custom CSS CSS
#13

I’m both appreciative and confused. Could you show a before and after screenshot, illustrating the problem? The more of your screen captured, the better.

1 Like
#14

Sorry about confusion, I have recorded a video and embed it to my previous post, you can watch it… This problem just happens when you hide the Sidebar and use Windowed Panes

1 Like
#15

Seems like it might be worth reporting as a Windowed Panes-specific bug?

#16

This bug only occurs when we use the code above that makes the space between the sidebar and the .document--ltr smaller. If you don’t use this code, RN works fine. . So, I don’t think it is a bug…

But I don’t know why this .document-sidebar--collapsed--vertical is so long. If you are in RemNote 1.3 or below, this class can be used for show the sidebar when we move the cursor near the left margin …

2 Likes
#17

Ah, an oversight then. Still, might be worth telling the team to remove the unused stuff to avoid it causing problems in edge cases like this one.

2 Likes
#18

Is there a way to reduce this space? (Between title and Source and Tags). Also, what is the :hover for the “Show Source”? I never know where to click, so I have to wave the mouse around. It’s one thing I would like visible, if possible. Thanks!

image
image966×422 13.6 KB

3 Likes
#19

Updated the OP with a new snippet for space between a bullet and its rem text and made it into an actual wiki. Contributors welcome!

1 Like
#20

same concern here because I’m printing my notes on notebook paper and that’s a lot of space wasted :frowning:

#21

I tried to update this wiki in the Requests section, and to add a section “Make elements more prominent”. I hope I didn’t mess up anything! I might suggest renaming this page to be more general, "CSS snippets to adjust compactness and minimalness: :smiley:

2 Likes
#22

Edited the edits, renamed the topic. Please don’t add stuff that doesn’t have to do with the goals: Hannes’ kanban is an additional feature.

1 Like
#23

No problem! Sorry about that!

1 Like
#24

This is really useful! Just wondering if you know how to reduce the minimum size an image can be resized to? Line height doesn’t have any effect.

#25

Is there a way to hide the “Flashcards” and “Edit Later” in the Sidebar? I never need those things and that’s prime real estate for me.

#26 
div.flex.items-center.mb-1.h-\[32px\].overflow-hidden.text-gray-60 {
	display : none;
}
4 Likes
#27

Thanks so much Achyut! Worked so perfectly! I will add it to the wiki.

3 Likes
#28

Hi, @UMNiK ! I changed the Header 2 with this code, but it seems to affect the way these documents are displayed when zoomed in (as titles, I think). Is there a way to make these changes not affect the document title format? I hope I’m being clear. Thanks!

#29

Sure, here you go.

/* smaller and less bold headers, except for when they are zoomed into */
.rem-text.rem-header--1:not(.document-title) {
	font-size: 22px; /* regular text size is 16px */
	font-family: Segoe UI; /* Inter is the default */
	font-weight: 500; /* 700 is the default */
}

.rem-text.rem-header--2:not(.document-title) {

	font-size: 20px; /* regular text size is 16px */
	font-family: Segoe UI; /* Inter is the default */
	font-weight: 500; /* 700 is the default */
}

.rem-text.rem-header--3:not(.document-title) {
	font-size: 18px; /* regular text size is 16px */
	font-family: Segoe UI; /* Inter is the default */
	font-weight: 500; /* 700 is the default */
}
3 Likes
Changing the Header size and formatting
#30

Excelent, thanks! Worked perfectly :slight_smile:

1 Like
#31
#32

The hide alias code doesn’t seem to work in the latest update