mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web.git synced 2024-12-03 20:36:57 +03:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #6140 from vector-im/luke/fix-tag-panel-css

Browse source 
Fix LeftPanel size being incorrect when TagPanel disabled
This commit is contained in:
Luke Barnard 2018-02-14 10:42:49 +00:00 committed by GitHub
commit 8c1d2a4555
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 19 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/components/structures/LeftPanel.js
View file

@ -238,15 +238,21 @@ var LeftPanel = React.createClass({
} }
); );
const tagPanelEnabled = SettingsStore.isFeatureEnabled("feature_tag_panel");
const tagPanel = tagPanelEnabled ? <TagPanel /> : <div />;
const containerClasses = classNames( const containerClasses = classNames(
"mx_LeftPanel_container", "mx_LeftPanel_container",
{ "mx_LeftPanel_container_collapsed": this.props.collapsed }, {
"mx_LeftPanel_container_collapsed": this.props.collapsed,
"mx_LeftPanel_container_hasTagPanel": tagPanelEnabled,
},
); );
return ( return (
<DragDropContext onDragEnd={this.onDragEnd}> <DragDropContext onDragEnd={this.onDragEnd}>
<div className={containerClasses}> <div className={containerClasses}>
{ SettingsStore.isFeatureEnabled("feature_tag_panel") ? <TagPanel /> : <div /> } { tagPanel }
<aside className={classes} onKeyDown={ this._onKeyDown } onFocus={ this._onFocus } onBlur={ this._onBlur }> <aside className={classes} onKeyDown={ this._onKeyDown } onFocus={ this._onFocus } onBlur={ this._onBlur }>
{ topBox } { topBox }
<CallPreview ConferenceHandler={VectorConferenceHandler} /> <CallPreview ConferenceHandler={VectorConferenceHandler} />

11
src/skins/vector/css/vector-web/structures/_LeftPanel.scss
View file

@ -23,10 +23,21 @@ limitations under the License.
.mx_LeftPanel_container { .mx_LeftPanel_container {
display: flex; display: flex;
/* LeftPanel 235px */
flex: 0 0 235px;
}
.mx_LeftPanel_container.mx_LeftPanel_container_hasTagPanel {
/* TagPanel 60px + LeftPanel 235px */
flex: 0 0 295px; flex: 0 0 295px;
} }
.mx_LeftPanel_container_collapsed { .mx_LeftPanel_container_collapsed {
/* Collapsed LeftPanel 60px */
flex: 0 0 60px;
}
.mx_LeftPanel_container_collapsed.mx_LeftPanel_container_hasTagPanel {
/* TagPanel 60px + Collapsed LeftPanel 60px */ /* TagPanel 60px + Collapsed LeftPanel 60px */
flex: 0 0 120px; flex: 0 0 120px;
} }