Interesting HTML functionality
So I have a dashboard with three formula fields that show HTML tables. Here are the Leagues and their respective colors.
Now on my dashboard the GCL League looks like this:
And the LN League looks like:
So far so good, but when I switch to MLSJ, I get:
Not good. It shows the color of the League that was selected right before it which was LN this time.
You sharp eyed troubleshooters will notice that not all three tables are shown when MLSJ is selected. I hide the other two because they are not needed when I select MLSJ.
If I unhide the Round 2 table then everything works when I switch to MLSJ.
But I don't want the Round 2 table to show. So my current "fix" is to have a formula field at the end of form that loads the css I need. It does nothing else but keep the css alive. For some reason hiding the last formula field with the desired css stops previous formula fields that use the same css.
My css is defined in my League tables and then pushed out to all my other tables. If I was smart I would create a new css table and have all of my definitions as records that I can use to define whatever I need. hmmm....
Another solution would be to make 1 formula field that would show/hide the three tables as needed.
9 replies
-
You don't say whether you use classes to differentiate each of your tables or not. This is the way Ninox styles most of their HTML elements. I think the issue is specificity https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity
Here are a couple more links...
https://narmada-nannaka.medium.com/how-to-override-css-style-from-another-style-b0b63ffadada
https://gomakethings.com/classless-vs.-class-based-css-design-systems/
-
said:
You don't say whether you use classes to differentiate each of your tables or not.Forgot about that, I don't differentiate. That would be another way of doing it.
-
Well I tried using class but it doesn't seem to make a difference. I've attached a sample DB. I'm probably using it wrong.
When you open it, if you look at Hiding Elements page you can play around.
There are two style fields (cssStyle and cssStyle2). You can hide Example2 with the Hide 2nd Table switch. You can switch between styles with the Style choice. Of course you can modify the settings using any of the fields available.
-
said:
When you open it, if you look at Hiding Elements page you can play around.That's what I did.
said:
Well I tried using class but it doesn't seem to make a difference.I modified the database to demonstrate that it does make a difference.
said:
I wasn't trying to get different looks between tables.I thought the point was to make the tables display in different colors.
said:
If you hide the 2nd element then you can't change anything in the first element.I would move the CSS out of the table formula fields and into its own dedicated field so hiding one table or another wouldn't matter.
If you want to upload another sample database that has the same layout that you are trying to modify I will take a look at it and see if I can get the result you are looking for.
-
said:
I would move the CSS out of the table formula fields and into its own dedicated field so hiding one table or another wouldn't matter.
I don't think moving the CSS out of the table formula helps as Ninox renders the whole page at once so it treats all CSS kind of together.
Just download the original and try:
1) select Style1 from Style choice
2) change a color or font size and it will change for both fields
3) set Hide 2nd Table to Yes
4) change a color or font size and nothing changes
5) set Hide 2nd Table to No and you will see the changes happen
6) you can change to Style2, but that doesn't affect anything
-
said:
I don't think moving the CSS out of the table formula helps as Ninox renders the whole page at once so it treats all CSS kind of together.You do you. https://medium.com/@dennis.pintilie.alexandru/separation-of-concerns-soc-fd72b0191b1f
All I did was add a Formula field with html(cssStyle2) in it and I can modify font size and color. By the way, this has been the way to implement CSS style changes in Ninox for years.
Content aside
- 4 mths agoLast active
- 9Replies
- 115Views
-
2
Following