Web Inspector: Fonts refactoring
[WebKit-https.git] / Source / WebCore / inspector / front-end / tabbedPane.css
1 /*
2  * Copyright (C) 2006, 2007, 2008 Apple Inc.  All rights reserved.
3  * Copyright (C) 2009 Anthony Ricaud <rik@webkit.org>
4  * Copyright (C) 2011 Google Inc. All rights reserved.
5  *
6  * Redistribution and use in source and binary forms, with or without
7  * modification, are permitted provided that the following conditions are
8  * met:
9  *
10  * 1. Redistributions of source code must retain the above copyright
11  * notice, this list of conditions and the following disclaimer.
12  *
13  * 2. Redistributions in binary form must reproduce the above
14  * copyright notice, this list of conditions and the following disclaimer
15  * in the documentation and/or other materials provided with the
16  * distribution.
17  *
18  * THIS SOFTWARE IS PROVIDED BY GOOGLE INC. AND ITS CONTRIBUTORS
19  * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
20  * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
21  * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL GOOGLE INC.
22  * OR ITS CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
23  * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
24  * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
25  * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
26  * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
27  * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
28  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
29  */
30  
31  .tabbed-pane {
32     -webkit-flex-direction: column;
33     display: -webkit-flex;
34     height: 100%;
35 }
36
37 .tabbed-pane-content {
38     -webkit-flex: 1;
39     position: relative;
40     overflow: auto;
41 }
42
43 .tabbed-pane-content.has-no-tabs {
44     background-color: lightgray;
45 }
46
47 .tabbed-pane-header {
48     height: 23px;
49     border-bottom: 1px solid rgb(163, 163, 163);
50     overflow: hidden;
51     width: 100%;
52 }
53
54 .tabbed-pane-header-contents {
55     margin: 0 10px;
56 }
57
58 .tabbed-pane-header-tabs {
59     float: left;
60 }
61
62 .tabbed-pane-header-tab {
63     float: left;
64     margin-top: 2px;
65     padding: 2px 4px 2px 4px;
66     height: 21px;
67     border: 1px solid transparent;
68     border-bottom: none;
69     line-height: 15px;
70     
71     white-space: nowrap;
72     text-overflow: ellipsis;
73     overflow: hidden;
74 }
75
76 .tabbed-pane-header-tab.measuring {
77     visibility: hidden;
78 }
79
80 .tabbed-pane-header-tab.selected {
81     background-color: white;
82     border: 1px solid rgb(163, 163, 163);
83     border-bottom: none;
84 }
85
86 .tabbed-pane-header-tab-close-button {
87     position: relative;
88     bottom: 0;
89     opacity: 0;
90     padding-left: 3px;
91     font-size: 14px;
92     color: rgb(80, 80, 80);
93     line-height: 12px;
94 }
95
96 .tabbed-pane-header-tab:hover .tabbed-pane-header-tab-close-button {
97     opacity: 0.5;
98 }
99
100 .tabbed-pane-header-tab:hover .tabbed-pane-header-tab-close-button:hover {
101     opacity: 1.0;
102 }
103
104 .tabbed-pane-header-tab:hover .tabbed-pane-header-tab-close-button:active {
105     opacity: 0.7;
106 }
107
108 .tabbed-pane-header-tab.selected .tabbed-pane-header-tab-close-button {
109     opacity: 0.5;
110 }
111
112 .tabbed-pane-header-tab.selected .tabbed-pane-header-tab-close-button:hover {
113     opacity: 1.0;
114 }
115
116 .tabbed-pane-header-tab.selected .tabbed-pane-header-tab-close-button:active {
117     opacity: 0.7;
118 }
119
120 .tabbed-pane-header-tabs-drop-down-container {
121     float: left;
122     position: relative;
123     font-size: 16px;
124     vertical-align: bottom;
125     top: 3px;
126     padding-left: 3px;
127 }
128
129 .tabbed-pane-header-tabs-drop-down-container.measuring {
130     visibility: hidden;
131 }
132
133 .tabbed-pane-header-tabs-drop-down {
134     position: relative;
135     opacity: 0.7;
136     color: rgb(30, 30, 30);
137 }
138
139 .tabbed-pane-header-tabs-drop-down:hover {
140     opacity: 1.0;
141 }
142
143 .tabbed-pane-header-tabs-drop-down:active {
144     opacity: 0.8;
145 }
146
147 select.tabbed-pane-header-tabs-drop-down-select {
148     position: absolute;
149     top: 0px;
150     right: 0px;
151     bottom: 0px;
152     left: 0px;
153     opacity: 0;
154     border: none;
155     margin: 0;
156     -webkit-appearance: none;
157 }