CSS theme - Ohmine Dark Theme v3

You're welcome. That's what contributors are for in the free software world :wink:

Originally I wanted to put it there to look better, but now it seems that I can only put it back in place.

As you appear to be into themeing nav.table-of-contents in userstyle.css will likely be of use to you. These are a couple of css selectors I use to customise the TOC a little and add a title.

userstyle.css

nav.table-of-contents {
    /* adds a background colour to TOC lists */
     background-color: #F4F5F6;
     padding: 10px;
}
nav.table-of-contents::before {
    font-weight: bold;
    content: 'TABLE OF CONTENTS';
}

toc

I'll now leave you alone to get on with your work... :slight_smile:

2 Likes

Great tips! Thanks again for all of your information! :heart_eyes:

Many thanks, the pointers were very useful.
Cheers, Randy

1 Like

Do you want a sync boost? :laughing:

2 Likes

hi @bepolymathe, I'm not a spoiler plugin user but I'm have a question about the usage of spoiler. I want to understand that when you already have the inline spoiler function, then what reason makes you to use the spoiler block?

Cause I'm styling this pulgin for the upcoming version of OhminDT, I want to make sure I unstanding the concept of a spoiler plugin user.

And a good news for you is you will be able to print out the spoiler soon. :partying_face:

Hi @Nacandev

Great news that you are working on this :+1:
My use of the spoiler function is mainly for presentation purposes. If I share my screen, I can scroll through a plan or figures gradually. I can also hide a piece of text so it doesn't show up right away. Some examples below...

It's very practical and appreciated by the listeners thanks also to your beautiful theme!

But if at the end of the presentation, when my screen is no longer shared, someone wants to look at the presentation again, I would like to be able to share my presentation with them (thanks to Joplin cloud)... but currently it looks like this.

This is not quite what I had presented :wink:

1 Like

It's clear enough! Thank you for the details!

1 Like

OhminDT is finally comes up with a major update

In OhmineDT v2.0.0, I'm not going to hide any official function which Joplin provides by default. I think it would be more make sense for all users, and also much fair to Joplin. So, you have to edit a few lines of CSS manually if you want to hide some of them.

Thank you guys for loving OhmineDT!

v2.0.0 (24-OCT-2021 tested on Joplin v2.4.12)

  • New: add styling for the markdown TOC
  • New: add Abstract Content Bar blank line switcher to userchrome.css
  • New: add print general section to userstyle.css to control the printing fonts and font size
  • New: add mouse hover effect on the sync button icon - (just for fun)
  • New: add mouse hover effect on the bottom tag bar tags - to zoom bigger
  • New: bold up the code block bottom scrollbar - make it easier to click and slide while using the mouse
  • New: add css porperty to hiding the rich text editor button - see it in the userchrome.css > switcher section
  • New: add aviod page break in the custom title block , sticky notes , table while print it out
  • New: add printing properties to the color controller section of userstyle.css
  • Fix: missing printing values
  • Fix: invaid values
  • Fix: the notebook navigation button is overlap on the toolbar
  • Fix: search text displaying wrong size on headings
  • Change: note title default to showing on printing - please edit userstyle.css if you wanna hide it
  • Change: printing colors all to go darker - I expect that's fit for all printer
  • Change: "All Notes" button default to "not hide" - if you want to hide it please go edit in the userchrome.css
  • Change: in userchrome.css, the text grouping of non-monospace font and monospace font are now much clear
  • Change: restructure the CSS codes
  • Change: rename some of the root porperty names
  • Change: improve some of the CSS selectors

HI @bepolymathe, I'm sorry because I have to delay release the Spoiler part. I met too much unxpected problems when I test spoiler on printing. So, I just need more times to figure out what's happens in it and release the non-spoiler version first. But I'll keep trying on it.

HI @RandyR54, I'm sorry for the delayed release of my update because I suddenly change my mind to release a major update. The source code comments are more friendly for beginners now. I hope you will enjoy what's bringing you in the new version of OhmineDT.

Thank you for letting me know you met a problem with the printing output. OhmineDT now have a more reliable printing output for all printer because of you!

Also, thank you @dpoulton give me an idea for styling the TOC.

1 Like

Hey great! Thanks for all of this :+1:. No worries about spoilers it can wait a bit :wink:. Have a nice Sunday .

1 Like

Love it :star_struck:

1 Like

I am setting it up right now. Thanks for all your work, this takes Joplin from good to great. Cheers.

1 Like

Hey @bepolymathe, could you tell me what OS you are using? The developer of spoiler said can't recreate the problem(cannot print out spoiler), so I would like to figure out is it related to the OS.

Hi @Nacandev

Of course. I have Joplin on windows 10, Fedora (and android :wink: )

Did you try to print out the spoiler on Fedora? Cause I'm using Windows too, and I don't have a Linux laptop for test.

It seems to me that I have tried yes but your question puts me in doubt. I will try again tonight when I get home.

1 Like

Hi @Nacandev

Ah yes I remember why I had a doubt :wink: I didn't set up a printer on this Fedora computer because I don't have a printer :rofl:

image

But, If I use the export function now (in .html)...

image

... it seems to work :thinking:

test note.html (57.3 KB)

Try to export a PDF which includes a inline spoiler and spoiler block.

but have to make sure your usrestyle.css is contained the below CSS first:

@media print {

  /* Hides the side arrow */
  .summary-title:before {
      content: "";
  }
  
  /* Container for spoiler body */
  #spoiler-block-body {
      /* Shows the body contents */
      display: block;
      animation: none;
  }

}

Please quit and restart Joplin after you save the file. Then, test to export a PDF.

Yes, of course. I am tired, :scream: I had made an html export :roll_eyes:
In PDF with your extra piece of code in the userstyle.css it works!

test note.pdf (241.0 KB)