Matrix/element-web-Github
1
0
Fork 0
mirror of https://github.com/vector-im/element-web.git synced 2024-11-16 05:04:57 +08:00
Code Issues Packages Projects Releases Wiki Activity

small tweaks

Browse Source
This commit is contained in:
Michael Telatynski 2020-08-21 16:38:28 +01:00
parent cca5ccd79d
commit 35cc1fb06d
2 changed files with 15 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
res/css/views/rooms/_AppsDrawer.scss
View File

@ -24,11 +24,11 @@ $MiniAppTileHeight: 114px;
flex-direction: column; flex-direction: column;
overflow: hidden; overflow: hidden;
.mx_RoomSublist_resizerHandles { .mx_AppsContainer_resizerHandles {
flex: 0 0 4px; flex: 0 0 4px;
} }
.mx_RoomSublist_resizerHandle { .mx_AppsContainer_resizerHandle {
cursor: ns-resize; cursor: ns-resize;
border-radius: 3px; border-radius: 3px;
@ -47,7 +47,7 @@ $MiniAppTileHeight: 114px;
} }
&:hover { &:hover {
.mx_RoomSublist_resizerHandle { .mx_AppsContainer_resizerHandle {
opacity: 0.8; opacity: 0.8;
background: $primary-fg-color; background: $primary-fg-color;
} }
@ -427,7 +427,7 @@ form.mx_Custom_Widget_Form div {
margin-right: auto; margin-right: auto;
} }
.mx_AppsDrawer_minimised .mx_RoomSublist_resizerHandle { .mx_AppsDrawer_minimised .mx_AppsContainer_resizerHandle {
display: none; display: none;
} }

15
src/components/views/rooms/AppsDrawer.js
View File

@ -15,7 +15,7 @@ See the License for the specific language governing permissions and
limitations under the License. limitations under the License.
*/ */
import React from 'react'; import React, {useState} from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import createReactClass from 'create-react-class'; import createReactClass from 'create-react-class';
import {MatrixClientPeg} from '../../../MatrixClientPeg'; import {MatrixClientPeg} from '../../../MatrixClientPeg';
@ -218,8 +218,8 @@ export default createReactClass({
id={"apps-drawer_" + this.props.room.roomId} id={"apps-drawer_" + this.props.room.roomId}
minHeight={100} minHeight={100}
maxHeight={this.props.maxHeight - 50} maxHeight={this.props.maxHeight - 50}
handleWrapperClass="mx_RoomSublist_resizerHandles" handleWrapperClass="mx_AppsContainer_resizerHandles"
handleClass="mx_RoomSublist_resizerHandle" handleClass="mx_AppsContainer_resizerHandle"
className="mx_AppsContainer" className="mx_AppsContainer"
> >
{ apps } { apps }
@ -233,17 +233,24 @@ export default createReactClass({
const PersistentVResizer = ({id, minHeight, maxHeight, className, handleWrapperClass, handleClass, children}) => { const PersistentVResizer = ({id, minHeight, maxHeight, className, handleWrapperClass, handleClass, children}) => {
const [height, setHeight] = useLocalStorageState("pvr_" + id, 100); const [height, setHeight] = useLocalStorageState("pvr_" + id, 100);
const [resizing, setResizing] = useState(false);
return <Resizable return <Resizable
size={{height: Math.min(height, maxHeight)}} size={{height: Math.min(height, maxHeight)}}
minHeight={minHeight} minHeight={minHeight}
maxHeight={maxHeight} maxHeight={maxHeight}
onResizeStart={() => {
setResizing(true);
}}
onResizeStop={(e, dir, ref, d) => { onResizeStop={(e, dir, ref, d) => {
setHeight(height + d.height); setHeight(height + d.height);
setResizing(false);
}} }}
handleWrapperClass={handleWrapperClass} handleWrapperClass={handleWrapperClass}
handleClasses={{bottom: handleClass}} handleClasses={{bottom: handleClass}}
className={className} className={classNames(className, {
mx_AppsDrawer_resizing: resizing,
})}
enable={{bottom: true}} enable={{bottom: true}}
> >
{ children } { children }