I want to use this with the air theme because I like the boxes and category setup
So you want no grey area cutting into the background image?
If so, you would use the same code above, but unset
the clip-path property.
html .background-container {
position: fixed;
top: 0;
left: 0;
height: 100vh;
width: 100vw;
background: url(https://d11a6trkgmumsb.cloudfront.net/original/3X/8/3/8352b68….jpeg);
background-size: cover;
clip-path: unset;
This actually looks really nice with your image!
Ahh gotcha thank you!
5 posts were merged into an existing topic: Search banner theme component
how to apply this code ? where to put it exactly please
Feel free to read through the following topics to get a better sense of how to customize the look and feel of your site
As well as these:
Thank you so much @jordan-vidrine so I have implemented the changes and this may not be on the theme necessarily but my versatile banner, but the background is duplicated across my versatile banner as well and this is the only change I made on discourse air
left: 0;
height: 100vh;
width: 100vw;
background: #003366;
clip-path: ellipse(148% 70% at 91% -14%);
background: url(https://i.ibb.co/GCcS8Zw/Abstract-futuristic-Molecules-technology-with-polygonal-shapes-on-dark-blue-background-Illustration.jpg);
clip-path: unset;
}
}
This is how my page looks now: is this something I need to change in versatile banner or something on the air theme?
I do not have a background image or color set for versatile banner.
Any suggestions?
You can try background-size: cover;
or play around with variations on that.
More info here could also be helpful background-size | CSS-Tricks - CSS-Tricks
Ahh gotcha, will do. It is the sizing when I zoom out the image just repeats:
You think I should remove the height and width padding too?
I’ll play around with the background-size: thank you!
.background-container {
position: fixed;
top: 0;
left: 0;
height: 100vh;
width: 100vw;
background: url(https://i.ibb.co/GCcS8Zw/Abstract-futuristic-Molecules-technology-with-polygonal-shapes-on-dark-blue-background-Illustration.jpg);
background-size: cover;
clip-path: unset;
Works perfectly thank you!
Does anyone know how to change the header text size and color in the front page?
I’d direct you here to get a better sense of how Discourse works, and how to customize areas of the site.
A post was merged into an existing topic: Dark / Light mode toggle component
any idea how to change this font color as we create a component for that ? this issue only in mobile …so component can be only for mobile design
search button
footer search
Hmm , it’s hard to tell from your screenshot what page you are on, or what specific font you are referring to. In the image you have shared there are 4 or more different text items that could possible be customized.
You seem to be interested in customizing a good bit of Discourse for yourself, which is awesome
I would suggest to read through the following topics to get a better sense of how to customize the look and feel of your site
As well as these:
Jordan, i see your above and last messages is all mention to read more, i understand that and i respect it, but please note i’m not designer and i spend almost a week customize the theme with my basic knowledge… and i’m not a rich to spend $500 customize on my “not profit community”.
so consider assist us in this will be apprecaite it not for me, for other user community who will definitely like your theme with them basic knowledge in customization.
The best thing about Discourse is while there is of course a learning curve (as with anything technical these days), you are highly capable of being able to customize the things you wish to customize. I promise!
We write these topics to help our community to learn how to do things on their own, and sometimes when things get a little too difficult, we are always here to help.
That being said, the help you are asking for can definitely be attained by reading through the topics I linked earlier!
Is it possible to bring back the number of views alongside latest activity and number of responses?
You should be able to do so in a theme component. I’m not at a computer right now, but I’d you inspect the topic list element with a browser inspector like chrome, you should be able to see which rows have been hidden with css. You can then target those rows to make them visible with a custom theme component.
Hi, I use Air Theme with Topic List Thumbnails Theme Component - theme - Discourse Meta theme component grid mode. However, the topic arrangement is different grid view from other theme did.
for example,
other theme with the component,
Is it a issue or is there any suggested theme component to show the thumbnail of topic?