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 6116939eec7d9e4220b89a638623e5876e143adf.
This commit is contained in:
Suguru Hirahara 2023-05-04 15:19:55 +00:00 committed by GitHub
parent 0d2af83dbe
commit 3ca957b541
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 26 additions and 27 deletions

View file

@ -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;
}

View file

@ -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>

View file

@ -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}>

View file

@ -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: () => {