Make the dialog look more like a new dialog

This commit is contained in:
Travis Ralston 2019-01-18 20:09:23 -07:00
parent a7e3d7df28
commit 22435bf8d2
6 changed files with 61 additions and 9 deletions

View file

@ -160,7 +160,7 @@ textarea {
padding: 0 58px 36px;
width: 60%;
max-width: 704px;
box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.2);
box-shadow: 2px 15px 30px 0 $dialog-shadow-color;
max-height: 80%;
overflow-y: auto;
}
@ -171,7 +171,7 @@ textarea {
left: 0;
width: 100%;
height: 100%;
background-color: $dialog-background-bg-color;
background-color: $dialog-backdrop-color;
opacity: 0.8;
}

View file

@ -82,8 +82,8 @@ limitations under the License.
.mx_TabbedView_tabPanel {
width: calc(100% - 320px);
display: inline-block;
height: 100vh; // 100% of viewport height
margin-left: 20px;
flex-grow: 1;
}
.mx_TabbedView_tabPanelContent {

View file

@ -1,3 +1,44 @@
.mx_UserSettingsDialog_header {
font-size: 24px;
display: block;
text-align: center;
color: $dialog-title-fg-color;
margin-top: 23px;
margin-bottom: 32px;
padding: 0;
}
.mx_UserSettingsDialog_close {
position: absolute;
top: 23px;
right: 25px;
}
.mx_UserSettingsDialog_closeIcon {
width: 14px;
height: 14px;
display: inline-block;
}
.mx_UserSettingsDialog_closeIcon:before {
// TODO: Use real icon
mask: url('$(res)/img/feather-icons/video.svg');
background-color: $dialog-close-fg-color;
mask-repeat: no-repeat;
mask-size: 14px;
mask-position: center;
content: '';
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
// ICONS
// ==========================================================
.mx_UserSettingsDialog_settingsIcon:before {
mask: url('$(res)/img/feather-icons/settings.svg');
}
@ -23,4 +64,4 @@
.mx_UserSettingsDialog_helpIcon:before {
// TODO: Use real icon
mask: url('$(res)/img/feather-icons/share.svg');
}
}