css: Use SCSS nesting in settings.scss for `#settings_page`.

This commit is contained in:
majordwarf 2020-05-09 17:36:05 +05:30 committed by Tim Abbott
parent aff0129a6a
commit 71415e5b89
1 changed files with 72 additions and 68 deletions

View File

@ -460,89 +460,93 @@ input[type=checkbox] {
margin-bottom: 10px; margin-bottom: 10px;
} }
#settings_page .icon-button { #settings_page {
border-radius: 5px; .icon-button {
border: 1px solid hsl(0, 0%, 80%); border-radius: 5px;
font-size: 14px; border: 1px solid hsl(0, 0%, 80%);
padding: 3px 14px 4px 11px; font-size: 14px;
text-decoration: none; padding: 3px 14px 4px 11px;
color: hsl(0, 0%, 47%); text-decoration: none;
min-width: 80px; color: hsl(0, 0%, 47%);
line-height: 16px; min-width: 80px;
} line-height: 16px;
#settings_page .icon-button:hover { &:hover {
background-color: hsl(0, 0%, 100%); background-color: hsl(0, 0%, 100%);
border: 1px solid hsl(0, 0%, 61%); border: 1px solid hsl(0, 0%, 61%);
color: hsl(0, 0%, 18%); color: hsl(0, 0%, 18%);
}
#settings_page .icon-button:hover .icon-button-icon { .icon-button-icon {
color: hsl(0, 0%, 47%); color: hsl(0, 0%, 47%);
} }
}
#settings_page .icon-button.primary { &.primary {
background-color: hsl(156, 30%, 50%); background-color: hsl(156, 30%, 50%);
color: hsl(0, 0%, 100%); color: hsl(0, 0%, 100%);
border: 1px solid hsl(155, 30%, 50%); border: 1px solid hsl(155, 30%, 50%);
}
#settings_page .icon-button.primary:hover { &:hover {
background-color: hsl(166, 35%, 57%); background-color: hsl(166, 35%, 57%);
border: 1px solid hsl(166, 35%, 57%); border: 1px solid hsl(166, 35%, 57%);
} }
#settings_page .icon-button.primary .icon-button-icon { .icon-button-icon {
font-weight: lighter; font-weight: lighter;
color: hsl(0, 0%, 100%); color: hsl(0, 0%, 100%);
} }
#settings_page .icon-button.save-button.saving { &.saving {
background-color: hsl(156, 14%, 40%); background-color: hsl(156, 14%, 40%);
border-color: hsl(156, 14%, 40%); border-color: hsl(156, 14%, 40%);
} }
}
#settings_page .icon-button .icon-button-icon { .icon-button-icon {
vertical-align: bottom; vertical-align: bottom;
margin-right: 3px; margin-right: 3px;
margin-bottom: 1px; margin-bottom: 1px;
font-size: 15px; font-size: 15px;
font-weight: 500; font-weight: 500;
} }
}
#settings_page .save-button-controls { .save-button-controls {
display: inline; display: inline;
margin-left: 15px; margin-left: 15px;
}
#settings_page .save-button-controls.hide { &.hide {
display: none; display: none;
} }
}
#settings_page .save-button { .save-button {
margin-right: 5px; margin-right: 5px;
}
#settings_page .save-button .icon-button-loading { .icon-button-loading {
display: none; display: none;
} }
#settings_page .save-button.saving .icon-button-icon { &.saving {
display: none; .icon-button-icon {
} display: none;
}
#settings_page .save-button.saving .icon-button-loading { .icon-button-loading {
display: inline-block; display: inline-block;
margin-right: 2px; margin-right: 2px;
} }
}
}
#settings_page .admin-realm-time-limit-input { .admin-realm-time-limit-input {
width: 5ch; width: 5ch;
text-align: right; text-align: right;
} }
#settings_page .realm-time-limit-label { .realm-time-limit-label {
vertical-align: middle; vertical-align: middle;
}
} }
#google_hangouts_domain, #google_hangouts_domain,