Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(119)

Side by Side Diff: chrome/browser/resources/options/chromeos/storage_manager.css

Issue 2078153002: Storage manager: Add conditional messages for disk low situation and update design. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Use svg. Created 4 years, 6 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 /* Copyright 2016 The Chromium Authors. All rights reserved. 1 /* Copyright 2016 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 #storageManagerPage { 5 #storageManagerPage {
6 min-width: 320px; 6 width: 400px;
7 }
8
9 .storage-manager-section {
10 margin: 0 40px;
11 }
12
13 .storage-manager-section:not(:last-child) {
14 margin-bottom: 28px;
7 } 15 }
8 16
9 .storage-manager-item, 17 .storage-manager-item,
10 .storage-manager-subitem { 18 .storage-manager-subitem {
11 -webkit-padding-end: 20px;
12 display: flex; 19 display: flex;
13 font-size: 108.33%; /* go to 13px from 12px */ 20 font-size: 108.33%; /* go to 13px from 12px */
14 justify-content: space-between; 21 justify-content: space-between;
15 margin: 12px 0; 22 margin: 12px 0;
16 } 23 }
17 24
18 .storage-manager-item { 25 .storage-manager-item {
19 -webkit-padding-start: 20px; 26 font-weight: 500;
20 }
21
22 .storage-manager-subitem {
23 -webkit-padding-start: 40px;
24 } 27 }
25 28
26 .storage-manager-item-size { 29 .storage-manager-item-size {
27 color: rgb(153, 153, 153); 30 color: rgb(153, 153, 153);
28 } 31 }
32
33 .critically-low-space #storage-manager-message-critically-low-space,
34 .low-space #storage-manager-message-low-space {
35 display: block;
36 }
37
38 .storage-manager-message-area {
39 background-color: rgb(245, 245, 245);
40 display: none;
41 padding: 20px 24px;
42 }
43
44 .storage-manager-message-area img {
45 height: 20px;
46 width: 20px;
47 }
48
49 .storage-manager-message-title {
50 align-items: center;
51 display: flex;
52 }
53
54 .storage-manager-message-title span {
55 font-size: 115%;
56 font-weight: 500;
57 margin: 0 10px;
58 }
59
60 .storage-manager-message-area p {
61 color: rgb(90, 90, 90);
62 }
63
64 #storage-bar-progress {
65 -webkit-appearance: none;
66 display: block;
67 height: 6px;
68 width: 100%;
69 }
70
71 #storage-bar-progress::-webkit-progress-bar {
72 background-color: rgb(229, 229, 229);
73 border-radius: 3px;
74 }
75
76 #storage-bar-progress::-webkit-progress-value {
77 background-color: rgb(74, 144, 226);
78 border-radius: 3px;
79 }
80
81 .critically-low-space #storage-bar-progress::-webkit-progress-value {
82 background-color: rgb(219, 68, 55);
83 }
84
85 .low-space #storage-bar-progress::-webkit-progress-value {
86 background-color: rgb(255, 176, 0);
87 }
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698