107 lines
		
	
	
		
			2.7 KiB
		
	
	
	
		
			SCSS
		
	
	
			
		
		
	
	
			107 lines
		
	
	
		
			2.7 KiB
		
	
	
	
		
			SCSS
		
	
	
| /*
 | |
| Copyright 2016 OpenMarket Ltd
 | |
| Copyright 2017 Vector Creations Ltd
 | |
| Copyright 2019 New Vector 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_HomePage {
 | |
|     max-width: 960px;
 | |
|     width: 100%;
 | |
|     height: 100%;
 | |
|     margin-left: auto;
 | |
|     margin-right: auto;
 | |
| }
 | |
| 
 | |
| .mx_HomePage_default {
 | |
|     text-align: center;
 | |
|     display: flex;
 | |
| 
 | |
|     .mx_HomePage_default_wrapper {
 | |
|         margin: auto;
 | |
|     }
 | |
| 
 | |
|     img {
 | |
|         height: 48px;
 | |
|     }
 | |
| 
 | |
|     h1 {
 | |
|         font-weight: 600;
 | |
|         font-size: $font-32px;
 | |
|         line-height: $font-44px;
 | |
|         margin-bottom: 4px;
 | |
|     }
 | |
| 
 | |
|     h4 {
 | |
|         margin-top: 4px;
 | |
|         font-weight: 600;
 | |
|         font-size: $font-18px;
 | |
|         line-height: $font-25px;
 | |
|         color: $muted-fg-color;
 | |
|     }
 | |
| 
 | |
|     .mx_MiniAvatarUploader {
 | |
|         margin: 0 auto;
 | |
|     }
 | |
| 
 | |
|     .mx_HomePage_default_buttons {
 | |
|         display: flex;
 | |
|         margin: 60px auto 0;
 | |
|         width: fit-content;
 | |
| 
 | |
|         .mx_AccessibleButton {
 | |
|             padding: 73px 8px 15px; // top: 20px top padding + 40px icon + 13px margin
 | |
| 
 | |
|             width: 160px;
 | |
|             min-height: 132px;
 | |
|             margin: 20px;
 | |
|             position: relative;
 | |
|             display: inline-block;
 | |
|             border-radius: 8px;
 | |
|             vertical-align: top;
 | |
|             word-break: break-word;
 | |
|             box-sizing: border-box;
 | |
| 
 | |
|             font-weight: 600;
 | |
|             font-size: $font-15px;
 | |
|             line-height: $font-20px;
 | |
|             color: #fff; // on all themes
 | |
|             background-color: $accent;
 | |
| 
 | |
|             &::before {
 | |
|                 top: 20px;
 | |
|                 left: 60px; // (160px-40px)/2
 | |
|                 width: 40px;
 | |
|                 height: 40px;
 | |
| 
 | |
|                 content: '';
 | |
|                 position: absolute;
 | |
|                 background-color: #fff; // on all themes
 | |
|                 mask-repeat: no-repeat;
 | |
|                 mask-size: contain;
 | |
|             }
 | |
| 
 | |
|             &.mx_HomePage_button_sendDm::before {
 | |
|                 mask-image: url('$(res)/img/element-icons/feedback.svg');
 | |
|             }
 | |
|             &.mx_HomePage_button_explore::before {
 | |
|                 mask-image: url('$(res)/img/element-icons/roomlist/explore.svg');
 | |
|             }
 | |
|             &.mx_HomePage_button_createGroup::before {
 | |
|                 mask-image: url('$(res)/img/element-icons/community-members.svg');
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| }
 |