Theme: ITS (Dark/Light Theme)

Update

Fixes

  • Fix large code sizing because of headers ### ![[code]]
  • Unset Infobox Callout floating on mobile
    • Use |mobile to undo this fix
  • Removed padding from sides of sidebar tabs
  • Note icon height fixed
  • Popout window header padding fixed
  • Fixed Colorful List Bullet missing color on levels 4-6
  • Fixed focused sidebar border
  • Exclude kanban cards from WOTC’s box shadow
  • Fix outlink/backlink styling
  • Graph search input widened
  • Graph menu/control temporarily resizable
  • Sidebar Tabular style restyled to fit the ITS theme design
    Obsidian_1xU4tWJXux
  • Community Theme Delete button padding Fixed

Style Settings

  • Change / Add Center Headings and Center Headings with Lines into a dropdown menu
    • Under: Note Elements > Headers
  • Bottom Navbar Button Toggle moved
    • Under Workspace > Sidebar

  • Add Header Alignment section for moving heading positions individually
    • right, left, and center
    • Under: Specific View Heading Changes > Header Alignment

  • New Background Image options
    • Under: Workspace > Background Image

  • New Document styling toggle
    • Under: Note Elements > Document

2 Likes

Mini Update

Fixes

  • Infobox width sizing on laptops fixed (no more scrollbar appearing)

  • Graph search bar sizing fixed

  • [!metadata|i-at] restyled to allow for adding +/- without losing callout
    Obsidian_nrVITjuwck

  • Removed border line from sub callout’s inside [!column] callout

  • tag-outline and tag-notion should work properly now (if added to note’s cssclass)

Callouts

4 Likes

image

Hello, I have a problem with the heading font being too large thus the quotation mark sometime block the words from the quotation block. Is there any remedy to this problem or do I have to change font?

Thanks a lot

Also, I like the background option a lot, it adds a ton of personality to my vault, thank you!

Hello, I found a bug with using the image adjustment with using icon


I tried turning off the snippet and the one that produce the problem was the Image Adjustment Snippet

ITS Theme V1 Beta Update :partying_face:

ITS v1 is being released in beta to check that previous styling for important workflows within the theme are not missing before the true v1 release.

  • Theme fully restructured to fit the Obsidian v1 design philosophy
  • Updated to restore ITS Styling & fix broken CSS
  • Style Settings restructured

Before you download the Beta

NOTE: This is a BETA release, expect certain things to be broken or missing. If things are horribly broken or styling / settings you used are missing, please do ping me in the Discord or submit it to the theme’s github repo and I should be able to add/fix it.

:warning: CAUTION: Export your style settings changes to ensure previous styling is not lost

The new update uses different variables and class names that will not 100% match the previous style settings classes and thus wipe out the style settings options.

Keep that exported file and if there’s an option that is missing that you want in ITS v1, please open the sandbox vault with my theme and import that style settings file then send me a screenshot of that if you can so I can recreate it or suggest how to do so on your end. Thank you! :sparkling_heart:


Download the beta

The download for the beta needs to be manually added to the themes list unfortunately :see_no_evil: The gif shows how to download the beta theme into obsidian and begin testing, so do watch if you don’t know what to do.

Obsidian_Uqr5DxOkhu

1 Like

This is a great theme.

Any way to lock the checkboxes? If I click on one, my icon gets cleared and lost. In other words clicking on “[!]” makes it “[]” and then clicking again makes it “[x]”.

If we can lock them, they basically become new bullet icons, which is super handy.

just possible for sub-checkboxes (indented checkboxes below a custom checkbox).
Checkboxes are just checkboxes, their default value is [x] or [] custom checkboxes cannot be restored with another click.

Pls, can you add a function to make left and right aligned boxes on the same level? I want to make a timeline of the history where left column is what “good guys” (players) are doing, while right column is what bad guys were doing simultaneously. Maybe something like [!timeline|t-r t-(-1)] could work

The beta link leads nowhere ._.

ITS Theme v1 ReWrite

  • Theme fully restructured to fit the Obsidian v1 design philosophy
    • Restored ITS Styling & fixed broken CSS on v0.16+ styling update
  • Style Settings restructured
  • New Guide site for easier and clearer instructions for the ITS Theme: ITS Theme - SlRvb's Documentation - Obsidian Publish

