Changing color of dates

bautawitch · Member · Jul 17, 2013 at 9:20 am
Copy link

Add topic to favorites
Hi!
I’m using the Handmade theme and I’m doing a lot of css changes to it to make it “mine” and beautiful! ;)

I have now tried one million times to change the color of the date shown on the side of my posts, in the hearts I’ve made! Would you please look at my css chart and see what I have done wrong. I want both the month and day to be white.
“.dater .day” and “.dater .month”.

My second question is how to NOT publish the exact time I publish my posts? The date is enough. The time is so uninteresting!

Thank you!

The blog I need help with is: (visible only to logged in users)
justpi · Member · Jul 17, 2013 at 2:00 pm
Copy link
1) To make the date white, add this:
```
.dater .month, .dater .day {
    color: #FFFFFF;
}
```
2) I don’t think you can target the time directly on this theme. A roundabout way to hide it could be this:
```
.wf-active .hentry .date {
    visibility: hidden;
    width: 80%;
}
.wf-active .hentry .date .byline {
    visibility: visible;
}
.wf-active .hentry .date .byline:before {
    content: "Posted";
}
```
Designsimply (the staff member responsible for answering CSS questions) can tell us if there’s a better way.
designsimply · Member · Jul 17, 2013 at 2:18 pm
Copy link
Looks good to me!

I think you can take out the “.wf-active” part to make it a little simpler and it will still work.
```
.hentry .date {
    visibility: hidden;
    width: 80%;
}
.hentry .date .byline {
    visibility: visible;
}
.hentry .date .byline:before {
    content: "Posted";
}
```
In general, I try to avoid using “.wf-active” when possible because it’s a class used by the Custom Design upgrade on WordPress.com, so writing CSS with it will work but finding ways to do the same thing without it means it would have a better chance of working properly for the same theme if it were to be used on a self-hosted WordPress.org site. It’s more portable. There are always cases where you may have to use it, but I tend to use the “!important” tag for those because it works just as well. Note that I would only use either of those if it’s absolutely necessary. if you can get away with a good CSS rule that works with out them, I think it’s better.
justpi · Member · Jul 17, 2013 at 2:53 pm
Copy link
Thanks Sheri. I thought .wf-active .etcetera overrides plain .etcetera, so I thought you had to use it. I’ll know better next time!
designsimply · Member · Jul 17, 2013 at 3:18 pm
Copy link
I thought .wf-active .etcetera overrides plain .etcetera

It does. The only reason I avoid it is that “.wf-active” might not exist in WP.org versions of the theme. If you did “.some-other-class .etcetera” that would be better. See what I mean?

It’s a pretty nitpicky point… on my part. :)
justpi · Member · Jul 17, 2013 at 3:35 pm
Copy link
Got it! And if I do need plain .etcetera but it doesn’t work, I add “!important” instead.
designsimply · Member · Jul 17, 2013 at 3:48 pm
Copy link
Yeah, that’s what I do if the parent is “.wf-active”
bautawitch · Member · Jul 17, 2013 at 5:06 pm
Copy link
You guys are the best! It worked like a charm! Thanx! :)

No items found.