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.
No luck. Reset my framework to Bootstrap 5 local (removed and added again) and cleared my browser caches as well as disabled it in the chrome dev tools.
Here are some screenshots that may explain what I’m seeing.
In my opinion if you are just doing a testing/learning project I would use PHP instead of Node. Less layout/include stuff to deal with. Even I find node projects finnicky to deal with.
However with PHP, I’m not sure, you may need a local server such as WAMP or MAMP. I use MAMP Pro for years. Not sure if Wappler has a local server for PHP.
Thanks, Brad. I’ll give that a try. Yes, this was a test project and I just started a new one. Strangely it seemed to work just fine. The nav bar in the browser looks just as it does in Wappler so maybe I ended up breaking something along the way previously when tinkering around. Once again, thanks for all your patience and help.