Theme: ITS (Dark/Light Theme)

[SlRvb]

Whoops, thanks for reminding me! Yeah, I forgot I’d added that since I hadn’t committed the correct version to the repo.

The fully functioning Style Setting toggle to Justify text in edit and preview across the entire vault is working as intended now.

[Felipe]

Hello @SLVrb!

@SlRvb

Whoops, thanks for reminding me!

I’m glad to know that! Every update I took a time to read your releases notes and “study” the new features.

So, I take a look at every Style Settings

Every time I learn something new from ITS that’s makes my workflow better.

Justify Text works perfect for EDIT and PREVIEW mode

Thanks for doing this!

[Felipe]

Hello @SlRvb !!!

I’m so sorry to bother you with this. I found a strange situation that I need to share with you.

Short history: Specific View Font Changes >>> Different Preview/Editor Text is not changing the fonts (when is marked [x])

To emphasize this I changed the fields with extreme different fonts (Times New Roman and Zappino) from the Standart Font (SFMono-Light)

Style Settings - Standart Font

Style Settings - Specific Font

This is the Result: the Specfic fonts is not been apply

But, looking into my Notes I saw something that I think is important to show
the bullet lists on PREVIEW mode only are respecting the Specific Font input

If I turn the Obsidian Zoom, only in this piece of text in EDITOR mode is respecting the Specific Font input

Everything is OK with Headings and Decorations fonts. Its “just” the regular text itself

My Ambience:

• 0.12.3
• ITS version: 27 May 2021 or the new version June 1st 2021
• all snipets disable
• all plug-ins disable (except Style Settings)

Suspection: I moved from 0.11.3 to 0.12.3 before installing the ITS release from 27 May. Maybe it’s something related to the new font size feature of Obsidian Appearence >>> Font Size that affected the Specific View Font Changes

I’m sorry if I didn’t report this early. Last week was a little harsh and I didn’t had time to try to understand and write properly what was happening with me.

I simply disable Specific View Font Changes >>> Different Preview/Editor Text and continued to use ITS

I hope you can reproduce this on your end. Let me know if I can help with more tests.

Thanks!

[SlRvb]

Mini Fixes Update

• Advanced Table Plugin: Table formatting in editor now are aligned
• Style Settings:
  • Justify Text in edit and preview works properly now
    (Just in case you missed the update about it here)
  • Specific View Font Changes properly applies fonts now

[Felipe]

Hello @SlRvb !!

Thanks for the fixes

Specific View Fonts is perfect again!

Thanks!

[SlRvb]

Update

• Menu Resized and dropshadow changed to match theme
  
  
  
• Quick switcher, Command Palette, Tooltip Popup squared
  • Quick switcher has an icon for notes as well (No way to display different icons for different files currently)
    
    
    
• Graph View Settings Menu is wider
  
  
  
• Style Settings:
  • Sidebar no longer colors note title background, only the sidebars
  • Dataview toggle now also colors external links on the first column
  • Hide Resize Handles Toggle hides the resize handles until you hover over them
• Workspace Layout Redesigned
  • Sidebars simplified
  • Note titles border removed, active note is a gradient
    • (Deep Dark Accent in Style Settings changes the color for the note title gradient)
    • Supports Sliding Panes Plugin as well

Sliding Pane:

[Felipe]

Hello @SlRvb !!!

@SlRvb

Workspace Layout Redesigned

Oowww I don’t have words to describe how happy I’m with this new workspace layout.

• The way the gradient changes from red to black in the exact moment that we have the 3 buttons is fantastic

Thank you very much for this! I loved everything.

I have two things to share with you: Little Bug and One Question

Little Bug?

@SlRvb

Menu Resized

I think the Menu is cutting content on the bottom:

• In the left pane I have more plug-ins: Text Snippet, Underline and Zoom (Obsidian Zoom)
• Same behavior on the main “window” and the Style Settings window

Maybe it’s my window, but I think I should tell you to see if this happens on your end.

