Make right panel a dark-panel instead of every descendant.

Also move bg color central.
This commit is contained in:
Bruno Windels 2018-11-06 14:47:58 +01:00
parent 92e43ea181
commit 4e773c2665
13 changed files with 10 additions and 12 deletions

View file

@ -17,7 +17,6 @@ limitations under the License.
.mx_FilePanel { .mx_FilePanel {
order: 2; order: 2;
flex: 1 1 0; flex: 1 1 0;
background-color: $secondary-accent-color;
overflow-y: auto; overflow-y: auto;
} }

View file

@ -46,7 +46,6 @@ limitations under the License.
} }
.mx_LeftPanel { .mx_LeftPanel {
background-color: $secondary-accent-color;
flex: 1; flex: 1;
overflow-x: hidden; overflow-x: hidden;
display: flex; display: flex;

View file

@ -17,7 +17,6 @@ limitations under the License.
.mx_NotificationPanel { .mx_NotificationPanel {
order: 2; order: 2;
flex: 1 1 0; flex: 1 1 0;
background-color: $secondary-accent-color;
overflow-y: auto; overflow-y: auto;
} }

View file

@ -45,7 +45,6 @@ limitations under the License.
padding-top: 6px; padding-top: 6px;
padding-bottom: 6px; padding-bottom: 6px;
cursor: pointer; cursor: pointer;
background-color: $secondary-accent-color;
} }
.mx_RoomSubList_label.mx_RoomSubList_fixed { .mx_RoomSubList_label.mx_RoomSubList_fixed {

View file

@ -15,7 +15,6 @@ limitations under the License.
*/ */
.mx_MemberInfo { .mx_MemberInfo {
background-color: $secondary-accent-color;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
flex: 1; flex: 1;

View file

@ -17,7 +17,6 @@ limitations under the License.
.mx_MemberList, .mx_MemberList,
.mx_GroupMemberList, .mx_GroupMemberList,
.mx_GroupRoomList { .mx_GroupRoomList {
background-color: $secondary-accent-color;
flex: 1; flex: 1;
display: flex; display: flex;
flex-direction: column; flex-direction: column;

View file

@ -37,7 +37,6 @@ limitations under the License.
} }
.mx_RoomList_emptySubListTip_container { .mx_RoomList_emptySubListTip_container {
background-color: $secondary-accent-color;
padding-left: 18px; padding-left: 18px;
padding-right: 18px; padding-right: 18px;
padding-top: 8px; padding-top: 8px;

View file

@ -23,7 +23,6 @@ limitations under the License.
margin: 0; margin: 0;
padding: 2px 12px; padding: 2px 12px;
position: relative; position: relative;
background-color: $secondary-accent-color;
} }
.mx_RoomTile_tooltip { .mx_RoomTile_tooltip {

View file

@ -180,7 +180,7 @@ $lightbox-border-color: #ffffff;
// unused? // unused?
$progressbar-color: #000; $progressbar-color: #000;
// form elements /*** form elements ***/
// .mx_textinput is a container for a text input // .mx_textinput is a container for a text input
// + some other controls like buttons, ... // + some other controls like buttons, ...
@ -220,6 +220,11 @@ input[type=search] {
min-width: 0; min-width: 0;
} }
/*** panels ***/
.dark-panel {
background-color: $secondary-accent-color;
}
.dark-panel { .dark-panel {
:not(.mx_textinput) > input[type=text], :not(.mx_textinput) > input[type=text],
:not(.mx_textinput) > input[type=search], :not(.mx_textinput) > input[type=search],

View file

@ -213,6 +213,7 @@ export default class RightPanel extends React.Component {
const classes = classNames("mx_RightPanel", "mx_fadable", { const classes = classNames("mx_RightPanel", "mx_fadable", {
"collapsed": this.props.collapsed, "collapsed": this.props.collapsed,
"mx_fadable_faded": this.props.disabled, "mx_fadable_faded": this.props.disabled,
"dark-panel": true
}); });
return ( return (

View file

@ -163,7 +163,7 @@ export default React.createClass({
</div> : <div />; </div> : <div />;
return ( return (
<div className="mx_MemberList dark-panel"> <div className="mx_MemberList">
{ inputBox } { inputBox }
<GeminiScrollbarWrapper autoshow={true}> <GeminiScrollbarWrapper autoshow={true}>
{ joined } { joined }

View file

@ -131,7 +131,7 @@ export default React.createClass({
const GeminiScrollbarWrapper = sdk.getComponent("elements.GeminiScrollbarWrapper"); const GeminiScrollbarWrapper = sdk.getComponent("elements.GeminiScrollbarWrapper");
const TruncatedList = sdk.getComponent("elements.TruncatedList"); const TruncatedList = sdk.getComponent("elements.TruncatedList");
return ( return (
<div className="mx_GroupRoomList dark-panel"> <div className="mx_GroupRoomList">
{ inputBox } { inputBox }
<GeminiScrollbarWrapper autoshow={true} className="mx_GroupRoomList_joined mx_GroupRoomList_outerWrapper"> <GeminiScrollbarWrapper autoshow={true} className="mx_GroupRoomList_joined mx_GroupRoomList_outerWrapper">
<TruncatedList className="mx_GroupRoomList_wrapper" truncateAt={this.state.truncateAt} <TruncatedList className="mx_GroupRoomList_wrapper" truncateAt={this.state.truncateAt}

View file

@ -445,7 +445,7 @@ module.exports = React.createClass({
} }
return ( return (
<div className="mx_MemberList dark-panel"> <div className="mx_MemberList">
{ inviteButton } { inviteButton }
<GeminiScrollbarWrapper autoshow={true}> <GeminiScrollbarWrapper autoshow={true}>
<div className="mx_MemberList_wrapper"> <div className="mx_MemberList_wrapper">