⚠️ Unsupported HTML/CSS in the Rich Text component will completely break in the coming weeks

Some advanced users use custom HTML/CSS inside the Rich Text component to style their apps. This has always been unsupported and discouraged:

In the coming weeks we’re rolling out significant changes to Glide’s architecture to make apps faster, and eventually more compatible with new features introduced in Glide Pages. This will completely break all custom HTML/CSS in the Rich Text components. If you rely on this, we strongly encourage you to stop using it now.

13 Likes

Do we expect these rich text components with HTML/CSS to just being disabled? OR they’ll still affect (now negatively) the app’s UX?

1 Like

The rich text will still show! But the styles should have no effect.

3 Likes

Oh no! some of my most popular apps use custom CSS. Ideally, the lost functionality would be replaced with native features.

In particular it would be great to be able to:

  • Fix buttons to the bottom of the screen.
  • Modify the look of the stopwatch so it displays the time only (without the dial)
  • Enable more than 4 columns in lists/cards

Sample 1: Fixed navigation and modified stopwatch

Sample 2: Inline list with 7 columns

Any plans to add this functionality?

4 Likes

My app uses an HTML table with some styling on the table itself. Can I assume that the HTML table will stop working and/or lose it’s styling, or does this primarily affect styling on native glide components?

1 Like

The Jeff’s HTML tables!! WTF?? :woozy_face: :face_with_thermometer: I have almost 4-6 APPs using them

1 Like

damn, that calendar view is super neat!

1 Like

We all knew that this day would come. Farewell to custom components, I learned HTML/CSS basics thanks to you. We had good days :weary:

Many thanks to David for warning us but not just turning it off, appreciate that! Looking forward with excitement for incredible new UI features in Apps :sparkles:

1 Like

LOL. Of course. I just made some changes to an app based on a video by @Robert_Petitto on app navigation. I had struggled with making my app more intuitive, and this solution works beautifully.

I have an inline list styled as a menu, but the thing that makes it work seamlessly is being able to make it “sticky” at the top so as the user scrolls the other inline list on the screen, the menu stays at the top. Floating buttons, no matter what ICON I selected, were too hard for the users to catch on.

Can we get a “floating” inline list? Can we get “floating” other components – with the option to have them float on the top or bottom?

Merging the two development environments (apps and pages) will be beneficial in the long run, but it would be nice to have some recourse for at least some of the features people have become accustomed to “working around” using CSS.

For myself, I’ve shied away from custom CSS except in very rare circumstances where I could not figure out how else to do something in an intuitive way.

I think the other thing I’ve used it for is to hide the buttons at the top of a form (the back and submit buttons, etc.).

Luckily, my method of doing a confirmed delete only relies on component visibility and not turning on the “allow the user to delete” checkbox. I think adding checkboxes like that for the other “standard” screen objects would be good.

And before someone says, “Use a custom form” – well, it would be a LOT easier to convince me of that if we could RE-USE custom forms! :slight_smile:

2 Likes

The only thing I really like CSS for is setting the image as the background for the Cards layout in apps. This let me use a solid color as the image, then set it to fill the background of the card… Giving a really nice appearance.

Card background colors in Apps and Pages would be great, so hopefully this comes back as a native option in the future once everything settles.

2 Likes

This new update should be implemented on new apps from now onwards. A couple of my apps use very basic CSS, yet very important for the functionality.

But I really support this decision. Glideapps should solely be known as NO-CODE NO-CSS NO-HTML tool :smiley:

1 Like

For clarification, will the “External Code” feature that needs to be inserted with Rich Text still work? I’m specifically referring to this fantastic one by ThinhDinh that I use extensively, because it is related to formatting. Thx.


2 Likes

I expect that one to be affected since it does have CSS inside it.

1 Like

If it works the same way as Glide Pages, I expect the table to lose its styling.

2 Likes

Darn, I thought that the External Code items were legit and not a CSS sleight of hand. :thinking:

1 Like

External Code columns have nothing to do with CSS–they are JavaScript columns that calculate values only.

4 Likes

Thank you David!!!

As David said, it’s a JavaScript snippet intended to be used to calculate values. In this case, what you’re feeding into the column are some links, and I used JS to return a HTML + CSS code snippet to display on the screen, so ultimately it still needs a bit of CSS to look like that.

:scream:

Oh no! I have MANY client apps using CSS to style card layout that will completely decimate the UI if turned off…

Not sure how I’m going to keep my previous customers satisfied. It’s going to cost me a LOT of time to fix the dozens and dozens of app that I’ve customized over the past couple years.

17 Likes