V18 project, css, design mode

So I was looking forward to using v18 project mode and CSS - but just discovered that the CSS definitions are not applied in the form editor (???). Am I missing something? Is there a trick that I can use so I can actually see what my forms will look like without switching to runtime? If not, is there a timeline for when this will be implemented?

Thanks

bill

Hi Bill,

Like it is explained in the Summit 2020 CSS session, it is available only on ‘runtime’ execution, that means, to see what your CSS is, you have to execute.
I engage you to have a look on this session, very interresting.

Patrick

Ah, I have started going through the Summit sessions, but I did not see this one yet. Sorry.

bill

Maybe one of this two links (i did not found more)?


https://blog.4d.com/project-databases-style-sheet/

2 Likes

You’re faster than me :wink:

1 Like

I watched that presentation yesterday and was confused about how this would work in practice as the form editor is WYSIWYG. Came to the conclusion that CSS was more of an override than to be used for positioning and layout.

Really appreciate the effort 4D have made to put the summit materials online.
Paul

Having now watched the presentation, I’m a little surprised that there has not been more of a negative reaction to the lack of support for CSS in the form editor. From my POV it renders the form editor nearly useless, if you want to use style sheets to get consistent formatting. And if the form editor is broken in this way, then I can’t use project mode, which means I can’t use Git, or classes in v18R3, etc etc. We have a mid-size application that we were planning on moving to v18 project mode, but there’s no way that’s happening until this is fixed.

bill

I have been working a little bit on forms in Project mode. A couple of early observations:

  1. the preview of the form that appears in the Explorer window seems to apply the CSS. So you get a glimpse there.
  2. designing forms this way is more like building HTML forms: do some stuff, run the form, adjust.

So this is going to shepherd us into a different way of thinking about and building forms. To me making forms is more abstracted from the database operation than before. By that I mean the way we could do a lot of the data structure design work while building a form. That sounds kind of useful but if you take a look at some old projects where there is literally thousands of lines of code in form and form object methods I think it will illustrate the problem with this.

Yes, the CSS support is a way to override the appearance and style properties of a widget. In the traditional approach, we are so used to creating a Stylesheet (Style/Font/FontSize) and applied to any object. With the project mode, we need to change our mindset.

Every designer want to see the right look and feel of the font while he/she is in the Form editor. Therefore, it is better to set font, fontSize and fontSyle directly in the property list. If you want to override appearances (including other properties), you can do so through CSS.