815f3386e3
When advanced mobile contributions mode is enabled and `$wgMinervaOverflowInPageActions` is set, show a secondary overflow menu on main namespace articles and user namespace pages. The menu content varies for each namespace. The new submenu is *disabled* by default, even when AMC is active. This feature should not be deployed until instrumentation is available. The secondary menu is rendered in PHP using the existing menu system with some changes to the template. The checkbox hack is needed for no- JavaScript keyboard navigation until :focus-within is supported. CSS additions are documented in the source. All client side toolbar execution occurs in Toolbar.js. Enhancements are documented in the source. Minor changes to the existing download button: - Move download and edit button initialization to Toolbar. - Update copy (not visible) from "Download" to "Download PDF". - When the overflow menu is present, use the "hasText" / label style. Wikimedia UI icons are copied from OOUI at d00a0ac and seem useful to expose as HTTP URIs (not data URIs). The overflow menu does not show for pages provided by the content proxy since its entries depend on $tpl->data['nav_urls'] being populated. Bug: T216418 Depends-On: I0781151a8232b6a7b52f79a34298afcecb8e4271 Change-Id: I4b50a0e519024a7ab91dae6ab40b23cf14a03861
136 lines
3.8 KiB
Plaintext
136 lines
3.8 KiB
Plaintext
@import 'mediawiki.ui/variables';
|
||
|
||
@z-indexBase: 0;
|
||
@z-indexOverOverlay: 3;
|
||
|
||
/**
|
||
* System font stack for sans-serif fonts
|
||
*
|
||
* `-apple-system` ('San Francisco') – Support: Safari 9+ macOS and iOS, Firefox macOS
|
||
* `BlinkMacSystemFont` ('San Francisco') – Chrome 48+ macOS and iOS
|
||
* `Segoe UI` – Windows Vista & newer
|
||
* `Roboto` – Android 4.0
|
||
* `Lato` – Wikimedia Design choice, OFL licensed
|
||
* `Helvetica, Arial, sans-serif` – (Generic) Web fallback
|
||
* Note that CSS Fonts Module Level 4's `system-ui` value has resulted in unresolved
|
||
* side-effects in certain OS/language combinations and is therefore not included as of now.
|
||
*/
|
||
@fontFamilySans: -apple-system, 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Lato', 'Helvetica', 'Arial', sans-serif;
|
||
@fontFamilyBase: @fontFamilySans;
|
||
@tocFontSize: 0.8em;
|
||
|
||
@indicatorFontSize: 0.4em;
|
||
|
||
// colors
|
||
@grayMediumLight: @colorGray10;
|
||
@grayMediumDark: @colorGray5;
|
||
@grayMedium: @colorGray7;
|
||
@grayLight: @colorGray12;
|
||
@grayLightest: @colorGray14;
|
||
|
||
@skinContentBgColor: #fff;
|
||
|
||
// Navigation Drawers
|
||
@menuWidth: 75%;
|
||
@menuWidthTablet: 600px;
|
||
@rightDrawerWidth: 60%;
|
||
@primaryNavBackgroundColor: @colorGray14;
|
||
|
||
// Headings
|
||
@firstHeadingFontSize: 2.6525em; // 42px
|
||
@fontSizeH1: 1.7em;
|
||
@fontSizeH2: 1.5em;
|
||
@fontSizeH3: 1.2em;
|
||
|
||
// Content
|
||
@contentPadding: 16px;
|
||
@contentMargin: 16px;
|
||
|
||
// Header
|
||
@headerHeight: 3.35em;
|
||
@headerMarginTop: -1px; // used to hide the header border top when a banner is not present
|
||
@searchBoxWidth: 375/16em;
|
||
@iconSizeTotal: @iconSize + @iconGutterWidth + @iconGutterWidth;
|
||
@deviceWidthTabletEms: unit( @width-breakpoint-tablet/16, em );
|
||
@brandingBoxWidth: @deviceWidthTabletEms - ( @iconSizeTotal * 3 ) - @searchBoxWidth;
|
||
|
||
@titleSectionSpacingTop: 20px;
|
||
@titleSectionSpacingBottom: 25px;
|
||
|
||
// Page actions
|
||
@taglineFontSize: 0.85em;
|
||
@pageActionBorder: 1px;
|
||
@pageActionFontSize: 0.9em;
|
||
@pageActionToolbarHeight: 44px; // total height is 46px. 2px added by border on .page-actions-menu
|
||
|
||
// colors
|
||
@chromeColor: @grayLightest;
|
||
@semiTransparent: rgba( 0, 0, 0, 0.8 );
|
||
|
||
@linkColor: @colorProgressive;
|
||
@redLinkColor: @colorErrorText;
|
||
@lastModifiedBarActiveBackgroundColor: #00af89;
|
||
@toastNotificationColor: @colorGray2;
|
||
|
||
// Use when an element is selected. FIXME: This should be in mediawiki ui.
|
||
@selectedBackgroundColor: #e6eeff;
|
||
|
||
// messages
|
||
@colorWarningBackground: #feb;
|
||
@colorWarningBorder: #fde29b;
|
||
@colorWarningText: #850;
|
||
@colorSuccessBorder: #b7fdb5;
|
||
@colorErrorBackground: #fae3e3;
|
||
@colorErrorBorder: #fac5c5;
|
||
|
||
// typography
|
||
@fontFamilyHeading: 'Linux Libertine', 'Georgia', 'Times', serif;
|
||
/**
|
||
* System font stack for monospace fonts, see T221043.
|
||
*
|
||
* `Menlo` – macOS 10.6+
|
||
* `Consolas` – Windows Vista & newer
|
||
* `Liberation Mono` – Fedora, Ubuntu, … OFL licensed
|
||
* `Courier New` – (Generic) web font fallback
|
||
*/
|
||
@fontFamilyMonospace: 'Menlo', 'Consolas', 'Liberation Mono', 'Courier New', monospace;
|
||
@fontScalingFactor: 1;
|
||
@contentLineHeight: 1.65;
|
||
|
||
@headingMargin: 0.5em;
|
||
@sectionIconWidth: 30px;
|
||
|
||
// blockquote
|
||
@blockquotePaddingRight: 25px;
|
||
@blockquotePaddingLeft: 30px;
|
||
|
||
// custom tablet styling
|
||
@contentPaddingTablet: 3.35em;
|
||
|
||
// note since content does not use view border box we have to include padding.
|
||
@contentMaxWidthTablet: @width-breakpoint-desktop - ( 2 * @contentPaddingTablet );
|
||
@contentTopPadding: 1.6em;
|
||
|
||
// Wiki specific variables
|
||
@infoboxWidth: 320px;
|
||
|
||
@lastModifiedBarBgColor: @chromeColor;
|
||
@lastModifiedBarActiveBgColor: @lastModifiedBarActiveBackgroundColor;
|
||
@lastModifiedBarTextColor: @colorTextLight;
|
||
|
||
@footerBorderColor: @grayLight;
|
||
|
||
@notificationBackgroundRead: @colorGray14;
|
||
@notificationColorRead: @colorGray5;
|
||
@notificationBackgroundUnread: @colorDestructive;
|
||
@notificationColorUnread: #fff;
|
||
|
||
// z-index:
|
||
@z-indexOccluded: -1;
|
||
@z-indexDrawer: 1;
|
||
@z-indexOverlay: 2;
|
||
|
||
// Print specific
|
||
@colorPrintSubtle: #999;
|
||
@borderColorPrint: #999;
|