Rename PostCSS files to .pcss (#9013)

* Rename PostCSS files to `.pcss`

* Make Stylelint happy

* Delint

* Rename new files too

* delint

* Fix bad comment placement

res/css/structures/_FilePanel.pcss

@@ -44,7 +44,7 @@ limitations under the License.
 
     .mx_EventTile {
         /* Overrides for the attachment body tiles */
-        &:not([data-layout=bubble]) {
+        &:not([data-layout="bubble"]) {
             word-break: break-word;
             margin-top: 10px;
             padding-top: 0;

res/css/structures/_GenericDropdownMenu.pcss

@@ -24,7 +24,7 @@ limitations under the License.
 }
 
 .mx_GenericDropdownMenu_button:hover,
-.mx_GenericDropdownMenu_button[aria-expanded=true] {
+.mx_GenericDropdownMenu_button[aria-expanded="true"] {
     background: $quinary-content;
 }
 

res/css/structures/_MainSplit.pcss

@@ -24,7 +24,9 @@ limitations under the License.
 
 .mx_MainSplit > .mx_RightPanel_ResizeWrapper {
     padding: $container-gap-width;
-    padding-left: calc($container-gap-width / 2); // The resizer should be centered: only half of the gap-width is handled by the right panel. The other half by the RoomView.
+    // The resizer should be centered: only half of the gap-width is handled by the right panel.
+    // The other half by the RoomView.
+    padding-left: calc($container-gap-width / 2);
     height: calc(100vh - 51px); // height of .mx_RoomHeader.light-panel
 
     &:hover .mx_ResizeHandle_horizontal::before {

res/css/structures/_MatrixChat.pcss

@@ -82,9 +82,11 @@ limitations under the License.
 // https://github.com/vector-im/element-web/issues/19863 happens.
 .mx_MatrixChat > .mx_ResizeHandle.mx_ResizeHandle_horizontal {
     margin: 0 calc(-5.5px - $container-gap-width / 2) 0 calc(-6.5px + $container-gap-width / 2);
-    // The condition to prevent bleeding is: (margin-left + margin-right < -11px) (IF there is NO margin on the leftPanel_wrapper)
+    // The condition to prevent bleeding is: (margin-left + margin-right < -11px)
+    // (IF there is NO margin on the leftPanel_wrapper)
     // The resizeHandle does not change the gap between the left panel and the room view:
-    //  the resizeHandle width is: 11px =  10px (padding) + 1px (width) and the total negative margin is -12px -> the handle requires no space
+    //  the resizeHandle width is:
+    //      11px =  10px (padding) + 1px (width) and the total negative margin is -12px -> the handle requires no space
     // right: -6px left: -6px positions the element exactly on the edge of leftPanel.
     // left+=1 and right-=1 => resizeHandle moves 1px to the right closer to the center of the gap.
     // We want the handle to be in the middle of the gap so it is shifted by ($container-gap-width / 2)

res/css/structures/_SplashPage.pcss

@@ -27,23 +27,23 @@ limitations under the License.
         background-image:
             radial-gradient(
                 53.85% 66.75% at 87.55% 0%,
-                hsla(250, 76%, 71%, 0.261) 0%,
-                hsla(250, 100%, 88%, 0) 100%
+                hsla(250deg, 76%, 71%, 0.261) 0%,
+                hsla(250deg, 100%, 88%, 0) 100%
             ),
             radial-gradient(
                 41.93% 41.93% at 0% 0%,
-                hsla(222, 29%, 20%, 0.28) 0%,
-                hsla(250, 100%, 88%, 0) 100%
+                hsla(222deg, 29%, 20%, 0.28) 0%,
+                hsla(250deg, 100%, 88%, 0) 100%
             ),
             radial-gradient(
                 100% 100% at 0% 0%,
-                hsla(250, 100%, 88%, 0.174) 0%,
-                hsla(0, 100%, 86%, 0) 100%
+                hsla(250deg, 100%, 88%, 0.174) 0%,
+                hsla(0deg, 100%, 86%, 0) 100%
             ),
             radial-gradient(
                 106.35% 96.26% at 100% 0%,
-                hsla(250, 100%, 88%, 0.4) 0%,
-                hsla(167, 76%, 82%, 0) 100%
+                hsla(250deg, 100%, 88%, 0.4) 0%,
+                hsla(167deg, 76%, 82%, 0) 100%
             );
         /* blur to reduce color banding issues due to alpha-blending multiple gradients */
         filter: blur(8px);