Question

Would mind helping me with the color for the background-color? I’m not finding in the Style Settings

I wanna try something like this:

Thanks again for one more amazing update !!!

Have a great day!

[SlRvb]

I can’t seem to replicate the menu issue, it doesn’t seem to cut off anything for me .

Mini Update

The Sidebar Tabs are now set to the Dark Sidebar color in the Style Settings

it should look a little closer to the look you want @Felipe.

[Neu]

It cuts off at this point for me as well (as in, I can’t scroll further down at all, neither in the sidebar nor the contents of the section, it’s like scrolling is locked)

[SlRvb]

Mini Fixes

• The Sidebar Tabs are now set to the Dark Sidebar color in the Style Settings
• Fixed quick switcher icon css affecting header/block linking
• Fixed Settings scroll issue

[Felipe]

Hello @SlRvb !!!

@SlRvb

Mini Update

The Sidebar Tabs are now set to the Dark Sidebar color in the Style Settings

Thank you very much for the change! It’s exactly the color that I want

@SlRvb

Fixed Settings scroll issue

Settings scroll is perfect !!! you found the solution.

I was here disable/enable things/plugins/snippets/font size/zoom … to try to find a way to help.

Thanks for one more fix

I hope you have a fantastic day!

[SlRvb]

Update

• Codeblock will wrap if aside or image is beside it
  
  
  
• New id: un-c will set clear to none, so elements overlap
• Mobile Left Sidebar Ribbon Recolored to match Desktop

Fixed

• Aside-in's margin, text no longer sits right up beside it
• Blockquote’s inner padding, text no longer sits too close to the quotation mark
• <i></i> is more specific to avoid conflict with Dictionary Plugin
• Inline Code resizes to match the Header size
• Checkbox no longer has indenting issue when checkboxes are spaced out
• Style Settings
  • Text Sizing resizes text and code properly
  • Added Text UI slider to resize sidebar and menu text

Writing CSS Class Redesigned

Available as a toggle in the Style Settings (Under Workspace) to enable for both edit and preview mode.

• Far more minimalistic design to no longer distract while reading
• Page is slightly slimmer
• Links
  • Link colors match text instead
  • Superscript o for [[internal links]]
  • Superscript + for [external links]()
  • Hovering over “highlights” the link
• Code
  • No background color or drop shadow
  • Inline code matches text color and is a slightly bolded monospace font
  • Code blocks left border is the code block background color, while the right border is the code text color
  • Code Languages colors are desaturated
• Headers have no underline but are still centered
• Horizontal Line has no icon, just a line
• Footnotes
  • Icon changed to an up arrow
  • In-text number matches footnote text color
• Asides
  • No background color or dropshadow
  • Resized to sit on the page slimmer
  • Show and In: only have a left red border line
  • Hide when hidden is recolored to match the horizontal border, when open it matches the design of show and in
• <i></i>'s text color matches normal text color
• Arrows are a much fainter color
• Lists have no relationship lines, just the bullets change colors
• Blockquote
  • No background color
  • Just a dark red left border line
  • More margin spacing to the left, slightly less to the right (not in editor for useability)
  • Special Blockquote formatting recolored
  • Quotation mark colored darker
• Markdown Highlights are a faint gray color
• Editor Formatting are a faint color

Comparison With/Without Writing Class

[Felipe]

Hello @SlRvb !!!

Thanks for this spectacular update!!!

It’s so many new features that I’m running late today

@SlRvb

Writing CSS Class Redesigned

I want to appreciate the new Writing CSS Class without rush. There is a lot of details to learn and see

@SlRvb

• Text Sizing resizes text and code properly
• Added Text UI slider to resize sidebar and menu text

I must say you read my mind @SlRvb , today is the first day that I could see the sidebars without using my glasses. I was planning on ask you for this feature. I’m very very happy!

What you did is one of the most important features for me. Finally I can see my backlinks and search at ease

