Hi, see pic below. I want the circled part to be a different color.
In Minimal theme, how can I have the Announcement Bar (Header Bar?) TEXT be two different colors? Thanks in advance!!
Sorry you are facing this issue, it would be my pleasure to help you.
Welcome to the Shopify community! ![]()
Thanks for your good question.
Please share your site URL,
I will check out the issue and provide you a solution here.
Can anybody help on this?..
@KetanKumar Thanks for the reply.
my site:
code i’m wondering about:
/================ Module-specific styles ================/
.header-bar {
@include clearfix();
font-family: $accentFontStack;
font-size: em(14px);
font-weight: $accentFontWeight;
font-style: $accentFontStyle;
background-color: $colorTopBar;
color: $colorTopBarText;
padding-top: 2px;
padding-bottom: 2px;
text-align: center;
@include at-query($min, $large) {
text-align: right;
padding-top: 8px;
padding-bottom: 8px;
}
a,
button {
color: $colorTopBarText;
&:hover,
&:active,
&:focus {
outline-color: $colorTopBarText;
}
}
@KetanKumar I feel like this might be a step in the right direction, but would change all of the text color. Not just the last part of the text:
.header-bar .header-bar__module.header-bar__message a { color: #D373A9 !important;
}
can you please share announcement bar code