css class bottom-panel not actually added

[jasper-vuurst]

Distribution

Linux Mint 22.3 - Cinnamon 64-bit

Package version

Cinnamon 6.6.7

Graphics hardware in use

Intel Corporation TigerLake-H GT1 [UHD Graphics]

Frequency

Always

Bug description

When I change things to the css class ".bottom-panel" in the theme cinnamon.css file, it doesn't affect the appearance. When I change things in the ".panel-top, .panel-bottom, ..." block it does affect the bottom panel, and if I switch the ".bottom-panel" block with the".top-panel" block so that it appears first, the changes do work.
It seems that the parsing of the css file ignores any block which adds properties to a class which has already had properties defined, unless it immediately follows the block where the class is first used. Or maybe it's some other problem with parsing.
I don't know if this is intended behavior but this does mean the cinnamon.css file contains lines which are ignored.

Here are some images of what the bottom panel looks like with different code orders. The top panel behaves the same.

Steps to reproduce

Try editing properties of the bottom panel in the .panel-bottom block in the cinnamon.css file.

Expected behavior

change the appearance of the bottom panel according to the changes.

Additional information

I have been messing with the panel.js file a bit, but I haven't changed any styles in the code.

[fredcw]

It seems to be the comment immediately after the closing brace. If you put a space in between it seems to work.

background-color: green;} /*todo*/

[JosephMcc]

I just tested this in a test theme and it worked as expected. My guess is that you have some syntax error in there that is causing the issue.

[fredcw]

@JosephMcc If in the cinnamon default theme (/usr/share/cinnamon/theme/) you add a comment to cinnamon.css on line 72 like so:

#menu-search-entry StIcon.peek-password, #appmenu-search-entry StIcon.peek-password, .expo-workspaces-name-entry StIcon.peek-password, .prompt-dialog-password-entry StIcon.peek-password, .run-dialog-entry StIcon.peek-password {
    icon-size: 16px;
    color: white; }/*test comment*/

the following rule: .dialog .dialog-button, .dialog .dialog-button:destructive-action, .dialog .dialog-button:default { is ignored and you get this:

[JosephMcc]

Oh, well that's an issue. Suppose I've never run into this since I would never format something that way.

[jasper-vuurst]

When I removed the comment everything worked again, so it was just a syntax issue by me. The css specification probably doesn't prohibit putting comments there, but I think this is not something which requires fixing. Should I close this issue then?