Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

css: Use SCSS nesting in components.scss for `.new-style`.

This commit is contained in:
Vaibhav 2019-05-23 22:37:00 +05:30 committed by Tim Abbott
parent f6051d8819
commit eed09527d5
1 changed files with 42 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
static/styles/components.scss
View File

@ -1,17 +1,16 @@
/* Reusable, object-oriented CSS base components for all Zulip pages /* Reusable, object-oriented CSS base components for all Zulip pages
(both webapp and portico). */ (both webapp and portico). */
.new-style label.checkbox { .new-style {
label.checkbox {
padding: 0px; padding: 0px;
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
}
.new-style label.checkbox input[type=checkbox] { input[type=checkbox] {
display: none; display: none;
}
.new-style label.checkbox input[type=checkbox] ~ span { ~ span {
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
position: relative; position: relative;
@ -33,24 +32,27 @@
-webkit-filter: brightness(0.80); -webkit-filter: brightness(0.80);
cursor: pointer; cursor: pointer;
} }
.new-style label.checkbox input[type=checkbox]:checked ~ span { &:checked ~ span {
color: transparent; color: transparent;
background-image: url(/static/images/checkbox.svg); background-image: url(/static/images/checkbox.svg);
background-size: 85%; background-size: 85%;
background-position: 50% 50%; background-position: 50% 50%;
background-repeat: no-repeat; background-repeat: no-repeat;
} }
.new-style label.checkbox input[type=checkbox]:disabled ~ span { &:disabled ~ span {
opacity: 0.50; opacity: 0.50;
cursor: default; cursor: default;
} }
}
}
.new-style a.no-style { a.no-style {
color: inherit; color: inherit;
}
} }
a.no-underline, a.no-underline,