128 lines
		
	
	
		
			2.8 KiB
		
	
	
	
		
			SCSS
		
	
	
			
		
		
	
	
			128 lines
		
	
	
		
			2.8 KiB
		
	
	
	
		
			SCSS
		
	
	
| /*
 | |
| Copyright 2015, 2016 OpenMarket Ltd
 | |
| 
 | |
| Licensed under the Apache License, Version 2.0 (the "License");
 | |
| you may not use this file except in compliance with the License.
 | |
| You may obtain a copy of the License at
 | |
| 
 | |
|     http://www.apache.org/licenses/LICENSE-2.0
 | |
| 
 | |
| Unless required by applicable law or agreed to in writing, software
 | |
| distributed under the License is distributed on an "AS IS" BASIS,
 | |
| WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 | |
| See the License for the specific language governing permissions and
 | |
| limitations under the License.
 | |
| */
 | |
| 
 | |
| .mx_RightPanel {
 | |
|     overflow-x: hidden;
 | |
|     flex: 0 0 auto;
 | |
|     position: relative;
 | |
|     min-width: 250px;
 | |
|     display: flex;
 | |
|     flex-direction: column;
 | |
| }
 | |
| 
 | |
| .mx_RightPanel_header {
 | |
|     order: 1;
 | |
|     border-bottom: 1px solid $primary-hairline-color;
 | |
|     flex: 0 0 52px;
 | |
| }
 | |
| 
 | |
| /** Fixme - factor this out with the main header **/
 | |
| 
 | |
| .mx_RightPanel_headerButtonGroup {
 | |
|     height: 100%;
 | |
|     display: flex;
 | |
|     background-color: $primary-bg-color;
 | |
|     padding: 0 9px;
 | |
|     align-items: center;
 | |
| }
 | |
| 
 | |
| .mx_RightPanel_headerButton {
 | |
|     cursor: pointer;
 | |
|     flex: 0 0 auto;
 | |
|     vertical-align: top;
 | |
|     margin-left: 5px;
 | |
|     margin-right: 5px;
 | |
|     text-align: center;
 | |
|     border-bottom: 2px solid transparent;
 | |
|     height: 20px;
 | |
|     width: 20px;
 | |
|     position: relative;
 | |
| 
 | |
|     &::before {
 | |
|         content: '';
 | |
|         position: absolute;
 | |
|         top: 0;
 | |
|         left: 0;
 | |
|         height: 20px;
 | |
|         width: 20px;
 | |
|         background-color: $rightpanel-button-color;
 | |
|         mask-repeat: no-repeat;
 | |
|         mask-size: contain;
 | |
|     }
 | |
| }
 | |
| 
 | |
| .mx_RightPanel_membersButton::before {
 | |
|     mask-image: url('$(res)/img/feather-customised/user.svg');
 | |
| }
 | |
| 
 | |
| .mx_RightPanel_filesButton::before {
 | |
|     mask-image: url('$(res)/img/feather-customised/files.svg');
 | |
| }
 | |
| 
 | |
| .mx_RightPanel_notifsButton::before {
 | |
|     mask-image: url('$(res)/img/feather-customised/notifications.svg');
 | |
| }
 | |
| 
 | |
| .mx_RightPanel_groupMembersButton::before {
 | |
|     mask-image: url('$(res)/img/icons-people.svg');
 | |
| }
 | |
| 
 | |
| .mx_RightPanel_roomsButton::before {
 | |
|     mask-image: url('$(res)/img/icons-room-nobg.svg');
 | |
| }
 | |
| 
 | |
| .mx_RightPanel_headerButton_highlight::after {
 | |
|     content: '';
 | |
|     position: absolute;
 | |
|     bottom: -6px;
 | |
|     left: 0;
 | |
|     right: 0;
 | |
|     height: 2px;
 | |
|     background-color: $button-bg-color;
 | |
| }
 | |
| 
 | |
| .mx_RightPanel_headerButton_badge {
 | |
|     font-size: 8px;
 | |
|     border-radius: 8px;
 | |
|     color: $accent-fg-color;
 | |
|     background-color: $accent-color;
 | |
|     font-weight: bold;
 | |
|     position: absolute;
 | |
|     top: -4px;
 | |
|     left: 20px;
 | |
|     padding: 2px 4px;
 | |
| }
 | |
| 
 | |
| .mx_RightPanel_collapsebutton {
 | |
|     flex: 1;
 | |
|     text-align: right;
 | |
|     height: 16px;
 | |
|     border: none;
 | |
| }
 | |
| 
 | |
| .mx_RightPanel .mx_MemberList,
 | |
| .mx_RightPanel .mx_MemberInfo,
 | |
| .mx_RightPanel .mx_GroupRoomList,
 | |
| .mx_RightPanel_blank {
 | |
|     order: 2;
 | |
|     flex: 1 1 0;
 | |
| }
 | |
| 
 | |
| .mx_RightPanel .mx_RoomView_messagePanelSpinner {
 | |
|     order: 2;
 | |
|     margin: auto;
 | |
| }
 |