NOTE: The separate Alternate Theme Styling snippet is no longer supported. Delete or disable the snippet version when you update my theme and use the color schemes included in the theme’s style settings under Alternate Color Schemes, thank you!


:warning: CAUTION: Export your style settings changes to ensure previous styling is not lost before updating.

The new update uses different variables and class names that will not 100% match the previous style settings classes and thus wipe out the style settings options.

If there’s an option that is missing that you want in ITS v1, do share that style settings file if you can so I can recreate it or suggest how to recreate it again on your end. Thank you! :sparkling_heart:

Originally Released: 2023-05-24

1 Like

v1.1.00 Update

Properties update that includes more Plugin, Publish, Mobile, Style Settings, and Snippet styling fixes

  • Added
    • :toolbox: Added Properties Styling & Style Settings Options Note > Properties / Metadata
    • :toolbox: Restored Writing CSS Class & Added Toggle to Style Settings under: Note Section
    • :toolbox: New Tab width styling: Auto & Wide
    • :toolbox: Illusion Header Specific toggles
    • :toolbox: Center Live Preview Horizontal Line toggle
    • :toolbox: Added Sidebar Icon color to style settings
    • :scissors: Option for Image Adjustments to use relative/dynamic sizing with |relative
    • :scissors: Embed Adjustments: |no-margin and |collapse options added to remove margins/padding
    • :scissors: Callouts: Added ITS Quote styling additions Documentation
    • :electric_plug: Statblock plugin: Added Disable ITS Statblock Style - Style Setting Toggle
  • Fixed
    • :iphone: Mobile: Sync Modal top margin fixed
    • :iphone: Mobile: List arrow brought closer to list bullet
    • :iphone: Mobile: Fixed Outline pane alignment issues
    • :iphone: Fixed Document Search/Replace wrapping issues on smaller screens/windows
    • CSS Classes fixed: readable, poem, hide-header-underline, hr-no-icon/hr-tog, img-adj-center
    • Fixed Canvas padding sizing / overflow issues
    • Fixed Tabs re-adjusting width inconsistently
    • Community button text color fixed
    • Incorrectly inherited formatting colors for bold and italics within links fixed
    • Only apply Illusion Header styling within Notes
    • Fixed Tag Pane styling # alignment
    • Fixed Tag Pane where long lists of tags caused tags to disappear
    • Moved list arrows closer to bullets
    • Fixed Sidebar Tab Icons active & focus color issues
    • Fixed Sidebar text gaps for File Explorer, Outline, and Bookmarks
    • Fixed new spacing variable for headings to restore ITS Styling
    • Fixed readable line width applied to new window despite readable line length toggled off
    • :globe_with_meridians: Publish: Fixed Kanban & List styling clashing on publish sites
    • :globe_with_meridians: Publish: Fixed sidebar icon color & smaller sidebar icon sizing on mobile for explorer
    • :scissors: Encoded Fonts Snippet: Pathfinder font space issue fixed
    • :scissors: Callouts: Fixed Image Padding in Captions Callout
    • :scissors: Callouts: Fixed Table callout to overflow table properly
    • :scissors: Callouts: Fixed Aside with Original Callout styling applied issues + alignment issues :iphone:
    • :scissors: Callouts: Fixed Callout coloring not applying colors correctly
    • :scissors: Callouts: Fixed Metadata not applying no-strong properly
    • :scissors: Alt Checkbox: Strike toggled now works properly
    • :scissors: Alt Checkbox: Fixed snippet for Minimal Theme compatibility
    • :art: Alt Colors: WOTC Border line colors fixed for style settings overrides
    • :art: Alt Colors: Pathfinder colors adjusted for warmer tones
    • :electric_plug: Various Complements plugin: Fixed plugin styling clashing with ITS Styling Hidden Status bar & Tab alignment issues
    • :electric_plug: Kanban plugin: Fixed missing list bullet, checkboxes, and unresolved link colors
    • :electric_plug: Folder Note plugin: Fixed active folder color
    • :electric_plug: Initiative Tracker plugin: Fixed flair colors
    • :electric_plug: Fixed paper shadow toggle applying to plugin styling improperly
    • :electric_plug: Quick Explorer plugin: hover color styling fixed
    • :toolbox: Removed Note Text Size slider from Style Settings (Use the Obsidian default slider)
    • :toolbox: Document toggle styling applies to desktop and tablet
    • :toolbox: Roundess slider also affects blockquotes (reading mode), Infobox callouts, tabs and tables
    • :toolbox: Fixed Text Highlight color targeting incorrect variable
