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

Side by Side Diff: Source/devtools/front_end/ui/splitWidget.css

Issue 1113813002: [DevTools] Rename View to Widget. (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: rebased Created 5 years, 7 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 | Annotate | Revision Log
« no previous file with comments | « Source/devtools/front_end/ui/splitView.css ('k') | Source/devtools/front_end/ui/treeoutline.js » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 /* 1 /*
2 * Copyright (C) 2011 Google Inc. All rights reserved. 2 * Copyright (C) 2011 Google Inc. All rights reserved.
3 * 3 *
4 * Redistribution and use in source and binary forms, with or without 4 * Redistribution and use in source and binary forms, with or without
5 * modification, are permitted provided that the following conditions are 5 * modification, are permitted provided that the following conditions are
6 * met: 6 * met:
7 * 7 *
8 * 1. Redistributions of source code must retain the above copyright 8 * 1. Redistributions of source code must retain the above copyright
9 * notice, this list of conditions and the following disclaimer. 9 * notice, this list of conditions and the following disclaimer.
10 * 10 *
11 * 2. Redistributions in binary form must reproduce the above 11 * 2. Redistributions in binary form must reproduce the above
12 * copyright notice, this list of conditions and the following disclaimer 12 * copyright notice, this list of conditions and the following disclaimer
13 * in the documentation and/or other materials provided with the 13 * in the documentation and/or other materials provided with the
14 * distribution. 14 * distribution.
15 * 15 *
16 * THIS SOFTWARE IS PROVIDED BY GOOGLE INC. AND ITS CONTRIBUTORS 16 * THIS SOFTWARE IS PROVIDED BY GOOGLE INC. AND ITS CONTRIBUTORS
17 * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT 17 * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
18 * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR 18 * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
19 * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL GOOGLE INC. 19 * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL GOOGLE INC.
20 * OR ITS CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, 20 * OR ITS CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
21 * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT 21 * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
22 * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, 22 * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
23 * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY 23 * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
24 * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT 24 * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
25 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE 25 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
26 * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. 26 * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
27 */ 27 */
28 28
29 .shadow-split-view { 29 .shadow-split-widget {
30 display: flex; 30 display: flex;
31 overflow: hidden; 31 overflow: hidden;
32 } 32 }
33 33
34 .shadow-split-view-contents { 34 .shadow-split-widget-contents {
35 display: flex; 35 display: flex;
36 position: relative; 36 position: relative;
37 flex-direction: column; 37 flex-direction: column;
38 } 38 }
39 39
40 .shadow-split-view-sidebar { 40 .shadow-split-widget-sidebar {
41 flex: none; 41 flex: none;
42 } 42 }
43 43
44 .shadow-split-view-main, .shadow-split-view-sidebar.maximized { 44 .shadow-split-widget-main, .shadow-split-widget-sidebar.maximized {
45 flex: auto; 45 flex: auto;
46 } 46 }
47 47
48 .shadow-split-view.hbox > .shadow-split-view-resizer { 48 .shadow-split-widget.hbox > .shadow-split-widget-resizer {
49 position: absolute; 49 position: absolute;
50 top: 0; 50 top: 0;
51 bottom: 0; 51 bottom: 0;
52 width: 6px; 52 width: 6px;
53 z-index: 500; 53 z-index: 500;
54 } 54 }
55 55
56 .shadow-split-view.vbox > .shadow-split-view-resizer { 56 .shadow-split-widget.vbox > .shadow-split-widget-resizer {
57 position: absolute; 57 position: absolute;
58 left: 0; 58 left: 0;
59 right: 0; 59 right: 0;
60 height: 6px; 60 height: 6px;
61 z-index: 500; 61 z-index: 500;
62 } 62 }
63 63
64 .shadow-split-view.hbox.shadow-split-view-first-is-sidebar { 64 .shadow-split-widget.hbox.shadow-split-widget-first-is-sidebar {
65 flex-direction: row-reverse !important; 65 flex-direction: row-reverse !important;
66 } 66 }
67 67
68 .shadow-split-view.vbox.shadow-split-view-first-is-sidebar { 68 .shadow-split-widget.vbox.shadow-split-widget-first-is-sidebar {
69 flex-direction: column-reverse !important; 69 flex-direction: column-reverse !important;
70 } 70 }
71 71
72 .shadow-split-view-resizer-border { 72 .shadow-split-widget-resizer-border {
73 pointer-events: none; 73 pointer-events: none;
74 } 74 }
75 75
76 .shadow-split-view.vbox > .shadow-split-view-sidebar:not(.maximized) { 76 .shadow-split-widget.vbox > .shadow-split-widget-sidebar:not(.maximized) {
77 border: 0; 77 border: 0;
78 border-top: 1px solid rgb(64%, 64%, 64%); 78 border-top: 1px solid rgb(64%, 64%, 64%);
79 } 79 }
80 80
81 .shadow-split-view.vbox.shadow-split-view-first-is-sidebar > .shadow-split-view- sidebar:not(.maximized) { 81 .shadow-split-widget.vbox.shadow-split-widget-first-is-sidebar > .shadow-split-w idget-sidebar:not(.maximized) {
82 border: 0; 82 border: 0;
83 border-bottom: 1px solid rgb(64%, 64%, 64%); 83 border-bottom: 1px solid rgb(64%, 64%, 64%);
84 } 84 }
85 85
86 .shadow-split-view.hbox > .shadow-split-view-sidebar:not(.maximized) { 86 .shadow-split-widget.hbox > .shadow-split-widget-sidebar:not(.maximized) {
87 border: 0; 87 border: 0;
88 border-left: 1px solid rgb(64%, 64%, 64%); 88 border-left: 1px solid rgb(64%, 64%, 64%);
89 } 89 }
90 90
91 .shadow-split-view.hbox.shadow-split-view-first-is-sidebar > .shadow-split-view- sidebar:not(.maximized) { 91 .shadow-split-widget.hbox.shadow-split-widget-first-is-sidebar > .shadow-split-w idget-sidebar:not(.maximized) {
92 border: 0; 92 border: 0;
93 border-right: 1px solid rgb(64%, 64%, 64%); 93 border-right: 1px solid rgb(64%, 64%, 64%);
94 } 94 }
95 95
96 .shadow-split-view button.sidebar-show-hide-button { 96 .shadow-split-widget button.sidebar-show-hide-button {
97 position: absolute; 97 position: absolute;
98 -webkit-mask-image: url(Images/toolbarButtonGlyphs.png); 98 -webkit-mask-image: url(Images/toolbarButtonGlyphs.png);
99 -webkit-mask-size: 320px 144px; 99 -webkit-mask-size: 320px 144px;
100 height: 16px; 100 height: 16px;
101 width: 16px; 101 width: 16px;
102 border: none; 102 border: none;
103 z-index: 10; 103 z-index: 10;
104 background-color: rgba(0, 0, 0, 0.6); 104 background-color: rgba(0, 0, 0, 0.6);
105 } 105 }
106 106
107 .shadow-split-view button.sidebar-show-hide-button:disabled { 107 .shadow-split-widget button.sidebar-show-hide-button:disabled {
108 background-color: rgba(0, 0, 0, 0.35); 108 background-color: rgba(0, 0, 0, 0.35);
109 } 109 }
110 110
111 @media (-webkit-min-device-pixel-ratio: 1.5) { 111 @media (-webkit-min-device-pixel-ratio: 1.5) {
112 .shadow-split-view button.sidebar-show-hide-button { 112 .shadow-split-widget button.sidebar-show-hide-button {
113 -webkit-mask-image: url(Images/toolbarButtonGlyphs_2x.png); 113 -webkit-mask-image: url(Images/toolbarButtonGlyphs_2x.png);
114 } 114 }
115 } /* media */ 115 } /* media */
116 116
117 .shadow-split-view button.left-sidebar-show-hide-button, 117 .shadow-split-widget button.left-sidebar-show-hide-button,
118 .shadow-split-view button.top-sidebar-show-hide-button { 118 .shadow-split-widget button.top-sidebar-show-hide-button {
119 top: 3px; 119 top: 3px;
120 left: 4px; 120 left: 4px;
121 } 121 }
122 122
123 .material.shadow-split-view button.left-sidebar-show-hide-button, 123 .material.shadow-split-widget button.left-sidebar-show-hide-button,
124 .material.shadow-split-view button.top-sidebar-show-hide-button { 124 .material.shadow-split-widget button.top-sidebar-show-hide-button {
125 top: 5px; 125 top: 5px;
126 } 126 }
127 127
128 .shadow-split-view button.left-sidebar-show-hide-button:active, 128 .shadow-split-widget button.left-sidebar-show-hide-button:active,
129 .shadow-split-view button.top-sidebar-show-hide-button:active { 129 .shadow-split-widget button.top-sidebar-show-hide-button:active {
130 top: 4px; 130 top: 4px;
131 left: 3px; 131 left: 3px;
132 } 132 }
133 133
134 .shadow-split-view button.right-sidebar-show-hide-button { 134 .shadow-split-widget button.right-sidebar-show-hide-button {
135 top: 3px; 135 top: 3px;
136 right:2px; 136 right:2px;
137 } 137 }
138 138
139 .material.shadow-split-view button.right-sidebar-show-hide-button { 139 .material.shadow-split-widget button.right-sidebar-show-hide-button {
140 top: 5px; 140 top: 5px;
141 right: 5px; 141 right: 5px;
142 } 142 }
143 143
144 .shadow-split-view button.right-sidebar-show-hide-button:active { 144 .shadow-split-widget button.right-sidebar-show-hide-button:active {
145 top: 4px; 145 top: 4px;
146 right: 1px; 146 right: 1px;
147 } 147 }
148 148
149 .shadow-split-view button.bottom-sidebar-show-hide-button { 149 .shadow-split-widget button.bottom-sidebar-show-hide-button {
150 bottom: 1px; 150 bottom: 1px;
151 right: 1px; 151 right: 1px;
152 } 152 }
153 153
154 .material.shadow-split-view button.bottom-sidebar-show-hide-button { 154 .material.shadow-split-widget button.bottom-sidebar-show-hide-button {
155 bottom: 3px; 155 bottom: 3px;
156 right: 3px; 156 right: 3px;
157 } 157 }
158 158
159 .shadow-split-view button.bottom-sidebar-show-hide-button:active { 159 .shadow-split-widget button.bottom-sidebar-show-hide-button:active {
160 bottom: 0; 160 bottom: 0;
161 right: 0; 161 right: 0;
162 } 162 }
163 163
164 .shadow-split-view button.left-sidebar-show-hide-button.toggled-show { 164 .shadow-split-widget button.left-sidebar-show-hide-button.toggled-show {
165 -webkit-mask-position: -168px -76px; /* |> */ 165 -webkit-mask-position: -168px -76px; /* |> */
166 } 166 }
167 167
168 .shadow-split-view button.left-sidebar-show-hide-button.toggled-hide { 168 .shadow-split-widget button.left-sidebar-show-hide-button.toggled-hide {
169 -webkit-mask-position: -199px -76px; /* |< */ 169 -webkit-mask-position: -199px -76px; /* |< */
170 } 170 }
171 171
172 .shadow-split-view button.right-sidebar-show-hide-button.toggled-show { 172 .shadow-split-widget button.right-sidebar-show-hide-button.toggled-show {
173 -webkit-mask-position: -296px -76px; /* <| */ 173 -webkit-mask-position: -296px -76px; /* <| */
174 } 174 }
175 175
176 .shadow-split-view button.right-sidebar-show-hide-button.toggled-hide { 176 .shadow-split-widget button.right-sidebar-show-hide-button.toggled-hide {
177 -webkit-mask-position: -264px -76px; /* >| */ 177 -webkit-mask-position: -264px -76px; /* >| */
178 } 178 }
179 179
180 .shadow-split-view button.top-sidebar-show-hide-button.toggled-show { 180 .shadow-split-widget button.top-sidebar-show-hide-button.toggled-show {
181 -webkit-mask-position: -168px -76px; /* |> */ 181 -webkit-mask-position: -168px -76px; /* |> */
182 transform: rotate(90deg); 182 transform: rotate(90deg);
183 } 183 }
184 184
185 .shadow-split-view button.top-sidebar-show-hide-button.toggled-hide { 185 .shadow-split-widget button.top-sidebar-show-hide-button.toggled-hide {
186 -webkit-mask-position: -199px -76px; /* |< */ 186 -webkit-mask-position: -199px -76px; /* |< */
187 transform: rotate(90deg); 187 transform: rotate(90deg);
188 } 188 }
189 189
190 .shadow-split-view button.bottom-sidebar-show-hide-button.toggled-show { 190 .shadow-split-widget button.bottom-sidebar-show-hide-button.toggled-show {
191 -webkit-mask-position: -296px -76px; /* <| */ 191 -webkit-mask-position: -296px -76px; /* <| */
192 transform: rotate(90deg); 192 transform: rotate(90deg);
193 } 193 }
194 194
195 .shadow-split-view button.bottom-sidebar-show-hide-button.toggled-hide { 195 .shadow-split-widget button.bottom-sidebar-show-hide-button.toggled-hide {
196 -webkit-mask-position: -264px -76px; /* >| */ 196 -webkit-mask-position: -264px -76px; /* >| */
197 transform: rotate(90deg); 197 transform: rotate(90deg);
198 } 198 }
OLDNEW
« no previous file with comments | « Source/devtools/front_end/ui/splitView.css ('k') | Source/devtools/front_end/ui/treeoutline.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698