Chromium Code Reviews Chromium Code Reviews
Issue 1487283005:
Implement the new Sync Confirmation dialog on Linux and Windows. (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master| Index: chrome/browser/resources/sync_confirmation/sync_confirmation.css |
| diff --git a/chrome/browser/resources/sync_confirmation/sync_confirmation.css b/chrome/browser/resources/sync_confirmation/sync_confirmation.css |
| new file mode 100644 |
| index 0000000000000000000000000000000000000000..197b353aff818b4819031e506a8c33ab1bea4385 |
| --- /dev/null |
| +++ b/chrome/browser/resources/sync_confirmation/sync_confirmation.css |
| @@ -0,0 +1,101 @@ |
| +/* Copyright 2015 The Chromium Authors. All rights reserved. |
| + * Use of this source code is governed by a BSD-style license that can be |
| + * found in the LICENSE file. */ |
| + |
| +body { |
| + font-size: 100%; |
|
Dan Beam
2016/01/22 01:26:58
wait, why are you doing this? to override this ru
anthonyvd
2016/01/22 17:19:56
Yes, although I should have adjusted my em values
Dan Beam
2016/03/04 00:26:48
i think the <body> (default font-size) should be 8
|
| + margin: 0; |
| + padding: 0; |
| +} |
| + |
| +a { |
| + color: rgb(85, 149, 254); |
| + text-decoration: none; |
| +} |
| + |
| +.picture img { |
| + border-radius: 50%; |
| + max-height: 100%; |
| + max-width: 100%; |
| +} |
| + |
| +.container { |
| + background-color: white; |
| + height: 351px; |
| + overflow: hidden; |
| + width: 448px; |
|
Dan Beam
2016/01/22 01:26:58
where are these dimensions from? do they assume E
anthonyvd
2016/01/22 17:19:56
They're from our designer mocks. I don't think the
|
| +} |
| + |
| +.top-title-bar { |
| + -webkit-padding-start: 24px; |
|
Dan Beam
2016/01/22 01:26:58
this only adds padding on one end (the start)
anthonyvd
2016/01/22 17:19:56
Done.
|
| + align-items: center; |
| + border-bottom: 1px solid lightgray; |
| + color: #333; |
| + display: flex; |
| + font-size: 1em; |
| + height: 56px; |
| +} |
| + |
| +.details { |
| + height: 250px; |
| + padding: 20px 24px; |
| +} |
| + |
| +.sync-message { |
| + color: #595959; |
| + font-size: 0.8125em; |
| + line-height: 150%; |
| + padding-bottom: 32px; |
| +} |
| + |
| +.picture-container { |
| + align-items: center; |
| + display: flex; |
| + justify-content: center; |
| + padding-bottom: 32px; |
| +} |
| + |
| +.picture { |
| + height: 96px; |
| + position: relative; |
| + width: 96px; |
| +} |
| + |
| +#profile-picture, |
| +.checkmark-bubble { |
| + position: absolute; |
| +} |
| + |
| +.checkmark-bubble { |
|
Dan Beam
2016/01/22 01:26:58
are you duplicating <paper-checkbox>?
anthonyvd
2016/01/22 17:19:56
I'm not. This isn't a checkbox, it's the white che
|
| + background-color: white; |
| + background-image: url(//resources/images/check_circle.svg); |
|
Dan Beam
2016/01/22 01:26:57
nit: use a local path (i.e ../../../../ui/webui/re
anthonyvd
2016/01/22 17:19:56
background-image: url(../../../../ui/webui/resourc
|
| + background-size: 100%; |
| + border: 1px solid white; |
| + border-radius: 50%; |
| + display: inline-block; |
| + height: 30px; |
| + left: 64px; |
|
Dan Beam
2016/01/22 01:26:58
still want to see how this is used
fwiw: blink do
anthonyvd
2016/01/22 17:19:56
See above comment for a screenshot and some explan
|
| + top: 66px; |
| + width: 30px; |
| +} |
| + |
| +.action-container { |
| + align-items: baseline; |
| + display: flex; |
| + justify-content: flex-end; |
| +} |
| + |
| +paper-button { |
| + font-size: 0.8125em; |
| + padding-left: 12px; |
| + padding-right: 12px; |
| +} |
| + |
| +#confirmButton { |
| + background-color: rgb(66, 133, 244); |
| + color: white; |
| +} |
| + |
| +#undoButton { |
| + color: #5A5A5A; |
| +} |
