| OLD | NEW |
| 1 /* Copyright 2014 The Chromium Authors. All rights reserved. | 1 /* Copyright 2014 The Chromium Authors. All rights reserved. |
| 2 * Use of this source code is governed by a BSD-style license that can be | 2 * Use of this source code is governed by a BSD-style license that can be |
| 3 * found in the LICENSE file. | 3 * found in the LICENSE file. |
| 4 * | 4 * |
| 5 * Css based bubble. | 5 * Css based bubble. |
| 6 */ | 6 */ |
| 7 | 7 |
| 8 .bubble { | 8 .bubble { |
| 9 background: rgba(0, 0, 0, 0.8); | 9 background: rgba(0, 0, 0, 0.8); |
| 10 border-radius: 2px; | 10 border-radius: 2px; |
| 11 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); | 11 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); |
| 12 color: rgba(255, 255, 255, 0.87); | 12 color: rgba(255, 255, 255, 0.87); |
| 13 font-size: 12px; | 13 font-size: 12px; |
| 14 margin: 2px; | 14 margin: 2px; |
| 15 max-width: 250px; | 15 max-width: 250px; |
| 16 padding: 8px; | 16 padding: 8px; |
| 17 position: absolute; | 17 position: absolute; |
| 18 transition: opacity 200ms ease-in-out; | 18 transition: opacity 200ms ease-in-out; |
| 19 } | 19 } |
| 20 | 20 |
| 21 body.chromeos .bubble { |
| 22 padding: 16px; |
| 23 } |
| 24 |
| 21 /* --- oldstyle begin --- */ | 25 /* --- oldstyle begin --- */ |
| 22 | 26 |
| 23 .bubble[oldstyle] { | 27 .bubble[oldstyle] { |
| 24 background: white; | 28 background: white; |
| 25 border: 1px solid rgba(0, 0, 0, 0.25); | 29 border: 1px solid rgba(0, 0, 0, 0.25); |
| 26 color: unset; | 30 color: unset; |
| 27 } | 31 } |
| 28 | 32 |
| 29 .bubble[oldstyle]::before { | 33 .bubble[oldstyle]::before { |
| 30 border-style: solid; | 34 border-style: solid; |
| (...skipping 86 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 117 | 121 |
| 118 html[dir=ltr] .bubble-left::after, | 122 html[dir=ltr] .bubble-left::after, |
| 119 html[dir=rtl] .bubble-right::after { | 123 html[dir=rtl] .bubble-right::after { |
| 120 border-color: transparent transparent transparent white; | 124 border-color: transparent transparent transparent white; |
| 121 right: -15px; | 125 right: -15px; |
| 122 top: 17px; | 126 top: 17px; |
| 123 } | 127 } |
| 124 | 128 |
| 125 /* --- oldstyle end --- */ | 129 /* --- oldstyle end --- */ |
| 126 | 130 |
| 127 .error-message-bubble::before { | 131 body.chromeos .error-message-bubble::before { |
| 128 -webkit-mask-image: url(../../ui/webui/resources/images/warning.svg); | 132 -webkit-mask-image: url(../../ui/webui/resources/images/warning.svg); |
| 129 -webkit-mask-position: left top; | 133 -webkit-mask-position: left top; |
| 130 -webkit-mask-repeat: no-repeat; | 134 -webkit-mask-repeat: no-repeat; |
| 131 -webkit-mask-size: 20px; | 135 -webkit-mask-size: 20px; |
| 132 background-color: rgb(255,255,255); | 136 background-color: rgb(255,255,255); |
| 133 content: ''; | 137 content: ''; |
| 134 display: block; | 138 display: block; |
| 135 height: 20px; | 139 height: 20px; |
| 136 left: 8px; | 140 left: 8px; |
| 137 position: absolute; | 141 position: absolute; |
| 138 top: 8px; | 142 top: 8px; |
| 139 width: 20px; | 143 width: 20px; |
| 140 } | 144 } |
| 141 | 145 |
| 142 .error-message-bubble { | 146 body:not(.chromeos) .error-message-bubble { |
| 147 -webkit-padding-start: 30px; |
| 148 background: url(chrome://theme/IDR_WARNING) left top no-repeat; |
| 149 background-size: 24px; |
| 150 } |
| 151 |
| 152 body.chromeos .error-message-bubble { |
| 143 -webkit-padding-start: 20px; | 153 -webkit-padding-start: 20px; |
| 144 } | 154 } |
| 145 | 155 |
| 146 .bubble[match-width] .error-message-bubble { | 156 .bubble[match-width] .error-message-bubble { |
| 147 -webkit-padding-start: unset; | 157 -webkit-padding-start: unset; |
| 148 padding-top: 20px; | 158 padding-top: 20px; |
| 149 } | 159 } |
| 150 | 160 |
| 151 .bubble a { | 161 body.chromeos .bubble a { |
| 152 color: #7baaf7; | 162 color: #7baaf7; |
| 153 text-decoration: none; | 163 text-decoration: none; |
| 154 } | 164 } |
| 155 | 165 |
| 156 .error-message-bubble-padding { | 166 .error-message-bubble-padding { |
| 157 margin-bottom: 10px; | 167 margin-bottom: 10px; |
| 158 } | 168 } |
| 159 | 169 |
| 160 html[dir=rtl] .error-message-bubble { | 170 html[dir=rtl] .error-message-bubble { |
| 161 background-position: right top; | 171 background-position: right top; |
| 162 } | 172 } |
| OLD | NEW |