Reformatted servo.css

As discussed in #10553, we should consider splitting the long lines in this file onto separate lines (one per css attribute), to make it more readable and maintainable in general.

I also added blank lines where I felt it was applicable.
This commit is contained in:
Per Lundberg 2016-05-15 00:27:47 +03:00
parent e2990766dc
commit d2469f0cde

View file

@ -1,26 +1,105 @@
button, button,
input { background: white; min-height: 1.0em; padding: 0em; padding-left: 0.25em; padding-right: 0.25em; border: solid lightgrey 1px; color: black; font-family: sans-serif; font-size: 0.7em; white-space: nowrap; text-align: left; line-height: 1.8; } input {
textarea { background: white; min-height: 1.0em; padding: 0em; padding-left: 0.25em; padding-right: 0.25em; border: solid lightgrey 1px; color: black; font-family: sans-serif; font-size: 0.7em; white-space: pre; } background: white;
min-height: 1.0em;
padding: 0em;
padding-left: 0.25em;
padding-right: 0.25em;
border: solid lightgrey 1px;
color: black;
font-family: sans-serif;
font-size: 0.7em;
white-space: nowrap;
text-align: left;
line-height: 1.8;
}
textarea {
background: white;
min-height: 1.0em;
padding: 0em;
padding-left: 0.25em;
padding-right: 0.25em;
border: solid lightgrey 1px;
color: black;
font-family: sans-serif;
font-size: 0.7em;
white-space: pre;
}
input::selection, input::selection,
textarea::selection { background: rgba(176, 214, 255, 1.0); color: black; } textarea::selection {
background: rgba(176, 214, 255, 1.0);
color: black;
}
button, button,
input[type="button"], input[type="button"],
input[type="submit"], input[type="submit"],
input[type="reset"] { background: lightgrey; border-top: solid 1px #EEEEEE; border-left: solid 1px #CCCCCC; border-right: solid 1px #999999; border-bottom: solid 1px #999999; text-align: center; vertical-align: middle; color: black; } input[type="reset"] {
input[type="hidden"] { display: none !important } background: lightgrey;
input[type="checkbox"], border-top: solid 1px #EEEEEE;
input[type="radio"] { font-family: monospace !important; border: none !important; background: transparent; } border-left: solid 1px #CCCCCC;
border-right: solid 1px #999999;
border-bottom: solid 1px #999999;
text-align: center;
vertical-align: middle;
color: black;
}
input[type="hidden"] { display: none !important }
input[type="checkbox"],
input[type="radio"] {
font-family: monospace !important;
border: none !important;
background: transparent;
}
input[type="checkbox"]::before {
display: inline-block;
border: solid currentcolor 1px;
content: "";
padding: 0;
width: 1em;
height: 1em;
text-align: center;
}
input[type="checkbox"]::before { display: inline-block; border: solid currentcolor 1px; content: ""; padding: 0; width: 1em; height: 1em; text-align: center; }
input[type="checkbox"]:checked::before { content: "✓"; } input[type="checkbox"]:checked::before { content: "✓"; }
input[type="checkbox"]:indeterminate::before { content: "-"; } input[type="checkbox"]:indeterminate::before { content: "-"; }
input[type="radio"]::before { display: inline-block; border: solid currentcolor 1px; content: ""; padding: 0; width: 1em; height: 1em; border-radius: 50%; text-align: center; }
input[type="radio"]::before {
display: inline-block;
border: solid currentcolor 1px;
content: "";
padding: 0;
width: 1em;
height: 1em;
border-radius: 50%;
text-align: center;
}
input[type="radio"]:checked::before { content: "●"; line-height: 1em; } input[type="radio"]:checked::before { content: "●"; line-height: 1em; }
select { border-style: solid; border-width: 1px; background: white; } select {
border-style: solid;
border-width: 1px;
background: white;
}
select[multiple] { padding: 0em 0.25em; } select[multiple] { padding: 0em 0.25em; }
select:not([multiple]) { padding: 0.25em 0.5em; border-radius: 6px; } select:not([multiple]) { padding: 0.25em 0.5em; border-radius: 6px; }
select:not([multiple])::after { content: ""; display: inline-block; border-width: 5.2px 3px 0 3px; border-style: solid; border-color: currentcolor transparent transparent transparent; margin-left: 0.5em; }
select:not([multiple])::after {
content: "";
display: inline-block;
border-width: 5.2px 3px 0 3px;
border-style: solid;
border-color: currentcolor transparent transparent transparent;
margin-left: 0.5em;
}
select:not([multiple]) option { display: none !important; } select:not([multiple]) option { display: none !important; }
select:not([multiple]) option[selected] { display: inline !important; } select:not([multiple]) option[selected] { display: inline !important; }
select[multiple] option { display: block !important; } select[multiple] option { display: block !important; }
@ -46,19 +125,23 @@ textarea {
details { details {
display: block; display: block;
} }
details::-servo-details-summary { details::-servo-details-summary {
margin-left: 40px; margin-left: 40px;
display: list-item; display: list-item;
list-style: disclosure-closed; list-style: disclosure-closed;
} }
details[open]::-servo-details-summary { details[open]::-servo-details-summary {
list-style: disclosure-open; list-style: disclosure-open;
} }
*|*::-servo-details-content { *|*::-servo-details-content {
margin-left: 40px; margin-left: 40px;
overflow: hidden; overflow: hidden;
display: block; display: block;
} }
/* /*
* Until servo supports svg properly, make sure to at least prevent svg * Until servo supports svg properly, make sure to at least prevent svg
* children from being layed out and rendered like usual html. * children from being layed out and rendered like usual html.