PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Tweak Settings padding / margin slightly

Browse source 
This makes a few small tweaks to Settings padding and margin, but more is still
needed. I am told that https://github.com/vector-im/riot-web/issues/10554 will
soon take a holistic view on the problem, so this is a more conservation
temporary change.
This commit is contained in:
J. Ryan Stinnett 2019-08-19 15:45:04 +01:00
parent 5af9bf7b80
commit 8a7b43fd1a
1 changed files with 11 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
res/css/views/settings/tabs/_SettingsTab.scss
View file

@ -24,6 +24,10 @@ limitations under the License.
color: $primary-fg-color; color: $primary-fg-color;
} }
.mx_SettingsTab_heading:nth-child(n + 2) {
margin-top: 30px;
}
.mx_SettingsTab_subheading { .mx_SettingsTab_subheading {
font-size: 16px; font-size: 16px;
display: block; display: block;
@ -37,9 +41,8 @@ limitations under the License.
.mx_SettingsTab_subsectionText { .mx_SettingsTab_subsectionText {
color: $settings-subsection-fg-color; color: $settings-subsection-fg-color;
font-size: 14px; font-size: 14px;
padding-bottom: 12px;
display: block; display: block;
margin: 0 100px 0 0; // Align with the rest of the view margin: 10px 100px 10px 0; // Align with the rest of the view
} }
.mx_SettingsTab_section .mx_SettingsFlag { .mx_SettingsTab_section .mx_SettingsFlag {
@ -68,9 +71,14 @@ limitations under the License.
} }
.mx_SettingsTab .mx_SettingsTab_subheading:nth-child(n + 2) { .mx_SettingsTab .mx_SettingsTab_subheading:nth-child(n + 2) {
// TODO: This `nth-child(n + 2)` isn't working very well since many sections
// add intermediate elements (mostly because our version of React requires
// them) which throws off the numbering and results in many subheading
// missing margins.
// See also https://github.com/vector-im/riot-web/issues/10554
// These views have a lot of the same repetitive information on it, so // These views have a lot of the same repetitive information on it, so
// give them more visual distinction between the sections. // give them more visual distinction between the sections.
margin-top: 30px; margin-top: 25px;
} }
.mx_SettingsTab a { .mx_SettingsTab a {