[FR] The ability to draw a horizontal line without the icon that ITS theme automatically adds.

[Z3DT]

Is your feature request related to a problem? Please describe.

I want to draw a horizontal line that is just a horizontal line, without the icon

Describe the solution you'd like

I way to override <hr> and/or --- to draw a line without symbol for situations where I just want a plain horizontal line, or some other command I can use to draw a horizontal line. Maybe there already is one that I am missing, I am honestly sort of a noob when it comes to HTML and/or CSS.

Alternatively, (allow us to) re-enable the option where applying formatting to a header turns that part of the header into the default text color.

Describe alternatives you've considered

I'm currently using a first level header to draw the line, but I want my text to display (in my night mode, Pathfinder color scheme ITS theme) to display as white, but export to black on a PDF. Because I force that bit of text to be white (with HTML), it also exports as white when exporting to PDF. Previously applying any formatting, such as bolding, to a header turned that part of the header white (export as black) which apparently was a bug and has now been fixed since a recent update (I updated today for a the first time in a while).

Manually "typing" a line by just having a bunch of underscores sort of works, but doesn't scale with my screen width or exported page width.

[SlRvb]

I imagine the hr-no-icon cssclass is what you want if you want it on a per page basis or the style settings toggle to disable the icon if you want it globally, it's under: Note > Horizontal Line > No Horizontal Line Symbol

As far as your heading request I'm not sure what you mean, if you want to change the color it would probably be best to use the style settings option and change it for both light and dark themes, unless you want to also do that on a per page basis, then a cssclass targetting the --h1-color variable for both .theme-dark or .theme-light.

[Z3DT]

I imagine the hr-no-icon cssclass is what you want

Applying a cssclass would apply that to all horizontal lines in a note. That's not what I want. I like the symbol. I just want to apply it to some specific horizontal lines.

I've got an old screenshot of how markdown formatting used to change the color in ITS theme. In the picture below, the symbol is a piece of italicized text. As soon as I italicized it, it set that piece of the header (which is a level 1 header, normally yellow in the Pathfinder color scheme) to return to the default text color (white for dark mode, black for light mode). This happened with just normal text that wasn't calling on a CSS snippet too, I just don't have any screenshots of it.

With a recent update, I don't know which one specifically since I updated last night for the first time in a while, this behavior was "fixed", and text formatting didn't change the color back to the default text color anymore if your bolded, italicized, whatever'd it. Sorry I don't have a better screenshot.

I'm basically discussing two separate approaches to the what I'm trying to achieve, which is to make a header used for feats and items in Pathfinder 2e so I can make good looking homebrew in Obsidian. Currently, I'm using HTML in my notes to do this (and again, I'm a huge HTML noob. I basically cobbled this all together in a few hours from googling pieces of code and putting it together. I have never done this before, so please explain stuff to me like I'm 5)

<h1 style="text-align:left;font-family:Barlow Condensed;font-size:1.5em;font-weight:700">
        FEAT NAME IN ALLCAPS <span style="font-family:Pathfinder;font-weight:400">⬻1 ⬺2 ⬽3 ⭓Free ⬲Re</span> 
            <span style="float:right"> 
                 ITEM OR FEAT LEVEL
            </span>
</h1>

Barlow Condensed is the (lookalike) font for the heading, Pathfinder is the font that turns the unicode symbols into the Pathfinder action icons for those feats that need it. Placing that all in a H1 drew a horizontal line below it without spacing, immediately under the header itself stretching the full width of the page. However, as it stands, the text is now outputting as yellow. Before, I had a <b> tag in there to turn the text bold, which also made it default color. As I mentioned, this no longer works. I can't set it to white either, because then it would also output as white when exporting as PDF.

The two possible solutions to this problem I have found is either

a. have that block not be in a header, leaving the text the default color but missing the line, then drawing the line manually with <hr> (which sort of works but draws the line with some space between the header and the text that I really don't like the look of and don't know how to fix). If I do what you suggested and add the hr-no-icon cssclass to the frontmatter, this makes ALL horizontal lines in that file miss the symbol. I don't want that. See below

OR

b. somehow setting the color for that specific h1, and ONLY that h1, to be the default color (because I still want other level 1 headers to behave normally and be yellow). This is how having it in an h1 currently looks:

Basically, both your suggestions work, but I don't want a per-page basis, I want a per-header basis.

[Z3DT]

I think I have found a solution to my problem.

Putting it all in a div instead of h1, then manually drawing a line in that div with border-bottom: 2px solid red (and fiddle with the color a bit) removes the necessity of needing it to be a header, and of needing to change whether the icon is in a <hr> on a per-line (or even per-page) basis.

The full block of HTML now looks like this. I have been told you an use CSS to condense it on the page, but seeing exactly on the page what it's doing by looking at it is something I prefer.

<div style="text-align:left;font-family:Barlow Condensed;font-weight:700;font-size:1.5em;border-bottom: 2px solid rgb(139,38,45)">
    NAME IN ALLCAPS <span style="font-family:Pathfinder;font-weight:400">⬻1 ⬺2 ⬽3 ⭓Free ⬲Re</span>  
        <span style="float:right"> 
             ITEM OR FEAT LEVEL
         </span>
</div>

Sorry for having wasted your time with my ignorance 😅 I learned a lot, though.