Hi all,
I’m new to Wappler and so far I’m loving it. Forgive me because this is going to sound really basic and stupid, but I need some help understanding the Theme Manager vs. the Design pane vs. the Styles pane.
I set up my brand colors and fonts in the Theme manager and made sure everything looked great in the Theme preview page. Then I created a nav bar on my page and in the properties set the Text color of the nav items to ‘Primary’. It was a bit misleading at first, because the interface still showed the default blue for primary so I assumed that the purple I had set as my primary in the Theme manager wasn’t saved. I decided to select the text color as Primary nonetheless and was happy to see that my nav items turned to the purple I had set in the Themes manager. So far so go.
However, when I open the page in the browser, all my nav items seem stuck to the left right (when in fact they should be on the right – only the logo is supposed to be on the left) under my brand logo. Furthermore, all the nav items have what a default serif look with an underline (Times New or something) despite me setting my Base font to ‘Inter’ in the Themes manager.
I looked at the Design tab and see “No user style file attached” and after reading the documentation about the Design panel I understand that this is only for attaching an external css file if I choose to do so. The CSS Styles panel as I understand it would allow fine control to all CSS properties on the page.
I’m more comfortable with sticking to the easier App Structure properties panel but what I thought I set there doesn’t seem to show up when I open my page in a browser.
I’ve taken the Getting started with Wappler course by Ken Truesdale (which is an awesome course by the way), but I haven’t been able to find any tutorials explaining styling in a lot of detail. Appreciate any help on this aspect. Again, apologies if this is very basic – I’m just starting out with Wappler.
Thanks once again.
Last updated: