ce04ee32f9f37f811e180cb674b5a16ca3463796
[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     font-size: 11px;
66     font-weight: bold;
67     color: rgb(46, 46, 46);
68     background: transparent;
69     text-shadow: rgba(255, 255, 255, 0.5) 0 1px 0;
70     vertical-align: middle;
71     padding: 3px 4px 2px 4px;
72     height: 21px;
73     border: 1px solid transparent;
74     border-bottom: none;
75     
76     white-space: nowrap;
77     text-overflow: ellipsis;
78     overflow: hidden;
79 }
80
81 .tabbed-pane-header-tab.measuring {
82     visibility: hidden;
83 }
84
85 .tabbed-pane-header-tab.selected {
86     background-color: white;
87     border: 1px solid rgb(163, 163, 163);
88     border-bottom: none;
89 }
90
91 .tabbed-pane-header .tabbed-pane-header-tab-title {
92     vertical-align: top;
93 }
94
95 .tabbed-pane-header-tab-close-button {
96     font-family: Arial, monospace;
97     position: relative;
98     bottom: 1px;
99     opacity: 0;
100     padding-left: 3px;
101     font-size: 14px;
102     color: rgb(80, 80, 80);
103 }
104
105 .tabbed-pane-header-tab:hover .tabbed-pane-header-tab-close-button {
106     opacity: 0.5;
107 }
108
109 .tabbed-pane-header-tab:hover .tabbed-pane-header-tab-close-button:hover {
110     opacity: 1.0;
111 }
112
113 .tabbed-pane-header-tab:hover .tabbed-pane-header-tab-close-button:active {
114     opacity: 0.7;
115 }
116
117 .tabbed-pane-header-tab.selected .tabbed-pane-header-tab-close-button {
118     opacity: 0.5;
119 }
120
121 .tabbed-pane-header-tab.selected .tabbed-pane-header-tab-close-button:hover {
122     opacity: 1.0;
123 }
124
125 .tabbed-pane-header-tab.selected .tabbed-pane-header-tab-close-button:active {
126     opacity: 0.7;
127 }
128
129 .tabbed-pane-header-tabs-drop-down-container {
130     float: left;
131     position: relative;
132     font-size: 16px;
133     vertical-align: bottom;
134     top: 3px;
135     padding-left: 3px;
136 }
137
138 .tabbed-pane-header-tabs-drop-down-container.measuring {
139     visibility: hidden;
140 }
141
142 .tabbed-pane-header-tabs-drop-down {
143     position: relative;
144     opacity: 0.7;
145     color: rgb(30, 30, 30);
146 }
147
148 .tabbed-pane-header-tabs-drop-down:hover {
149     opacity: 1.0;
150 }
151
152 .tabbed-pane-header-tabs-drop-down:active {
153     opacity: 0.8;
154 }
155
156 select.tabbed-pane-header-tabs-drop-down-select {
157     position: absolute;
158     top: 0px;
159     right: 0px;
160     bottom: 0px;
161     left: 0px;
162     opacity: 0;
163     border: none;
164     margin: 0;
165     -webkit-appearance: none;
166 }
167