19de6694ca
This also changes the layout slightly in the user settings, but nothing detrimental.
109 lines
No EOL
2.5 KiB
SCSS
109 lines
No EOL
2.5 KiB
SCSS
.mx_GeneralSettingsTab_profile {
|
|
display: flex;
|
|
}
|
|
|
|
.mx_GeneralSettingsTab_profileControls {
|
|
flex-grow: 1;
|
|
}
|
|
|
|
.mx_GeneralSettingsTab_profileControls .mx_Field #profileDisplayName {
|
|
width: calc(100% - 20px); // subtract 10px padding on left and right
|
|
}
|
|
|
|
.mx_GeneralSettingsTab_profileAvatar {
|
|
width: 88px;
|
|
height: 88px;
|
|
margin-left: 13px;
|
|
position: relative;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.mx_GeneralSettingsTab_profileAvatar > * {
|
|
display: block;
|
|
width: 88px;
|
|
height: 88px;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.mx_GeneralSettingsTab_profileAvatar .mx_GeneralSettingsTab_profileAvatarPlaceholder {
|
|
background-color: $settings-profile-placeholder-bg-color;
|
|
}
|
|
|
|
.mx_GeneralSettingsTab_profileAvatarOverlay {
|
|
position: absolute;
|
|
top: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
display: none;
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
font-size: 10px;
|
|
}
|
|
|
|
.mx_GeneralSettingsTab_profileAvatar:hover .mx_GeneralSettingsTab_profileAvatarOverlay {
|
|
display: inline-block;
|
|
opacity: 0.5 !important;
|
|
color: $settings-profile-overlay-fg-color !important;
|
|
background-color: $settings-profile-overlay-bg-color !important;
|
|
}
|
|
|
|
.mx_GeneralSettingsTab_profileAvatarOverlay_show {
|
|
display: inline-block;
|
|
opacity: 1;
|
|
color: $settings-profile-overlay-placeholder-fg-color;
|
|
background-color: $settings-profile-overlay-placeholder-bg-color;
|
|
}
|
|
|
|
.mx_GeneralSettingsTab_profileAvatarOverlayText {
|
|
display: block;
|
|
margin-top: 17px;
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
.mx_GeneralSettingsTab_profileAvatarOverlayImgContainer {
|
|
position: relative;
|
|
width: 14px;
|
|
height: 14px;
|
|
margin: auto;
|
|
}
|
|
|
|
.mx_GeneralSettingsTab_profileAvatarOverlayImg:before {
|
|
background-color: $settings-profile-overlay-placeholder-fg-color;
|
|
mask: url("$(res)/img/feather-icons/upload.svg");
|
|
mask-repeat: no-repeat;
|
|
mask-size: 14px;
|
|
mask-position: center;
|
|
content: '';
|
|
position: absolute;
|
|
top: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
}
|
|
|
|
.mx_GeneralSettingsTab_profileAvatar:hover .mx_GeneralSettingsTab_profileAvatarOverlayImg:before {
|
|
background-color: $settings-profile-overlay-fg-color !important;
|
|
}
|
|
|
|
.mx_GeneralSettingsTab_profileAvatarUpload {
|
|
display: none;
|
|
}
|
|
|
|
.mx_GeneralSettingsTab_changePassword {
|
|
display: block;
|
|
}
|
|
|
|
.mx_GeneralSettingsTab_changePassword .mx_Field {
|
|
display: block;
|
|
margin-right: 100px; // Align with the other fields on the page
|
|
}
|
|
|
|
.mx_GeneralSettingsTab_changePassword .mx_Field input {
|
|
display: block;
|
|
width: calc(100% - 20px); // subtract 10px padding on left and right
|
|
}
|
|
|
|
.mx_GeneralSettingsTab_changePassword .mx_Field:first-child {
|
|
margin-top: 0;
|
|
} |