| 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 |