The reply button has turned out to be the hardest thing to fix using CSS.
Its making the reply button brighter when a post is hovered/focused on. Its also making the word Reply more bold on hover which I don’t like.
Its also changing the font color on direct hover, but only changed the Icon not the word Reply, so need CSS to unify the default.
There are so many effects happening on the Reply button, there is also some type of bolding/or heavier font being added.
This is the code I have, there is still a font enlarging effect happening, I managed to get rid of the brightening effect:
.post-info.edits .btn-flat svg,
.post-info.edits .btn-flat .d-button-label,
.topic-post .post-controls .create svg,
.topic-post .post-controls .create .d-button-label {
fill: #7b7b7b !important;
color: #7b7b7b !important;
}
/* 2. Hover state: Change to e0e0e0 */
.post-info.edits .btn-flat:hover svg,
.post-info.edits .btn-flat:hover .d-button-label,
.topic-post .post-controls .create:hover svg,
.topic-post .post-controls .create:hover .d-button-label {
fill: #e0e0e0 !important;
color: #e0e0e0 !important;
}
/* 3. Kill the lightening/glow and slow transitions */
.post-info.edits .btn-flat,
.topic-post .post-controls .create {
opacity: 1 !important;
filter: none !important;
transition: none !important;
animation: none !important;
}
/* 4. Stop scroll-highlight from washing out the colors */
.topic-post.highlighted .post-controls .create,
.topic-post.highlighted .post-info.edits .btn-flat {
filter: none !important;
opacity: 1 !important;
}
It would be pretty cool if you could modify the icons/font/text through some type of built in styling. As I have so much CSS making the default look good for my needs.
I had this looking better but I had to remove the CSS I had because it was causing so many problems due to the double buttons and all the different styles being applied.