light background colors became semi-transparent in v0.35, making them unreadable when they are stacked on top of other elements

[francesco-cattoglio]

In my project I use the "Azure" SQLPage color in the last row of my table. I have noticed that there is a difference between behaviour between 0.34 and 0.35: In 0.34, the css style assigned with my row is

.bg-azure-lt {
  --tblr-bg-opacity: 1;
  --tblr-text-opacity: 1;
  color: rgba(var(--tblr-azure-rgb),var(--tblr-text-opacity)) !important;
  background-color: rgba(var(--tblr-azure-lt-rgb),var(--tblr-bg-opacity)) !important;
}

which gives it a solid background color, while in 0.35 the css style is

.bg-azure-lt {
  color: color-mix(in srgb,var(--tblr-azure) calc(var(--tblr-text-opacity,1) * 100%),transparent) !important;
  background-color: color-mix(in srgb,var(--tblr-azure-lt) calc(var(--tblr-bg-opacity,1) * 100%),transparent) !important;
}

which results in a half-transparent background. Ofc this is irrelevant if the background behind the table row is 100% white, but if the row is sticky, then what happens is that two rows are rendered on top of each other.

I know very little CSS so I cannot understand if this is a bug or a feature... According to Firefox inspector, the --tblr-azure-lt is a color with alpha at 10% (90% transparency), --tblr-azure-lt-rgb is visually the same color but coded in RGB-only, no transparency applied to it.

So, the question is: is it normal that the behavior of the colors changed between 0.34 and 0.35? Is any one of those "correct" or are they both right in their own way?

[francesco-cattoglio]

PS: to keep the old behaviour, I am using a custom theme as described in the custom SQLPage Colors docs with the following, very simple custom_theme.css

:root,
.layout-boxed[data-bs-theme="custom_theme"] {
  color-scheme: light;

  /* Overwrite the default --tblr-azure-lt color, which has transparency, with the non-transparent version. */
  --tblr-azure-lt: rgb(var(--tblr-azure-lt-rgb));
}

As usual, SQLPage customization is excellent and working around minor issues is super easy 😎

[lovasoa]

Hi ! v0.35 included an upgrade of the tabler CSS library : https://tabler.io/changelog/2#/changelog/tabler-1.2

I think a minimal reproduction of the issue could be addressed to them https://github.com/tabler/tabler