Having 90% solved my background image problem *(I abandoned the idea of
having the background change when a tiddler is opened...)*, I'm back with
another small dilemma (this one much more minor, though :-) )
As can be guessed, I have begun using background images in my TW.
With them, however, comes a slight problem; the solid color background of
the tiddler-frame in the Story River covers up the page background
completely, so the text, etc. of the tiddler remains readable, but the
transparency of the Sidebar causes its links to be unreadable with some
lighter-colored backgrounds. I *(after much tinkering and searching)*
found *.tc-sidebar-scrollable* and added a 70% opaque solid-color
background image to it:
.tc-sidebar-scrollable { background-image: url(
"https://s5.postimg.org/lyaazi9tj/Side_Bar_BGBlue070.png";); } /* SideBar BG
Blue 70% */
It looked beautiful, and created the exact effect I was looking for, making
the links visible yet still allowing the page background to remain visible
enough. (I made several of them, in different colors.)
*Edit (already!):* Discarded the use of external graphics in favor of a
simple rgba background-color applied to either .tc-sidebar-scrollable
.tc-sidebar-scrollable { background-color: rgba(0,0,255,0.6); } /* SideBar
BG Blue 60% */
or .tc-sidebar-header
.tc-sidebar-header { background-color: rgba(0,0,255,0.6); } /* SideBar BG
Blue 60% */
(Thank You to *Eric Shulman* for providing the idea and syntax in This
Thread <https://groups.google.com/d/msg/tiddlywiki/PdQhXudRMOE/6cizxgdnBQAJ>
:-) )
The problem: This *(external image or background-color)* has a caveat of
its own: whenever I hide the SideBar, the background image remains and
looks pretty bad...
How would I address this in the code?
I'm pretty sure it would take a conditional statement - I know there is a
"yes" or "no" value attached to the SideBar, so I'd need to only have the
background show when the value was "yes" (I see from watching it in the Dev
Tools in Firefox that there's also a *hidden="true"* applied to
*tc-tiddler-header* whenever the SideBar is collapsed).
I don't know the syntax, but it would be something like
.tc-sidebar-header >(when the value is "yes" or "visible") { background-
color: rgba(0,0,255,0.6); }
Help, somebody :-)
--Zaphod
--
You received this message because you are subscribed to the Google Groups
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/f5864a41-1fcb-4f57-9c38-b7b67de85dcd%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
![https://s5.postimg.org/lyaazi9tj/Side_Bar_BGBlue070.png"](https://s5.postimg.org/lyaazi9tj/Side_Bar_BGBlue070.png"){kind=link}