chrisgurney/obsidian-note-toolbar

Box shadow appearing overtop of text

chrisgurney opened this issue · 8 comments

Discussed in #88

Originally posted by XMB-7 June 22, 2024
Currently when applied border or even no-border, the border always exists, so sometimes it looks like a strikethrough.
Maybe a 100% transparent border would help to prevent this.

image

Here is the line in styles.css that adds this line across the text:

.cg-note-toolbar-bar-container {
   ...
    box-shadow: 0 0 0 1px var(--cg-nt-tbar-bg-color);

Note to self: Two commits to look at when I'm able to get to this:

% git log -L 682,682:styles.css

commit 15a3b88afb9c87b3b0e84e94875a9a96a3d608d4
Author: Chris Gurney <chris@chrisgurney.ca>
Date:   Wed Apr 17 22:20:11 2024 -0400

    fix: missed Style Settings plugin color in container box-shadow

diff --git a/styles.css b/styles.css
--- a/styles.css
+++ b/styles.css
@@ -450,1 +450,1 @@
-    box-shadow: 0 0 0 1px var(--background-primary);
+    box-shadow: 0 0 0 1px var(--cg-nt-tbar-bg-color);

commit b0b7cd0d94401eada1666e8eb0b536a78f354a3f
Author: Chris Gurney <chris@chrisgurney.ca>
Date:   Tue Mar 26 06:07:10 2024 -0400

    fix: callout hover box-shadow past edges of sticky toolbar

diff --git a/styles.css b/styles.css
--- a/styles.css
+++ b/styles.css
@@ -303,0 +300,1 @@
+    box-shadow: 0 0 0 1px var(--background-primary);

@XMB-7 Can you confirm if this is specific for you to autohide? I'm investigating now.

@XMB-7 I've fixed this specifically for autohide toolbars in 1.9.5. If that was your problem, try it out and let me know if it's solved for you. (Otherwise, let me know what other configurations are causing this problem for you.)

Thanks for your time and effort. It works well. However, I think that binding this feature to no-border instead of autohide would make more sense. It's more relevant to setting no-border with sticky, rather than autohide.

Before fixing:
recording

After fixing:
recording

@XMB-7 Thanks for confirming!

Regarding your comment, the particular box-shadow that was an issue here was meant to fill in a gap around the toolbar, and just used the background color to do so. It just wasn't honoring the transparency of the autohide property, and was not necessary to show if the toolbar's hidden.

I'll close this issue as it sounds like it did solve the underlying problem. Thanks again for logging it and testing!

Sorry that I didn't describe the problem precisely, since I have little knowledge on CSS. What I really mean is that without autohide the demand still exists.

With the following style settings, the problem also occurs.

The same when

So I think the modification on autohide should be migrated to sticky when combined with border/no-border.
Since if only autohide selected without sticky, when scrolling down the toolbar never shows up, then there is no issue at all to fix.

Okay I'll take a look. Thanks for the details.

On further thought, I believe the box-shadow change should only be made to apply to the bottom, not all the way around.

@XMB-7 Thanks for your patience.

I just removed that box-shadow in the latest release -- I honestly can't recall why it was there in the first place, even after re-reading my comments; hopefully doesn't bring up any regressions.

Anybody reading this can use Style Settings to adjust padding and such if needed.