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 div#mw-head div.vectorMenu h4,
147 div.vectorMenu#p-variants #mw-vector-current-variant {
148 display: inline-block;
152 padding-top: 1.375em;
157 div.vectorMenu h3 span {
161 padding-top: 1.375em;
164 color: @menu-main-heading-color;
167 div.vectorMenu h3 a {
173 .background-image-svg('images/arrow-down-icon.svg', 'images/arrow-down-icon.png');
174 background-position: 100% 70%;
175 background-repeat: no-repeat;
176 .transition(all 250ms);
179 div.vectorMenu.menuForceShow h3 a {
180 -webkit-transform: rotate(-45deg) translate(-5px, 5px);
181 -moz-transform: rotate(-45deg) translate(-5px, 5px);
182 -ms-transform: rotate(-45deg) translate(-5px, 5px);
183 transform: rotate(-45deg) translate(-5px, 5px);
186 div.vectorMenuFocus h3 a {
187 .background-image-svg('images/arrow-down-focus-icon.svg', 'images/arrow-down-focus-icon.png');
190 div.vectorMenu div.menu {
191 // Match the width of the dropdown "heading" (the tab)
196 background-color: white;
197 border: solid 1px silver;
204 /* Enable forcing showing of the menu for accessibility */
205 div.vectorMenu:hover div.menu,
206 div.vectorMenu.menuForceShow div.menu {
211 list-style-type: none;
212 list-style-image: none;
218 /* Fixes old versions of FireFox */
224 /* Returns things back to normal in modern versions of FireFox */
238 /* OVERRIDDEN BY COMPLIANT BROWSERS */
239 div.vectorMenu li a {
240 display: inline-block;
243 color: @menu-link-color;
249 div.vectorMenu li > a {
253 div.vectorMenu li.selected a,
254 div.vectorMenu li.selected a:visited {
256 text-decoration: none;
259 @import 'watchstar.less';