Fix TagPanel from collapsing to < 60px when LP collapsed

Fixes https://github.com/vector-im/riot-web/issues/6133
This commit is contained in:
Luke Barnard 2018-02-13 15:17:51 +00:00
parent e67147213b
commit 285c4f91d3
3 changed files with 14 additions and 2 deletions

View File

@ -238,9 +238,14 @@ var LeftPanel = React.createClass({
} }
); );
const containerClasses = classNames(
"mx_LeftPanel_container",
{ "mx_LeftPanel_container_collapsed": this.props.collapsed },
);
return ( return (
<DragDropContext onDragEnd={this.onDragEnd}> <DragDropContext onDragEnd={this.onDragEnd}>
<div className="mx_LeftPanel_container"> <div className={containerClasses}>
{ SettingsStore.isFeatureEnabled("feature_tag_panel") ? <TagPanel /> : <div /> } { SettingsStore.isFeatureEnabled("feature_tag_panel") ? <TagPanel /> : <div /> }
<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 }

View File

@ -15,7 +15,7 @@ limitations under the License.
*/ */
.mx_TagPanel { .mx_TagPanel {
width: 60px; flex: 0 0 60px;
background-color: $tertiary-accent-color; background-color: $tertiary-accent-color;
cursor: pointer; cursor: pointer;

View File

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