1 Like

Hi! I have a problem trying to embed wikilinks into the infobox. When I do a normal wikilink, it works great. However, when I put “|” to change the visible text of the link, it breaks. Here’s the markdown:
image
Here’s the result:
image
Can this be fixed on my or your side? Thank you!

You might need to escape the pipe (|) with a backslash (\|) so the pipe separating the note’s title and its alias isn’t confused with the pipe separating 2 fields in a table :blush: .

At least, this is how it works in any tables in Obsidian :blush: : If you want to use a wikilink and display an alias while in a table, you need to use something looking like :

[[Note's title\|Alias]]

Thank you!! Works perfectly!

1 Like

No problem :blush: !

I love everything about this theme and I have used it since it came out, and even if I temporarily switch and try other themes, I always go back to this. I love the fonts, the sizes, the way it shows latex, literally everything, except the color schemes. Do you have any plans to add more color schemes perhaps, with more colorfullness similar to anuPp/minimal?

ITS Theme v1.2.00 Update

Added

Added Single Accent Color alt color scheme option!
Obsidian_6mIEuCW9Y6

  • New Obsidian Table Editor styled to match ITS Styling
  • Style Settings
    • Added property key & value slider
    • Added Heading Top/Bottom Spacing sliders under Note > Headers > Advanced Heading Options
    • Added Style Settings Slider for spacing variables: heading, root list item, and list items
    • Added Canvas Card Brightness Style Settings Slider
  • :scissors: Callouts: Added list-global to properly make sub callout lists columnize
  • :scissors: Callouts: Added toggle to disable ITS Quote Callout default styling
  • :scissors: Image Adjustment Snippet: Added Rotation/Flip options
  • :scissors: Re-Added image adjustment caption options & Added Style Setting Toggle
    Note > Images > Image Captions w/ Alt Text

Fixed

  • Fixed Bookmark arrow alignment issue & List Bullet alignment
  • Fixed Hidden Numbered List in LP Issue
  • Fixed spaced lists styling
  • Fixed Tag Pane tag icons (hide hash when containing sub tags)
  • Fixed Canvas placeholder line height issues
  • Fixed Darkmode Canvas color
  • Fixed Progress bar styling
  • Fixed missing Outline H styling
  • Fixed Table Header Text not changing table header text colors
  • Fixed Property Focused background color
  • Fixed Search result arrow colors
  • Fixed Metadata Title Positions not applying
  • Fixed Mermaid Styling overriding custom diagram styling
  • Fixed HCL Sub & Sup Issue (sorta)

  • :scissors: Callouts:
    • Fixed Quote callout styling specificity > & no-title specificity issue
    • Cards dataview height issue with new Obsidian update
    • Fixed uneven Column, Cards, and Kanban gap/margin sizing
    • Fixed Callout Column Flex margin issues
    • Upped Cards & Columns number limit to 9
    • Fixed text-small attribute not working
    • Fixed Callout Kanban Task alignment
    • Fixed Callout Kanban Title Colors
    • Fixed Kanban Lightmode Title Color Issue
  • :scissors: Alt Checkbox: Fixed alt checkbox with normal subcheckbox background color disappearing
  • :scissors: Image Adjustment: Fixed left aligned images & lists overlapping (toggle in style settings to turn off fix)
  • :scissors: Embed/Image Adjustments: Fixed Embed Adjustments overriding Image Adjustments width sizing

  • :electric_plug: Style Settings: Fixed Style Settings spacing and colors
  • :electric_plug: Style Settings: Fixed Style Settings Search result text coloring
  • :electric_plug: Dataview: Fixed Dataview Table Header Colors in Lightmode
  • :electric_plug: Dataview: Fixed Default Bullet Dataview Issue
  • :electric_plug: Iconize plugin: Fixed icon issues from new Iconize folder update
  • :electric_plug: Image Toolkit Plugin: Fixed Image Toolkit plugin Styling issues
  • :electric_plug: Templater: Fixed Templater Syntax Highlighting Styling