2 Styling for namespace tabs (page, discussion) and views (read, edit, view history, watch and other actions)
5 /* Navigation Labels */
10 /* Namespaces and Views */
15 .background-image('images/tab-break.png');
16 background-position: bottom left;
17 background-repeat: no-repeat;
24 list-style-type: none;
25 list-style-image: none;
28 .background-image('images/tab-break.png');
29 background-position: right bottom;
30 background-repeat: no-repeat;
36 /* For IE6, overridden later to display:block by modern browsers */
37 display: inline-block;
41 background-color: #f3f3f3;
42 .background-image('images/tab-normal-fade.png');
43 background-position: bottom left;
44 background-repeat: repeat-x;
48 /* IGNORED BY IE6 which doesn't support child selector */
63 .background-image('images/tab-current-fade.png');
67 text-decoration: none;
73 background-position: bottom right;
74 background-repeat: no-repeat;
79 /* For IE6, overridden later to display:block by modern browsers */
80 display: inline-block;
84 color: @menu-link-color;
89 /* Ignored by IE6 which doesn't support child selector */
96 display: inline-block;
97 .background-image('images/tab-break.png');
98 background-position: bottom right;
99 background-repeat: no-repeat;
102 /* For IE6, overridden later to display:block by modern browsers */
103 display: inline-block;
107 /* Ignored by IE6 which doesn't support child selector */
116 /* Variants and Actions */
126 body.rtl div.vectorMenu {
131 div#mw-head div.vectorMenu h3 {
134 .background-image('images/tab-break.png');
135 background-repeat: no-repeat;
136 background-position: bottom right;
140 // This effectively moves the "background border" outside of the element to act like a real
141 // border. It is necessary for the dropdown (div.vectorMenu div.menu) to align well.
146 // The "Variants" menu has a really funny structure
147 // Temporary WMF deployment hack, to be removed before 1.24 release
148 div#mw-head div.vectorMenu#p-variants {
149 #p-variants-label span {
153 #mw-vector-current-variant {
154 display: inline-block;
159 padding-top: 1.375em;
162 background-image: none;
166 div.vectorMenu h3 span {
170 padding-top: 1.375em;
173 color: @menu-main-heading-color;
176 div.vectorMenu h3 a {
182 .background-image-svg('images/arrow-down-icon.svg', 'images/arrow-down-icon.png');
183 background-position: 100% 70%;
184 background-repeat: no-repeat;
185 .transition(background-position 250ms);
188 div.vectorMenu.menuForceShow h3 a {
189 background-position: 100% 100%;
192 div.vectorMenuFocus h3 a {
193 .background-image-svg('images/arrow-down-focus-icon.svg', 'images/arrow-down-focus-icon.png');
196 div.vectorMenu div.menu {
197 // Match the width of the dropdown "heading" (the tab)
202 background-color: white;
203 border: solid 1px silver;
210 /* Enable forcing showing of the menu for accessibility */
211 div.vectorMenu:hover div.menu,
212 div.vectorMenu.menuForceShow div.menu {
217 list-style-type: none;
218 list-style-image: none;
224 /* Fixes old versions of FireFox */
230 /* Returns things back to normal in modern versions of FireFox */
244 /* OVERRIDDEN BY COMPLIANT BROWSERS */
245 div.vectorMenu li a {
246 display: inline-block;
249 color: @menu-link-color;
255 div.vectorMenu li > a {
259 div.vectorMenu li.selected a,
260 div.vectorMenu li.selected a:visited {
262 text-decoration: none;
265 @import 'watchstar.less';