PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Conform _AppsDrawer.pcss to the naming policy - AppDrawer variants (#10856)

Browse source 
* Conform _AppsDrawer.pcss to the naming policy - AppDrawer variants

* Sort style blocks

* Feedback
This commit is contained in:
Suguru Hirahara 2023-05-15 09:05:14 +00:00 committed by GitHub
parent 857b3085e6
commit fb3f20f70c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 17 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
res/css/views/rooms/_AppsDrawer.pcss
View file

@ -29,10 +29,6 @@ limitations under the License.
overflow: hidden;
flex-grow: 1;
&.mx_AppsDrawer_maximise {
margin-bottom: var(--container-gap-width);
}
.mx_AppsContainer_resizerHandleContainer {
width: 100%;
height: 10px;
@ -96,7 +92,15 @@ limitations under the License.
min-width: var(--minWidth);
}
&.mx_AppsDrawer_2apps .mx_AppTile {
&.mx_AppsDrawer--maximised {
margin-bottom: var(--container-gap-width);
}
&.mx_AppsDrawer--resizing .mx_AppTile_persistedWrapper {
z-index: 1;
}
&.mx_AppsDrawer--2apps .mx_AppTile {
width: 50%;
&:nth-child(3) {
@ -105,7 +109,7 @@ limitations under the License.
min-width: var(--minWidth) !important;
}
}
&.mx_AppsDrawer_3apps .mx_AppTile {
&.mx_AppsDrawer--3apps .mx_AppTile {
width: 33%;
&:nth-child(3) {
@ -419,7 +423,3 @@ limitations under the License.
opacity: 1;
}
}
.mx_AppsDrawer_resizing .mx_AppTile_persistedWrapper {
z-index: 1;
}

14
src/components/views/rooms/AppsDrawer.tsx
View file

@ -114,11 +114,11 @@ export default class AppsDrawer extends React.Component<IProps, IState> {
};
const collapseConfig = {
onResizeStart: () => {
this.resizeContainer?.classList.add("mx_AppsDrawer_resizing");
this.resizeContainer?.classList.add("mx_AppsDrawer--resizing");
this.setState({ resizingHorizontal: true });
},
onResizeStop: () => {
this.resizeContainer?.classList.remove("mx_AppsDrawer_resizing");
this.resizeContainer?.classList.remove("mx_AppsDrawer--resizing");
WidgetLayoutStore.instance.setResizerDistributions(
this.props.room,
Container.Top,
@ -254,11 +254,11 @@ export default class AppsDrawer extends React.Component<IProps, IState> {
}
const classes = classNames({
mx_AppsDrawer: true,
mx_AppsDrawer_maximise: widgetIsMaxmised,
mx_AppsDrawer_resizing: this.state.resizing,
mx_AppsDrawer_2apps: apps.length === 2,
mx_AppsDrawer_3apps: apps.length === 3,
"mx_AppsDrawer": true,
"mx_AppsDrawer--maximised": widgetIsMaxmised,
"mx_AppsDrawer--resizing": this.state.resizing,
"mx_AppsDrawer--2apps": apps.length === 2,
"mx_AppsDrawer--3apps": apps.length === 3,
});
const appContainers = (
<div className="mx_AppsContainer" ref={this.collectResizer}>