Add variant of default home page for justRegistered
This commit is contained in:
parent
ce9d31a778
commit
4afa610ee1
5 changed files with 174 additions and 34 deletions
|
@ -50,6 +50,44 @@ limitations under the License.
|
|||
color: $muted-fg-color;
|
||||
}
|
||||
|
||||
.mx_HomePage_userAvatar {
|
||||
position: relative;
|
||||
width: min-content;
|
||||
margin: 0 auto;
|
||||
|
||||
&::before, &::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
|
||||
height: 26px;
|
||||
width: 26px;
|
||||
|
||||
right: -6px;
|
||||
bottom: -6px;
|
||||
}
|
||||
|
||||
&::before {
|
||||
background-color: $primary-bg-color;
|
||||
border-radius: 50%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
&::after {
|
||||
background-color: $secondary-fg-color;
|
||||
mask-position: center;
|
||||
mask-repeat: no-repeat;
|
||||
mask-image: url('$(res)/img/element-icons/camera.svg');
|
||||
mask-size: 16px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
&.mx_HomePage_userAvatar_busy::after {
|
||||
background: url("$(res)/img/spinner.gif") no-repeat center;
|
||||
background-size: 80%;
|
||||
mask: unset;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_HomePage_default_buttons {
|
||||
margin: 80px auto 0;
|
||||
width: fit-content;
|
||||
|
@ -57,49 +95,43 @@ limitations under the License.
|
|||
.mx_AccessibleButton {
|
||||
padding: 73px 8px 15px; // top: 20px top padding + 40px icon + 13px margin
|
||||
|
||||
width: 104px; // 120px - 2* 8px
|
||||
margin: 0 39px; // 55px - 2* 8px
|
||||
width: 160px;
|
||||
height: 132px;
|
||||
margin: 0 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: $muted-fg-color;
|
||||
|
||||
&:hover {
|
||||
color: $accent-color;
|
||||
background: rgba($accent-color, 0.06);
|
||||
|
||||
&::before {
|
||||
background-color: $accent-color;
|
||||
}
|
||||
}
|
||||
color: #fff; // on all themes
|
||||
background-color: $accent-color;
|
||||
|
||||
&::before {
|
||||
top: 20px;
|
||||
left: 40px; // (120px-40px)/2
|
||||
left: 60px; // (160px-40px)/2
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
|
||||
content: '';
|
||||
position: absolute;
|
||||
background-color: $muted-fg-color;
|
||||
background-color: #fff; // on all themes
|
||||
mask-repeat: no-repeat;
|
||||
mask-size: contain;
|
||||
}
|
||||
|
||||
&.mx_HomePage_button_sendDm::before {
|
||||
mask-image: url('$(res)/img/feather-customised/message-circle.svg');
|
||||
mask-image: url('$(res)/img/element-icons/feedback.svg');
|
||||
}
|
||||
&.mx_HomePage_button_explore::before {
|
||||
mask-image: url('$(res)/img/feather-customised/explore.svg');
|
||||
mask-image: url('$(res)/img/element-icons/roomlist/explore.svg');
|
||||
}
|
||||
&.mx_HomePage_button_createGroup::before {
|
||||
mask-image: url('$(res)/img/feather-customised/group.svg');
|
||||
mask-image: url('$(res)/img/element-icons/community-members.svg');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
10
res/img/element-icons/camera.svg
Normal file
10
res/img/element-icons/camera.svg
Normal file
|
@ -0,0 +1,10 @@
|
|||
<svg width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0)">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.4896 2.5C9.04778 2.5 7.827 3.52171 7.54879 4.90624C7.50711 5.11367 7.42679 5.31408 7.28726 5.47312L6.6851 6.15949C6.49523 6.37591 6.22129 6.5 5.93338 6.5H2.75C1.64543 6.5 0.75 7.39543 0.75 8.5V19.5C0.75 20.6046 1.64543 21.5 2.75 21.5H22.75C23.8546 21.5 24.75 20.6046 24.75 19.5V8.5C24.75 7.39543 23.8546 6.5 22.75 6.5H19.5666C19.2787 6.5 19.0048 6.37591 18.8149 6.15949L18.2127 5.47312C18.0732 5.31408 17.9929 5.11366 17.9512 4.90623C17.673 3.5217 16.4522 2.5 15.0104 2.5H10.4896ZM16.75 13.5C16.75 15.7091 14.9591 17.5 12.75 17.5C10.5409 17.5 8.75 15.7091 8.75 13.5C8.75 11.2909 10.5409 9.5 12.75 9.5C14.9591 9.5 16.75 11.2909 16.75 13.5ZM3.25 5C2.97386 5 2.75 5.22386 2.75 5.5C2.75 5.77614 2.97386 6 3.25 6H5.25C5.52614 6 5.75 5.77614 5.75 5.5C5.75 5.22386 5.52614 5 5.25 5H3.25Z" fill="black"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0">
|
||||
<rect width="24" height="24" fill="white" transform="translate(0.75)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
After Width: | Height: | Size: 1.1 KiB |
Loading…
Add table
Add a link
Reference in a new issue