Text shadow in menu bar with Chroma

Big White Duck
1

@tav

Hello Andrew,

I recently discovered that Header Pro allows to add a shadow to the text to e.g. help with the visibility on a patterned background. I am wondering, whether it is possible to achieve a text shadow in a transparent menu bar, where the format is controlled by Chroma Pro (some menu bar format definitions would have it, others wouldn’t).

I found on the web that a text outline or shadow can be created with some css code, but I am at a loss whether I can add such code to the page to affect the top bar (I am using Foundation) and how to make it specific to only a particular Chroma Pro setting.

Your stacks are unbelievable - in combination with the demos you provide, they are an endless resource to learn. Hence thank you for your support, whether there is a solution to my question or not.

Gerd

2

If you have some shadow code then the selector that you need is:

.top-bar .menu a{
   text-shadow:   your shadow code here
}

To make it specific to a particular Chroma Pro fixed style then you would just define a user style (this may be the default style in the main stack settings or in a fixed style child stack depending on where you want the shadow to appear)

CloudApp

3 Likes
3

Thank you so much - I tried it, and it works like a charm. You amazed me again with the incredible power embedded in your stacks, after being helped with the first step.

Cheers

1 Like