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

Side by Side Diff: third_party/WebKit/Source/devtools/front_end/resources/resourcesSidebar.css

Issue 2660893002: DevTools: migrate ResourcesPanel icons over to UI.Icon (Closed)
Patch Set: resourceicon-* into mediumicon-* Created 3 years, 10 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 /* 1 /*
2 * Copyright 2016 The Chromium Authors. All rights reserved. 2 * Copyright 2016 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 .tree-outline { 7 .tree-outline {
8 padding-left: 0; 8 padding-left: 0;
9 color: rgb(90, 90, 90); 9 color: rgb(90, 90, 90);
10 } 10 }
11 11
12 .tree-outline > ol { 12 .tree-outline > ol {
13 padding-bottom: 10px; 13 padding-bottom: 10px;
14 } 14 }
15 15
16 .icon {
17 width: 16px;
18 height: 16px;
19 margin-right: 4px;
20 }
21
22 .tree-outline li { 16 .tree-outline li {
23 min-height: 20px; 17 min-height: 20px;
24 } 18 }
25 19
26 li.storage-group-list-item { 20 li.storage-group-list-item {
27 border-top: 1px solid rgb(230, 230, 230); 21 border-top: 1px solid rgb(230, 230, 230);
28 padding: 10px 8px 6px 8px; 22 padding: 10px 8px 6px 8px;
29 } 23 }
30 24
31 li.storage-group-list-item::before { 25 li.storage-group-list-item::before {
32 display: none; 26 display: none;
33 } 27 }
34 28
35 .navigator-tree-item .icon { 29 .navigator-tree-item {
36 -webkit-mask-image: url(Images/toolbarButtonGlyphs.png); 30 margin: -3px -7px -3px -7px;
37 -webkit-mask-size: 352px 168px;
38 width: 32px;
39 height: 20px;
40 -webkit-mask-position: -224px -72px;
41 position: relative;
42 top: -2px;
43 margin-right: -3px;
44 margin-left: -9px;
45 } 31 }
46 32
47 @media (-webkit-min-device-pixel-ratio: 1.1) { 33 .navigator-file-tree-item {
48 .navigator-tree-item .icon {
49 -webkit-mask-image: url(Images/toolbarButtonGlyphs_2x.png);
50 }
51 } /* media */
52
53 .navigator-file-tree-item .icon {
54 -webkit-mask-position: -224px -72px;
55 background: linear-gradient(45deg, hsl(0, 0%, 50%), hsl(0, 0%, 70%)); 34 background: linear-gradient(45deg, hsl(0, 0%, 50%), hsl(0, 0%, 70%));
56 } 35 }
57 36
58 :focus .navigator-file-tree-item.selected .icon, 37 .navigator-folder-tree-item {
59 :focus .navigator-folder-tree-item.selected .icon,
60 :focus .navigator-frame-tree-item.selected .icon {
61 background: white !important;
62 }
63
64 .navigator-folder-tree-item .icon {
65 -webkit-mask-position: -64px -120px;
66 background: linear-gradient(45deg, hsl(210, 82%, 65%), hsl(210, 82%, 80%)); 38 background: linear-gradient(45deg, hsl(210, 82%, 65%), hsl(210, 82%, 80%));
67 } 39 }
68 40
69 .navigator-domain-tree-item .icon { 41 .navigator-frame-tree-item {
70 -webkit-mask-position: -160px -144px;
71 }
72
73 .navigator-frame-tree-item .icon {
74 -webkit-mask-position: -256px -144px;
75 background-color: #5a5a5a; 42 background-color: #5a5a5a;
76 } 43 }
77 44
78 .navigator-script-tree-item .icon { 45 .navigator-script-tree-item {
79 background: linear-gradient(45deg, hsl(48, 70%, 50%), hsl(48, 70%, 70%)); 46 background: linear-gradient(45deg, hsl(48, 70%, 50%), hsl(48, 70%, 70%));
80 } 47 }
81 48
82 .navigator-stylesheet-tree-item .icon { 49 .navigator-stylesheet-tree-item {
83 background: linear-gradient(45deg, hsl(256, 50%, 50%), hsl(256, 50%, 70%)); 50 background: linear-gradient(45deg, hsl(256, 50%, 50%), hsl(256, 50%, 70%));
84 } 51 }
85 52
86 .navigator-image-tree-item .icon, 53 .navigator-image-tree-item,
87 .navigator-font-tree-item .icon { 54 .navigator-font-tree-item {
88 background: linear-gradient(45deg, hsl(109, 33%, 50%), hsl(109, 33%, 70%)); 55 background: linear-gradient(45deg, hsl(109, 33%, 50%), hsl(109, 33%, 70%));
89 } 56 }
90 57
91 .resource-tree-item .icon { 58 .resource-tree-item {
92 -webkit-mask: url(Images/resourceGlyphs.png) no-repeat 0 0;
93 -webkit-mask-size: 140px 20px;
94 background: rgba(90, 90, 90, .7); 59 background: rgba(90, 90, 90, .7);
95 } 60 }
96
97 @media (-webkit-min-device-pixel-ratio: 1.1) {
98 .resource-tree-item .icon {
99 -webkit-mask-image: url(Images/resourceGlyphs_2x.png);
100 }
101 } /* media */
102
103 :focus .resource-tree-item.selected .icon {
104 background: white !important;
105 }
106
107 .database-tree-item .icon {
108 -webkit-mask-position: -60px 0;
109 }
110
111 .table-tree-item .icon {
112 -webkit-mask-position: -80px 0;
113 }
114
115 :focus .service-workers-tree-item.selected .icon {
116 -webkit-filter: invert();
117 }
118
119 .-theme-with-dark-background .service-workers-tree-item .icon,
120 {
121 -webkit-filter: invert(70%);
122 }
123
124 .cookie-tree-item .icon {
125 -webkit-mask-position: -120px 0;
126 }
127
128 .manifest-tree-item .icon {
129 -webkit-mask-position: 0 0;
130 }
131
132 .service-worker-tree-item .icon {
133 -webkit-mask-position: -20px 0;
134 }
135
136 .clear-storage-tree-item .icon {
137 -webkit-mask-position: -40px 0;
138 }
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698