3c30e09e |
1 | @namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul); |
2 | |
3 | /*============ tabpanels widget =============*/ |
4 | |
5 | tabpanels { |
6 | padding: 5px; |
7 | } |
8 | |
9 | /* we give all tabpanel types a full border |
10 | tabpanel is the box in which contents show up */ |
11 | |
12 | /* top tabs */ |
13 | tabs + tabpanels { |
14 | -moz-border-radius: 5px; |
15 | border: 1px solid #9C9CFF; |
16 | padding: 5px; |
17 | } |
18 | |
19 | /* bottom tabs */ |
20 | tabbox[orient="vertical"] > tabpanels { |
21 | -moz-border-radius: 5px; |
22 | border: 1px solid #9C9CFF; |
23 | padding: 5px; |
24 | } |
25 | |
26 | /* left tabs */ |
27 | tabbox[orient="horizontal"] > tabs + tabpanels { |
28 | -moz-border-radius: 5px; |
29 | border: 1px solid #9C9CFF; |
30 | padding: 5px; |
31 | } |
32 | |
33 | /* right tabs */ |
34 | tabbox[orient="horizontal"] > tabpanels { |
35 | -moz-border-radius: 5px; |
36 | border: 1px solid #9C9CFF; |
37 | padding: 5px; |
38 | } |
39 | |
40 | /* border on bottom only, no padding (used in search) */ |
41 | tabpanels.light { |
42 | border: none; |
43 | border-bottom: 1px solid #9C9CFF; |
44 | padding: 0px; |
45 | } |
46 | |
47 | .tabpanels-inner-box { |
48 | } |
49 | |
50 | /* tabs-spacer ========================== */ |
51 | |
52 | /* top tabs */ |
53 | tabbox[orient="vertical"] > tabs > .tabs-spacer { |
54 | } |
55 | |
56 | /* bottom tabs */ |
57 | tabbox[orient="vertical"] > tabpanels + tabs > .tabs-spacer { |
58 | } |
59 | |
60 | /* left tabs */ |
61 | tabbox[orient="horizontal"] > tabs > .tabs-spacer { |
62 | } |
63 | |
64 | /* right tabs */ |
65 | tabbox[orient="horizontal"] > tabpanels + tabs > .tabs-spacer { |
66 | } |
67 | |
68 | /*============ tab widget ============*/ |
69 | /* NOTE: there should be code in here for indenting the first tab |
70 | by two pixels, however, this needs to be done with a spacer to |
71 | fill in the border, but current attempts to use said spacer |
72 | result in said spacer not rendering. Will revisit. - JRH */ |
73 | |
74 | /* tabs is the strip showing the tabs, while tab is the tab (switcher) itself */ |
75 | |
76 | tab { |
77 | -moz-border-radius: 3px 3px 0px 0px; |
78 | border: 1px solid #9C9CFF; |
79 | color: #FF9F00; |
80 | } |
81 | |
82 | tab > .tab-box > .tab-text { |
83 | border: 1px solid transparent; |
84 | padding: 0px 1px 0px 1px; |
85 | } |
86 | |
87 | tab:focus > .tab-box > .tab-text { |
88 | border: 1px dotted #008484; |
89 | } |
90 | |
91 | .tab-box { |
92 | margin: 0px; |
93 | padding: 1px 3px 1px 3px !important; |
94 | } |
95 | |
96 | /* top tabs */ |
97 | tabs tab[first-tab="true"] { |
98 | margin-left: 2px; |
99 | } |
100 | |
101 | tabs tab { |
102 | margin-top: 2px; |
103 | border-bottom: none; |
104 | -moz-border-radius: 8px 8px 0px 0px; |
105 | } |
106 | |
107 | tabs tab > .tab-box { |
108 | /* -moz-border-radius: 4px 4px 0px 0px; */ |
109 | } |
110 | |
111 | /* bottom tabs */ |
112 | tabpanels + tabs > tab { |
113 | margin-top: 0px; |
114 | margin-bottom: 2px; |
115 | border-top: none; |
116 | -moz-border-radius: 0px 0px 8px 8px; |
117 | padding: 1px 5px 3px 5px; |
118 | } |
119 | |
120 | tabpanels + tabs > tab > .tab-box { |
121 | /* -moz-border-radius: 0px 0px 4px 4px; */ |
122 | } |
123 | |
124 | /* left tabs */ |
125 | tabbox[orient="horizontal"] > tabs[orient="vertical"] tab[first-tab="true"] { |
126 | margin-top: 2px; |
127 | } |
128 | |
129 | tabbox[orient="horizontal"] > tabs[orient="vertical"] tab { |
130 | margin-left: 2px; |
131 | border-right: none; |
132 | -moz-border-radius: 8px 0px 0px 8px; |
133 | } |
134 | |
135 | tabbox[orient="horizontal"] > tabs[orient="vertical"] tab > .tab-box { |
136 | /* -moz-border-radius: 4px 0px 0px 4px; */ |
137 | } |
138 | |
139 | /* right tabs */ |
140 | tabbox[orient="horizontal"] > tabpanels + tabs[orient="vertical"] > tab { |
141 | margin-right: 2px; |
142 | margin-left: 0px; |
143 | border-left: none; |
144 | -moz-border-radius: 0px 8px 8px 0px !important; |
145 | } |
146 | |
147 | tabbox[orient="horizontal"] > tabpanels + tabs[orient="vertical"] > tab > .tab-box { |
148 | /* -moz-border-radius: 0px 4px 4px 0px !important; */ |
149 | } |
150 | |
151 | /* selected tabs ============================= */ |
152 | |
153 | tab[selected="true"] { |
154 | font-weight: bold; |
155 | } |
156 | |
157 | tab[selected="true"] { |
158 | font-weight: bold; |
159 | background-color: #008484; |
160 | } |
161 | |
162 | tab:hover { |
163 | background-color: #FFCF00; |
164 | color: #000000; |
165 | text-decoration: underline; |
166 | } |
167 | |
168 | tab:hover:active { |
169 | text-decoration: none; |
170 | } |
171 | |