Use flexboxes in AppTile/AppDrawer CSS for automatic resizing
Using flexboxes removes the need for pixel constants, and the app content now resizes to fill the tiles. Signed-off-by: Pauli Virtanen <pav@iki.fi>
This commit is contained in:
parent
c19338b1d3
commit
2e7bd2e3f0
2 changed files with 45 additions and 22 deletions
|
@ -775,14 +775,16 @@ export default class AppTile extends React.Component {
|
|||
const showMinimiseButton = this.props.showMinimise && this.props.show;
|
||||
const showMaximiseButton = this.props.showMinimise && !this.props.show;
|
||||
|
||||
let appTileClass;
|
||||
let appTileClasses;
|
||||
if (this.props.miniMode) {
|
||||
appTileClass = 'mx_AppTile_mini';
|
||||
appTileClasses = {mx_AppTile_mini: true};
|
||||
} else if (this.props.fullWidth) {
|
||||
appTileClass = 'mx_AppTileFullWidth';
|
||||
appTileClasses = {mx_AppTileFullWidth: true};
|
||||
} else {
|
||||
appTileClass = 'mx_AppTile';
|
||||
appTileClasses = {mx_AppTile: true};
|
||||
}
|
||||
appTileClasses.mx_AppTile_minimised = !this.props.show;
|
||||
appTileClasses = classNames(appTileClasses);
|
||||
|
||||
const menuBarClasses = classNames({
|
||||
mx_AppTileMenuBar: true,
|
||||
|
@ -814,7 +816,7 @@ export default class AppTile extends React.Component {
|
|||
}
|
||||
|
||||
return <React.Fragment>
|
||||
<div className={appTileClass} id={this.props.app.id}>
|
||||
<div className={appTileClasses} id={this.props.app.id}>
|
||||
{ this.props.showMenubar &&
|
||||
<div ref={this._menu_bar} className={menuBarClasses} onClick={this.onClickMenuBar}>
|
||||
<span className="mx_AppTileMenuBarTitle" style={{pointerEvents: (this.props.handleMinimisePointerEvents ? 'all' : false)}}>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue