Not a bad a idea. Lately I’ve seen a few topics pop up related to the design panel and the attached css.
1 Like
Our issue is actually not that we don’t understand it, our issue is that on our machine it’s buggy as hell. and we can’t find out what is the right setup.
Should we install 3.99 again and start fresh? 4.0 and nodejs has been a nightmare so far. every day a new bug - not sure if this has to do with that we are on Macs.
We really love the idea and transparency of Wappler - we can see in the log windows what is happening etc. but if is constantly fails to work as it suppose to then we will give up. we wasted already a week to get the environment to work - we were short before building it in php but as we need a phone app in the later state we think this is not the way to go…
really frustrated today… sorry…
Maybe if you just report step by step what is wrong we will be able to identify the issue(s).
Saying - “there are bugs”, “it doesn’t work”, “not linking the theme” really tells us nothing.
Please log your bugs with step by step instructions of what are you doing, what is not working and how do you think it should work.
1 Like
Wow - it’s not particularly one project - we made like 8 test projects now which all result in losing the CSS at one time or the action panel doesn’t show up etc…
We are happy to make a screen recording of such a scenario. But I can’t believe that we are the inky one struggling or as said maybe it’s the mac/docker setup that is the issue…
We doing this since 15 year and just felt a bit a insulted by hey newbie you have to give us the right formation why our software dosen’t work…
We are particularly interested by this so called ‘losing the CSS’ - it will really help us if you just provide a few steps explaining what are you doing and where is the CSS being lost.
Ok sorry we really frustrated about this.
What we actually looking for is the “safe setup scenario” you guys recommend for a mac with nodes.
Our setup at moment is:
Mac 14
Docker local and as Production at the host
- nodejs/postgresql
Wappler 4.0b13
(we already posted a bug report about the action window disappear on us)
Also which impact has the root directory for all projects? We have the feeling if that is not always the same it causes issues.
Which npm should be installed - the default installation give us a lot of warnings.
Anyways we will record one complete new setup frame a-z and hope we find together a solution - cause we are really excited to start development with wappler!!
Cheers
This all looks fine, and does not have any impact on the way the Design panel works.
OK with version 14.0.b13 we keeping out design panel - but still sometimes it runs out of function… and we might found why… there is a name corruption in the classes going on…
here the example when I saw it…
We actually delete the data-table as it always used the same query even we changed it… anyways.
We added a new one and added the table-head style we made before and it worked. but we had before already that button above didn’t reacted to the design panel - so we test it and it still didn’t but we regconized that the was a small text add-on in the class w-100 which we deleted - and it worked…
then we did the test with the image and it had the same - here the recording of the effect…
Hello, I am really confused by half of your explanation:
Then, saying that:
No, there is no name corruption, w-100 is a standard Bootstrap class.
I just tested this using the same layout block you added and added padding to the image - works perfectly fine:
Can you confirm this style (padding you are adding to the image) works in the browser and only has issues in design view?
Also have you tried to hit the refresh button in Design View when style doesn’t seem to work?
In my opinion, you are relying too much on the Design panel. Most of the styling can be done using the App Structure panel.
Have a look at this video. Not once do I go to the Design panel
Hi Ben, while i don’t disagree with you, you should be able to use the Design panel without issues.
That’s why i am trying to understand what exactly is happening with @yellowsnow page(s) and whether these issues are only design view related, do they get fixed with a refresh there or also affect the page in the browser.
1 Like
Hi Ben, you are absolute right.
We are mostly testing Wappler to be our “go to”-development tool and need to make sure that it does what we need and is stable.
We really have a low code / no code tool testing marathon behind us and Wappler is the first tool that makes sense to work with so far. (We will make a review round at one point - it’s an eyeopener how good Wappler is compared to the other tools out there and accord to our list we tested 32 of them)
But we have stability issues that worries us but seem to be fixable, specially with a good community and support behind the product.
About the design panel…
The design panel disappearance or the not working of it was more an identifier for us that our export will not work as expected.
With NodeJS, we experience that some times the export does not use the CSS and the online design would be like a plain html side or sometimes it still looks like the “old theme” and also the animations are not working (we added a bump in effect to our graphic to test that" - the identifier for that effects in the editor is that the design panel does not work properly, if that doesn’t work also our deploy does have issues.
It feels like something in the background starts hanging and everything after does not work as expected. the issue we having is that that just happens and we can’t recap the situation. For example if it’s stuck we can’t change the source of a generate bs5 table, once the effect is gone everything works again.
The thing is we obviously not using the tool long enough to some times identify that that actually should had worked and wasting a lot of time to just find out that actually nothing works. We had for example a second time the same page in the designer - the effect was that nothing worked on that page we were working on - we assume that there was a write lock on the first and the second should had never open but that is just assuming …
Anyways yesterday we wanted to recreate an error and it worked perfectly for 5 hours so we actually started developing and it is fun!!! until, the system got stuck.
Im pretty sure that hick-up will be found and we will be happy developing.
Here on question though - WHY ARE THERE 2 DESIGN PANELS? In any other tool we used we would just add a new class that would activate all available parameter and would just add them to a new file in the background. For us there should be no design parameters in the app tab they should be all in the design tab and if you add a new class you write in the “attached” css file. Then we would have that in the side double view with the app tree and we are the most happy campers 
All no-code and low-code editors lock the developer into a fixed design framework. This means that, if the developer wants to create an effect that the framework does not cater for, then it is bad luck.
This is where Wappler rises above all low-code editors.
For newbies (to Wappler), most design development is done using the App Structure panel. This binds the user to the Bootstrap framework. But Bootstrap has its limitations. It is easy to add a margin from a choice of 0 for no margin, 1 for a margin of 0.25rem, 2 for a margin of 0.5rem, 3 for a margin of 1rem, 4 for a margin of 1.5rem and 5 for a margin of 3rem, where a rem is approximately 16px.
If I want a margin of 160px (about 10rem) then I need to go beyond Bootstrap, in which case I would go to the Design panel or to the Styles panel.
In this video, I show 3 versions of a card, one for newbies, one for intermediate and one for advanced users. You will see that I progressively use all three panels.
3 Likes
we love the video - good job
1 Like