As always thank you so much for this mind blowing ITS THEME

[SlRvb]

Update

Note
Font may shrink when updating the theme, clicking reset on sliders will fix it.
This might be a bug with the Style Settings.

• Menu
  • Fix Supercharged large menu, allows for scroll
  • Reduce Menu Right Side
  • Auto Resizing based on the size of the window
• Fixed writing Editor mode text justified
• ITS Icons file includes more icons
• Image Adjustment
  • micro size resizes image to around 70px
  • Image Adjustment snippet now includes inverting image colors and new micro sizing
• <i></i> classes restored to allow for “stacking”
  • For Example: <i class="nobg right"></i> will move the text to the right and hide the background color
  • Id versions have not been removed, they’ll still work
• Redesigned
  • Popover matches other embed designs
    
    
    
  • Admonition plugin design has been slightly tweaked
    
    
    
    
    
    • Icons align with text and dropshadow matches other embed designs

Style Settings

• Resize Toggle
  • Located under Workspace > Workspace Resize
  • Adjust Size of Menu, Sidebar, and Note Title Text each
  • Works on mobile as well
• Personal Supercharged Links Adjustments Toggle

[silentmind]

Hi,

I want to change the bullet list odd and even elements to have similar color, in the Style Setting, I have changed all to 1 hex color but it only applies to the edit view, preview is still the same

It would be great to have this as a toggle in the style setting

Here is an image of how it looks right now

[SlRvb]

If you change Accent 2 in the Style Settings to match it, they should all be the same color.

[obsidophile]

I love the theme. Not using any CSS snippets or changes so standard install.
Notice a few things…

• Can’t see the cursor on EDIT mode.
• Dark mode base font is super faint.
  See this is many places like settings as well.

Any ideas what I did wrong?

[Klaas]

@obsidophile: I love your pseudonym !!!

[SlRvb]

Update

• Fixes:
  • Sync settings squared and spacing fixed
  • Embed inside popover is no longer too long
  • Sliding Panes rotated header icon padding fixed
  • Command palette hotkeys now match codeblock styles of the settings hotkeys
    
    
    
  • Removed Quick Switcher file icons temporarily to stop conflict with pinned commands in the Command Palette
  • Notice Messages redesigned
    
  • Urls [](urlhere) in Comments and yaml/frontmatter fixed to match font
    
  • Kanban padding on mobile fixed to match desktop
  • Publish flair colors fixed
  • Link popup redesigned to match
    
• Image Position:
  • center: new option to center images for the simplified version
  • c is now ctr to avoid issues with other adjustments
  • profile is now p.rofile to avoid issues with pr
• Reveal Slide Shows supported & Redesigned
• Font Icons Support:
  • Material Design Sharp
  • Remix Icons
  • Font Awesome
• ITS Alternate Themes
  • Fonts embedded into the snippet:
    • Fira Code
    • Cinzel Decorative
    • Norwestor
  • D&D
    • Light theme colors fixed
    • Dark theme graph colors and codeblock colors adjusted
  • SlRvb Gray Colors Fixed
  • School Days Colors Fixed
• Style Settings
  • Sections collapsed by default for easier traversal
  • Some style settings descriptions fixed
  • Flat Note Title Color: toggle that turns off the note title gradient for a flatter color
  • Original Bullet Style are all 1 color
  • Specific Line Size is now Line Size and affects Editor as well
  • Preview Heading 1 Sizing should now properly resize headings instead of making it huge and breaking
  • Horizontal Line Symbol allows for font icons with the new Horizontal Line Symbol Font dropdown

[Scribe]

As usual, I appreciate the updates @SlRvb. I have a small feature request if you think it would also be appropriate for other users too, which is to possibly separate some of the BASE64 into separate snippets. I’ve noticed the file size of the main CSS increase significantly recently and things like unused embedded fonts and icons serve no purpose. However, it’s not impacting performance or anything. It’s just a personal desire to reduce size where possible. Thanks again for all your hard work here.