OLD | NEW |
1 /* | 1 /* |
2 * Copyright 2014 The Chromium Authors. All rights reserved. | 2 * Copyright 2014 The Chromium Authors. All rights reserved. |
3 * Use of this source code is governed by a BSD-style license that can be | 3 * Use of this source code is governed by a BSD-style license that can be |
4 * found in the LICENSE file. | 4 * found in the LICENSE file. |
5 */ | 5 */ |
6 | 6 |
7 .responsive-design { | 7 .responsive-design { |
8 overflow: hidden; | 8 overflow: hidden; |
9 position: relative; | 9 position: relative; |
10 } | 10 } |
(...skipping 59 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
70 | 70 |
71 .responsive-design-resolution-width { | 71 .responsive-design-resolution-width { |
72 top: 0; | 72 top: 0; |
73 } | 73 } |
74 | 74 |
75 .responsive-design-resolution-height { | 75 .responsive-design-resolution-height { |
76 left: 0; | 76 left: 0; |
77 } | 77 } |
78 | 78 |
79 .responsive-design-toolbar { | 79 .responsive-design-toolbar { |
80 flex: 0 0 24px; | 80 flex: none; |
81 background-color: rgb(64, 64, 64); | 81 background-color: rgb(64, 64, 64); |
82 color: rgb(180, 180, 180); | 82 color: rgb(180, 180, 180); |
83 display: flex; | |
84 align-items: center; | |
85 border-bottom: 1px solid rgb(163, 163, 163); | |
86 white-space: nowrap; | |
87 } | 83 } |
88 | 84 |
89 .responsive-design-toolbar fieldset, | 85 .responsive-design-toolbar fieldset, |
90 .responsive-design-toolbar p { | 86 .responsive-design-toolbar p { |
91 margin: 0; | 87 margin: 0; |
92 padding: 0; | 88 padding: 0; |
93 border: 0; | 89 border: 0; |
94 display: inline-block; | 90 display: inline-block; |
95 } | 91 } |
96 | 92 |
97 .responsive-design-toolbar fieldset { | |
98 padding: 0 7px 0 0; | |
99 height: 23px; | |
100 } | |
101 | |
102 .responsive-design-toolbar .responsive-design-section { | 93 .responsive-design-toolbar .responsive-design-section { |
103 border-left: 1px solid rgb(163, 163, 163); | 94 display: inline-flex; |
104 } | 95 height: 24px; |
105 | 96 border: 1px solid rgb(163, 163, 163); |
106 .responsive-design-toolbar fieldset:first-child { | 97 border-left: none; |
107 border-right: none; | 98 margin-top: -1px; |
| 99 white-space: nowrap; |
| 100 align-items: center; |
| 101 padding-right: 3px; |
108 } | 102 } |
109 | 103 |
110 .responsive-design-toolbar .field-error-message { | 104 .responsive-design-toolbar .field-error-message { |
111 display: none; | 105 display: none; |
112 } | 106 } |
113 .responsive-design-toolbar fieldset > label { | |
114 display: inline-flex; | |
115 height: 22px; | |
116 align-items: center; | |
117 } | |
118 | 107 |
119 .responsive-design-toolbar input[type='text'] { | 108 .responsive-design-toolbar input[type='text'] { |
120 color: rgb(255, 156, 0); | 109 color: rgb(255, 156, 0); |
121 text-align: center; | 110 text-align: center; |
122 background-color: transparent; | 111 background-color: transparent; |
123 border: none; | 112 border: none; |
124 margin: 0; | 113 margin: 0; |
125 padding: 3px 0; | 114 padding: 3px 0; |
126 } | 115 } |
127 | 116 |
128 .responsive-design-toolbar input:disabled, | 117 .responsive-design-toolbar input:disabled, |
129 .responsive-design-toolbar button:disabled { | 118 .responsive-design-toolbar button:disabled { |
130 opacity: 0.7; | 119 opacity: 0.7; |
131 } | 120 } |
132 | 121 |
133 .responsive-design-toolbar input[type='checkbox'] { | 122 .responsive-design-toolbar input[type='checkbox'] { |
134 -webkit-appearance: none; | 123 -webkit-appearance: none; |
135 margin: 0 5px 0 7px; | 124 margin: 0 5px 0 7px; |
136 border: 1px solid rgb(45, 45, 45); | 125 border: 1px solid rgb(45, 45, 45); |
137 border-radius: 3px; | 126 border-radius: 3px; |
138 background-color: rgb(102, 102, 102); | 127 background-color: rgb(102, 102, 102); |
| 128 position: relative; |
| 129 top: 1px; |
139 } | 130 } |
140 | 131 |
141 .responsive-design-toolbar input[type='checkbox']:after { | 132 .responsive-design-toolbar input[type='checkbox']:after { |
142 content: ''; | 133 content: ''; |
143 line-height: 10px; | 134 line-height: 10px; |
144 position: absolute; | 135 position: absolute; |
145 cursor: pointer; | 136 cursor: pointer; |
146 width: 12px; | 137 width: 12px; |
147 height: 12px; | 138 height: 12px; |
148 background: none; | 139 background: none; |
149 } | 140 } |
150 | 141 |
151 .responsive-design-toolbar input[type='checkbox']:checked:after { | 142 .responsive-design-toolbar input[type='checkbox']:checked:after { |
152 background: rgb(220, 220, 220); | 143 background: rgb(220, 220, 220); |
153 } | 144 } |
154 | 145 |
155 .responsive-design-toolbar input.error-input { | 146 .responsive-design-toolbar input.error-input { |
156 color: red; | 147 color: red; |
157 text-decoration: line-through; | 148 text-decoration: line-through; |
158 } | 149 } |
159 | 150 |
160 .responsive-design-toolbar select { | 151 .responsive-design-toolbar select { |
161 width: 150px; | 152 width: 150px; |
162 background-color: transparent; | 153 background-color: transparent; |
163 color: rgb(255, 156, 0); | 154 color: rgb(255, 156, 0); |
164 border: 0; | 155 border: 0; |
165 margin-left: 10px; | 156 margin-left: 10px; |
166 line-height: 16px; | 157 line-height: 16px; |
| 158 position: relative; |
| 159 top: 1px; |
167 } | 160 } |
168 | 161 |
169 .responsive-design-toolbar input:focus { | 162 .responsive-design-toolbar input:focus { |
170 background-color: rgb(102, 102, 102) | 163 background-color: rgb(102, 102, 102) |
171 } | 164 } |
172 | 165 |
173 .responsive-design-icon { | 166 .responsive-design-icon { |
174 background-color: rgb(180, 180, 180); | 167 background-color: rgb(180, 180, 180); |
175 -webkit-mask-image: url(Images/responsiveDesign.png); | 168 -webkit-mask-image: url(Images/responsiveDesign.png); |
176 -webkit-mask-size: 48px 16px; | 169 -webkit-mask-size: 48px 16px; |
(...skipping 67 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
244 float: left; | 237 float: left; |
245 margin-right: 4px; | 238 margin-right: 4px; |
246 margin-left: 2px; | 239 margin-left: 2px; |
247 } | 240 } |
248 | 241 |
249 @media (-webkit-min-device-pixel-ratio: 1.5) { | 242 @media (-webkit-min-device-pixel-ratio: 1.5) { |
250 .responsive-design-warning::before { | 243 .responsive-design-warning::before { |
251 background-image: url(Images/statusbarButtonGlyphs_2x.png); | 244 background-image: url(Images/statusbarButtonGlyphs_2x.png); |
252 } | 245 } |
253 } /* media */ | 246 } /* media */ |
OLD | NEW |