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

Add layout options to the appearance tab

Browse source
This commit is contained in:
Jorik Schellekens 2020-06-16 17:55:19 +01:00
parent b27334f448
commit 2192332968
7 changed files with 138 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -16,6 +16,7 @@ limitations under the License.
.mx_AppearanceUserSettingsTab_fontSlider,
.mx_AppearanceUserSettingsTab_fontSlider_preview,
.mx_AppearanceUserSettingsTab_Layout,
.mx_AppearanceUserSettingsTab .mx_Field {
@mixin mx_Settings_fullWidthField;
}
@ -41,6 +42,14 @@ limitations under the License.
border-radius: 10px;
padding: 0 16px 9px 16px;
pointer-events: none;
.mx_EventTile_msgOption {
display: none;
}
&.mx_IRCLayout {
padding-top: 9px;
}
}
.mx_AppearanceUserSettingsTab_fontSlider_smallText {
@ -135,3 +144,55 @@ limitations under the License.
.mx_SettingsTab_customFontSizeField {
margin-left: calc($font-16px + 10px);
}
.mx_AppearanceUserSettingsTab_Layout_RadioButtons {
display: flex;
flex-direction: row;
color: $primary-fg-color;
.mx_AppearanceUserSettingsTab_spacer {
width: 24px;
}
> .mx_AppearanceUserSettingsTab_Layout_RadioButton {
flex-grow: 0;
flex-shrink: 1;
display: flex;
flex-direction: column;
width: 300px;
border: 1px solid $input-darker-bg-color;
border-radius: 10px;
.mx_EventTile_msgOption {
display: none;
}
.mx_AppearanceUserSettingsTab_Layout_RadioButton_preview {
flex-grow: 1;
display: flex;
align-items: center;
padding: 10px;
}
.mx_RadioButton {
flex-grow: 0;
padding: 10px;
}
.mx_EventTile_content {
margin-right: 0;
}
}
.mx_RadioButton {
border-top: 1px solid $input-darker-bg-color;
}
.mx_RadioButton_checked {
background-color: rgba($accent-color, 0.08);
}
}