Update _ResizeHandle.pcss (#10772)

* Nesting: `mx_ResizeHandle`

* Nesting: `> div`

* Run prettier

* Use a custom property

* Remove a redundant declaration: `cursor: row-resize`

The resizer is either vertical or horizontal, and since `cursor: row-resize` is applied by default, it does not need to be repeated here.

* Conform the class names to the naming policy

* Revert "Use a custom property"

This reverts commit 6116939eec.

src/components/structures/LoggedInView.tsx

@@ -264,7 +264,7 @@ class LoggedInView extends React.Component<IProps, IState> {
         const resizer = new Resizer(this._resizeContainer.current, CollapseDistributor, collapseConfig);
         resizer.setClassNames({
             handle: "mx_ResizeHandle",
-            vertical: "mx_ResizeHandle_vertical",
+            vertical: "mx_ResizeHandle--vertical",
         });
         return resizer;
     }

src/components/structures/MainSplit.tsx

@@ -87,7 +87,7 @@ export default class MainSplit extends React.Component<IProps> {
                     onResize={this.onResize}
                     onResizeStop={this.onResizeStop}
                     className="mx_RightPanel_ResizeWrapper"
-                    handleClasses={{ left: "mx_ResizeHandle_horizontal" }}
+                    handleClasses={{ left: "mx_ResizeHandle--horizontal" }}
                 >
                     {panelView}
                 </Resizable>

src/components/views/elements/ResizeHandle.tsx

@@ -26,9 +26,9 @@ interface IResizeHandleProps {
 const ResizeHandle: React.FC<IResizeHandleProps> = ({ vertical, id, passRef }) => {
     const classNames = ["mx_ResizeHandle"];
     if (vertical) {
-        classNames.push("mx_ResizeHandle_vertical");
+        classNames.push("mx_ResizeHandle--vertical");
     } else {
-        classNames.push("mx_ResizeHandle_horizontal");
+        classNames.push("mx_ResizeHandle--horizontal");
     }
     return (
         <div ref={passRef} className={classNames.join(" ")} data-id={id}>

src/components/views/rooms/AppsDrawer.tsx

@@ -109,7 +109,7 @@ export default class AppsDrawer extends React.Component<IProps, IState> {
         // (ie. a vertical resize handle because, the handle itself is vertical...)
         const classNames = {
             handle: "mx_ResizeHandle",
-            vertical: "mx_ResizeHandle_vertical",
+            vertical: "mx_ResizeHandle--vertical",
         };
         const collapseConfig = {
             onResizeStart: () => {