diff --git a/res/css/structures/_RoomView.pcss b/res/css/structures/_RoomView.pcss index 5ddfed21ba..b340c8d994 100644 --- a/res/css/structures/_RoomView.pcss +++ b/res/css/structures/_RoomView.pcss @@ -46,14 +46,6 @@ limitations under the License. } } -.mx_RoomView_auxPanel { - min-width: 0px; - width: 100%; - margin: 0px auto; - - overflow: auto; -} - .mx_RoomView_auxPanel_hiddenHighlights { border-bottom: 1px solid $primary-hairline-color; padding: 10px 26px; diff --git a/res/css/views/rooms/_AuxPanel.pcss b/res/css/views/rooms/_AuxPanel.pcss index 04d17c63b9..38b93e414f 100644 --- a/res/css/views/rooms/_AuxPanel.pcss +++ b/res/css/views/rooms/_AuxPanel.pcss @@ -14,37 +14,47 @@ See the License for the specific language governing permissions and limitations under the License. */ -.m_RoomView_auxPanel_stateViews { - padding: 5px; - padding-left: 19px; - border-bottom: 1px solid $primary-hairline-color; -} +.mx_AuxPanel { + min-width: 0px; + width: 100%; + margin: 0px auto; -.m_RoomView_auxPanel_stateViews_span a { - text-decoration: none; - color: inherit; -} + overflow: auto; -.m_RoomView_auxPanel_stateViews_span[data-severity="warning"] { - font-weight: bold; - color: orange; -} + .mx_AuxPanel_stateViews { + padding: 5px; + padding-left: 19px; + border-bottom: 1px solid $primary-hairline-color; + } -.m_RoomView_auxPanel_stateViews_span[data-severity="alert"] { - font-weight: bold; - color: red; -} + .mx_AuxPanel_stateViews_span { + &[data-severity="warning"] { + font-weight: bold; + color: orange; + } -.m_RoomView_auxPanel_stateViews_span[data-severity="normal"] { - font-weight: normal; -} + &[data-severity="alert"] { + font-weight: bold; + color: red; + } -.m_RoomView_auxPanel_stateViews_span[data-severity="notice"] { - font-weight: normal; - color: $settings-grey-fg-color; -} + &[data-severity="normal"] { + font-weight: normal; + } -.m_RoomView_auxPanel_stateViews_delim { - padding: 0 5px; - color: $settings-grey-fg-color; + &[data-severity="notice"] { + font-weight: normal; + color: $settings-grey-fg-color; + } + + a { + text-decoration: none; + color: inherit; + } + } + + .mx_AuxPanel_stateViews_delim { + padding: 0 5px; + color: $settings-grey-fg-color; + } } diff --git a/src/components/views/rooms/AuxPanel.tsx b/src/components/views/rooms/AuxPanel.tsx index dfcc6f27a1..e7f9141629 100644 --- a/src/components/views/rooms/AuxPanel.tsx +++ b/src/components/views/rooms/AuxPanel.tsx @@ -173,18 +173,14 @@ export default class AuxPanel extends React.Component { } span = ( - + {span} ); counters.push(span); counters.push( - + {" "} ─{" "} , @@ -193,12 +189,12 @@ export default class AuxPanel extends React.Component { if (counters.length > 0) { counters.pop(); // remove last deliminator - stateViews =
{counters}
; + stateViews =
{counters}
; } } return ( - + {stateViews} {this.props.children} {appsDrawer}