1/* Copyright 2013 The Chromium Authors. All rights reserved.
2 * Use of this source code is governed by a BSD-style license that can be
3 * found in the LICENSE file. */
4
5button.white-button,
6button.blue-button {
7  border: 5px solid transparent;
8  box-sizing: content-box;
9  cursor: default;
10  height: 21px;
11  line-height: 21px;
12  margin: 0;
13  min-height: 21px;
14  min-width: 55px;
15  padding: 0 10px;
16  position: relative;
17  outline: none;
18  text-align: center;
19  z-index: 1;
20}
21
22button.white-button {
23  border-image: -webkit-image-set(
24    url('chrome://resources/images/apps/button.png') 1x,
25    url('chrome://resources/images/2x/apps/button.png')
26        2x) 5 fill / 5px / 2px repeat;
27}
28
29button.white-button:hover {
30  border-image: -webkit-image-set(
31    url('chrome://resources/images/apps/button_hover.png') 1x,
32    url('chrome://resources/images/2x/apps/button_hover.png')
33        2x) 5 fill / 5px / 2px repeat;
34}
35
36button.white-button:active {
37  border-image: -webkit-image-set(
38    url('chrome://resources/images/apps/button_pressed.png') 1x,
39    url('chrome://resources/images/2x/apps/button_pressed.png')
40        2x) 5 fill / 5px / 2px repeat;
41}
42
43button.white-button:focus {
44  border-image: -webkit-image-set(
45    url('chrome://resources/images/apps/button_focused.png') 1x,
46    url('chrome://resources/images/2x/apps/button_focused.png')
47        2x) 5 fill / 5px / 2px repeat;
48}
49
50button.white-button:focus:hover {
51  border-image: -webkit-image-set(
52    url('chrome://resources/images/apps/button_focused_hover.png') 1x,
53    url('chrome://resources/images/2x/apps/button_focused_hover.png')
54        2x) 5 fill / 5px / 2px repeat;
55}
56
57button.white-button:focus:active {
58  border-image: -webkit-image-set(
59    url('chrome://resources/images/apps/button_focused_pressed.png') 1x,
60    url('chrome://resources/images/2x/apps/button_focused_pressed.png')
61        2x) 5 fill / 5px / 2px repeat;
62}
63
64button.white-button[disabled] {
65  border-image: -webkit-image-set(
66    url('chrome://resources/images/apps/button_inactive.png') 1x,
67    url('chrome://resources/images/2x/apps/button_inactive.png')
68        2x) 5 fill / 5px / 2px repeat;
69}
70
71button.blue-button {
72  border-image: -webkit-image-set(
73    url('chrome://resources/images/apps/blue_button.png') 1x,
74    url('chrome://resources/images/2x/apps/blue_button.png')
75        2x) 5 fill / 5px / 2px repeat;
76}
77
78button.blue-button:hover {
79  border-image: -webkit-image-set(
80    url('chrome://resources/images/apps/blue_button_hover.png') 1x,
81    url('chrome://resources/images/2x/apps/blue_button_hover.png')
82        2x) 5 fill / 5px / 2px repeat;
83}
84
85button.blue-button:active {
86  border-image: -webkit-image-set(
87    url('chrome://resources/images/apps/blue_button_pressed.png') 1x,
88    url('chrome://resources/images/2x/apps/blue_button_pressed.png')
89        2x) 5 fill / 5px / 2px repeat;
90}
91
92button.blue-button:focus {
93  border-image: -webkit-image-set(
94    url('chrome://resources/images/apps/blue_button_focused.png') 1x,
95    url('chrome://resources/images/2x/apps/blue_button_focused.png')
96        2x) 5 fill / 5px / 2px repeat;
97}
98
99button.blue-button:focus:hover {
100  border-image: -webkit-image-set(
101    url('chrome://resources/images/apps/blue_button_focused_hover.png') 1x,
102    url('chrome://resources/images/2x/apps/blue_button_focused_hover.png')
103        2x) 5 fill / 5px / 2px repeat;
104}
105
106button.blue-button:focus:active {
107  border-image: -webkit-image-set(
108    url('chrome://resources/images/apps/blue_button_focused_pressed.png') 1x,
109    url('chrome://resources/images/2x/apps/blue_button_focused_pressed.png')
110        2x) 5 fill / 5px / 2px repeat;
111}
112
113button.blue-button[disabled] {
114  border-image: -webkit-image-set(
115    url('chrome://resources/images/apps/blue_button_inactive.png') 1x,
116    url('chrome://resources/images/2x/apps/blue_button_inactive.png')
117        2x) 5 fill / 5px / 2px repeat;
118}
119
120input[type='checkbox'] {
121  -webkit-appearance: none;
122  border: none;
123  outline: none;
124}
125
126input[type='checkbox']::after {
127  content: '';
128  display: block;
129  height: 16px;
130  left: -2px;
131  top: -2px;
132  width: 16px;
133}
134
135input[type='checkbox']:not(:checked)::after {
136  background-image: -webkit-image-set(
137    url('chrome://resources/images/apps/checkbox.png') 1x,
138    url('chrome://resources/images/2x/apps/checkbox.png') 2x);
139}
140
141input[type='checkbox']:focus:not(:checked)::after {
142  background-image: -webkit-image-set(
143    url('chrome://resources/images/apps/checkbox_focused.png') 1x,
144    url('chrome://resources/images/2x/apps/checkbox_focused.png') 2x);
145}
146
147input[type='checkbox']:disabled:not(:checked)::after {
148  background-image: -webkit-image-set(
149    url('chrome://resources/images/apps/checkbox_inactive.png') 1x,
150    url('chrome://resources/images/2x/apps/checkbox_inactive.png') 2x);
151}
152
153input[type='checkbox']:checked::after {
154  background-image: -webkit-image-set(
155    url('chrome://resources/images/apps/checkbox_checked.png') 1x,
156    url('chrome://resources/images/2x/apps/checkbox_checked.png') 2x);
157}
158
159input[type='checkbox']:focus:checked::after {
160  background-image: -webkit-image-set(
161    url('chrome://resources/images/apps/checkbox_focused_checked.png') 1x,
162    url('chrome://resources/images/2x/apps/checkbox_focused_checked.png') 2x);
163}
164
165input[type='checkbox']:disabled:checked::after {
166  background-image: -webkit-image-set(
167    url('chrome://resources/images/apps/checkbox_checked_inactive.png') 1x,
168    url('chrome://resources/images/2x/apps/checkbox_checked_inactive.png') 2x);
169}
170