servo/resources/servo.css
bors-servo e65009f317 Auto merge of #10809 - perlun:sendoushi-master, r=jdm
Fixed line-height for input and textarea + use correct font

Fixes #10532.

Replaces #10553 since @Sendoushi had problems getting a proper rebase locally, so helping him out to get this merged.

(Credits to Sendoushi who did the actual changes; I'm just helping out to getting things into a mergeable state.)

<!-- Reviewable:start -->
---
This change is [<img src="https://reviewable.io/review_button.svg" height="35" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/10809)
<!-- Reviewable:end -->
2016-05-01 16:22:17 -07:00

67 lines
3.3 KiB
CSS

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; }
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,
textarea::selection { background: rgba(176, 214, 255, 1.0); color: black; }
button,
input[type="button"],
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="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"]:checked::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"]:checked::before { content: "●"; line-height: 1em; }
select { border-style: solid; border-width: 1px; background: white; }
select[multiple] { padding: 0em 0.25em; }
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]) option { display: none !important; }
select:not([multiple]) option[selected] { display: inline !important; }
select[multiple] option { display: block !important; }
select[multiple] option[selected] { background-color: grey; color: white; }
select[multiple]:focus option[selected] { background-color: darkblue; }
td[align="left"] { text-align: left; }
td[align="center"] { text-align: center; }
td[align="right"] { text-align: right; }
center { text-align: -servo-center; }
input:not([type=radio i]):not([type=checkbox i]):not([type=reset i]):not([type=button i]):not([type=submit i]),
textarea {
cursor: text;
overflow: hidden;
-servo-overflow-clip-box: content-box;
}
// https://html.spec.whatwg.org/multipage/rendering.html#the-details-and-summary-elements
details {
display: block;
}
details::-servo-details-summary {
margin-left: 40px;
display: list-item;
list-style: disclosure-closed;
}
details[open]::-servo-details-summary {
list-style: disclosure-open;
}
*|*::-servo-details-content {
margin-left: 40px;
overflow: hidden;
display: block;
}
/*
* Until servo supports svg properly, make sure to at least prevent svg
* children from being layed out and rendered like usual html.
* https://github.com/servo/servo/issues/10646
*/
svg > * {
display: none;
}