imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Address design issues and set theme at device level

Browse source
This commit is contained in:
Jorik Schellekens 2020-06-11 12:27:09 +01:00
parent 0f685eb0e9
commit cf392af52f
5 changed files with 39 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

25
res/css/views/settings/tabs/user/_AppearanceUserSettingsTab.scss
View file

@ -44,8 +44,15 @@ limitations under the License.
padding-right: 5px;
}
.mx_AppearanceUserSettingsTab {
> .mx_SettingsTab_SubHeading {
margin-bottom: 32px;
}
}
.mx_AppearanceUserSettingsTab_themeSection {
$radio-bg-color: $input-darker-bg-color;
color: $primary-fg-color;
> .mx_ThemeSelectors {
display: flex;
@ -53,19 +60,31 @@ limitations under the License.
flex-wrap: wrap;
margin-top: 13px;
margin-bottom: 30px;
> .mx_RadioButton {
padding: $font-16px;
box-sizing: border-box;
border-radius: 10px;
background: rgba($radio-bg-color, 0.2);
width: 180px;
background: rgba($radio-bg-color, 0.2);
flex-shrink: 1;
flex-grow: 0;
margin-right: 15px;
margin-top: 10px;
font-weight: 600;
color: $muted-fg-color;
> span {
justify-content: center;
}
}
> .mx_RadioButton:not([disabled]) {
> .mx_RadioButton_enabled {
// These need to be hardcoded because they don't change with the theme
&.mx_ThemeSelector_light {
background-color: #f3f8fd;
@ -74,6 +93,7 @@ limitations under the License.
&.mx_ThemeSelector_dark {
background-color: #181b21;
color: #f3f8fd;
> input > div {
border-color: $input-darker-bg-color;
@ -85,6 +105,7 @@ limitations under the License.
&.mx_ThemeSelector_black {
background-color: #000000;
color: #f3f8fd;
> input > div {
border-color: $input-darker-bg-color;