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 position: relative; | 8 position: relative; |
9 background-color: rgb(0, 0, 0); | 9 background-color: rgb(0, 0, 0); |
10 overflow: hidden; | 10 overflow: hidden; |
(...skipping 89 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
100 box-shadow: rgb(255, 255, 255) 0 0 3px; | 100 box-shadow: rgb(255, 255, 255) 0 0 3px; |
101 } | 101 } |
102 | 102 |
103 .responsive-design-page-scale-container .responsive-design-page-scale-button.sta
tus-bar-item > .glyph { | 103 .responsive-design-page-scale-container .responsive-design-page-scale-button.sta
tus-bar-item > .glyph { |
104 background-color: rgb(180, 180, 180); | 104 background-color: rgb(180, 180, 180); |
105 -webkit-mask-image: url(Images/responsiveDesign.png); | 105 -webkit-mask-image: url(Images/responsiveDesign.png); |
106 -webkit-mask-size: 112px 16px; | 106 -webkit-mask-size: 112px 16px; |
107 opacity: 1; | 107 opacity: 1; |
108 } | 108 } |
109 | 109 |
110 .responsive-design-page-scale-container .status-bar-item .glyph.shadow { | |
111 background-color: black !important; | |
112 } | |
113 | |
114 @media (-webkit-min-device-pixel-ratio: 1.5) { | 110 @media (-webkit-min-device-pixel-ratio: 1.5) { |
115 .responsive-design-page-scale-container .responsive-design-page-scale-button
.status-bar-item > .glyph { | 111 .responsive-design-page-scale-container .responsive-design-page-scale-button
.status-bar-item > .glyph { |
116 -webkit-mask-image: url(Images/responsiveDesign_2x.png); | 112 -webkit-mask-image: url(Images/responsiveDesign_2x.png); |
117 } | 113 } |
118 } /* media */ | 114 } /* media */ |
119 | 115 |
120 .responsive-design-page-scale-increase > .glyph { | 116 .responsive-design-page-scale-increase > .glyph { |
121 -webkit-mask-position: -81px 1px; | 117 -webkit-mask-position: -81px 1px; |
122 } | 118 } |
123 | 119 |
(...skipping 22 matching lines...) Expand all Loading... |
146 .responsive-design-section { | 142 .responsive-design-section { |
147 display: flex; | 143 display: flex; |
148 flex: none; | 144 flex: none; |
149 flex-direction: column; | 145 flex-direction: column; |
150 white-space: nowrap; | 146 white-space: nowrap; |
151 align-items: stretch; | 147 align-items: stretch; |
152 justify-content: flex-start; | 148 justify-content: flex-start; |
153 padding-top: 1px; | 149 padding-top: 1px; |
154 } | 150 } |
155 | 151 |
156 .responsive-design-section .status-bar-item .glyph.shadow { | |
157 background-color: black !important; | |
158 } | |
159 | |
160 | |
161 .responsive-design-section-decorator { | 152 .responsive-design-section-decorator { |
162 height: 2px; | 153 height: 2px; |
163 margin-left: -2px; | 154 margin-left: -2px; |
164 margin-right: -1px; | 155 margin-right: -1px; |
165 position: relative; | 156 position: relative; |
166 } | 157 } |
167 | 158 |
168 .responsive-design-suite { | 159 .responsive-design-suite { |
169 display: flex; | 160 display: flex; |
170 flex-direction: row; | 161 flex-direction: row; |
(...skipping 287 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
458 margin-right: 5px; | 449 margin-right: 5px; |
459 text-decoration: underline; | 450 text-decoration: underline; |
460 cursor: pointer; | 451 cursor: pointer; |
461 } | 452 } |
462 | 453 |
463 .responsive-design-toggle-media-inspector .glyph { | 454 .responsive-design-toggle-media-inspector .glyph { |
464 background-color: rgb(180, 180, 180); | 455 background-color: rgb(180, 180, 180); |
465 -webkit-mask-position: -128px -48px; | 456 -webkit-mask-position: -128px -48px; |
466 } | 457 } |
467 | 458 |
468 .responsive-design-toolbar button.responsive-design-toggle-media-inspector.toggl
ed-on .glyph:not(.shadow) { | 459 .responsive-design-toolbar button.responsive-design-toggle-media-inspector.toggl
ed-on .glyph { |
469 background-color: rgb(105, 194, 236) !important; | 460 background-color: rgb(105, 194, 236) !important; |
470 } | 461 } |
471 | 462 |
472 /* Media query inspector */ | 463 /* Media query inspector */ |
473 | 464 |
474 .responsive-design-media-container { | 465 .responsive-design-media-container { |
475 position: absolute; | 466 position: absolute; |
476 right: 0; | 467 right: 0; |
477 top: 0; | 468 top: 0; |
478 padding-bottom: 5px; | 469 padding-bottom: 5px; |
(...skipping 77 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
556 pointer-events: none; | 547 pointer-events: none; |
557 } | 548 } |
558 | 549 |
559 .media-inspector-label-right { | 550 .media-inspector-label-right { |
560 right: 4px; | 551 right: 4px; |
561 } | 552 } |
562 | 553 |
563 .media-inspector-label-left { | 554 .media-inspector-label-left { |
564 left: 4px; | 555 left: 4px; |
565 } | 556 } |
OLD | NEW |