Good evening,
I’m trying to make all the buttons on my forum more rounded square. I’ve used the CSS within CSS/HTML:
.btn { border-radius: 5px; }
This works in the preview tab, but it doesn’t work in the live forum after including the component on these themes.
Currently on the forum:
After using CSS:
Here on Meta, using the Fully theme, the buttons are rounded. However, using this theme on my forum, they are not.
Try this theme-component
This one will add options to round other things like quotes, images and more
My God! I’m always telling my users to use the search function before creating a topic!
Now I’m guilty of the same thing! I was searching for “rounded buttons.” I was more complex than it needed to be. I should have just searched for “buttons.”
Well I used this search term.
"#theme-component Round"
You can also do
:root {
--d-button-border-radius: 5px
}
or
:root {
--d-border-radius: 5px;
}
if you really want rounded corners everywhere
Hmm… again, both only seem to work in preview mode, even after refreshing the forum and logging in and out.
After you install a component & To apply it you need to add to your themes, then need to refresh the page.
After that is should be visible logged in or not
Preview is just for testing without any themes active
Did you add any other components that also customize the buttons?
Sorry, I was responding to @awesomerobot’s post with the CSS.
Same with creating a custom component. After you save it you need to add it to your themes.
Done this also.
Just looking at @Moin’s response and can’t see anything that will conflict with the custom component. I’ll take a deep dive into “Discourse Button Style.” I did have this before, and to be honest, there were a lot of empty boxes, and my ADHD brain couldn’t cope with it, haha! Just a simple CSS would work for me (if it did).
I do have this, yes. So this is conflicting with the custom component?
So I’ll have to manually create CSS for the buttons, avatar, and images that I’m wanting/looking at.
There is a setting button settings enabled, so probably
I need to make sure I check all options before moving to another component.
Both
were set to 0px.
Sorry for wasting time! But good teamwork!
This is nice. I think my component currently covers most buttons but I didn’t know about this approach, thanks.
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.
