jonny
/
Vector-Local
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge "Remove gradient from modern Vector, align SidebarAction with portlet styles and classes"

This commit is contained in:
jenkins-bot 2022-08-17 21:03:35 +00:00 committed by Gerrit Code Review
parent 1f5170238a 5f09892813
commit b31bea7fd9
8 changed files with 29 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
includes/templates/Menu.mustache
View File

@ -31,13 +31,13 @@
Portal menus also require a label Portal menus also require a label
}} }}
{{#is-portal}} {{#is-portal}}
<p <div
id="{{id}}-label" id="{{id}}-label"
class="vector-menu-heading{{#heading-class}} {{.}}{{/heading-class}}" class="vector-menu-heading{{#heading-class}} {{.}}{{/heading-class}}"
{{#aria-label}}aria-label="{{.}}"{{/aria-label}} {{#aria-label}}aria-label="{{.}}"{{/aria-label}}
> >
{{{html-vector-heading-icon}}}<span class="vector-menu-heading-label">{{label}}</span> {{{html-vector-heading-icon}}}<span class="vector-menu-heading-label">{{label}}</span>
</p> </div>
{{/is-portal}} {{/is-portal}}
<div class="vector-menu-content"> <div class="vector-menu-content">
{{{html-before-portal}}} {{{html-before-portal}}}

10
includes/templates/SidebarAction.mustache
View File

@ -1,9 +1,9 @@
{{! `heading` is optional. }} {{! `heading` is optional. }}
<div class="mw-sidebar-action"> <div class="mw-sidebar-action ">
<div class="mw-sidebar-action-item"> <div class="mw-sidebar-action-item vector-menu-portal">
{{#heading}}<h3 class="mw-sidebar-action-heading">{{.}}</h3>{{/heading}} {{#heading}}<div class="mw-sidebar-action-heading vector-menu-heading">{{.}}</div>{{/heading}}
<div class="mw-sidebar-action-content"> <div class="mw-sidebar-action-content vector-menu-content">
{{{html-content}}} {{{html-content}}}
</div> </div>
</div> </div>
</div> </div>

4
resources/common/components/MenuPortal.less
View File

@ -8,10 +8,6 @@
.vector-menu-heading { .vector-menu-heading {
display: block; display: block;
background-image: linear-gradient( to right, @border-color-portal-heading-transparent 0, @border-color-portal-heading 33%, @border-color-portal-heading 66%, @border-color-portal-heading-transparent 100% ); // Standard (Firefox 16+, IE 10+, Safari 6.1+, Chrome 26+)
background-position: center bottom;
background-repeat: no-repeat;
background-size: 100% @border-width-base;
color: @color-base--subtle; color: @color-base--subtle;
margin: 0.5em 0 0 ( @margin-start-nav-main-body / @font-size-nav-main-heading ); margin: 0.5em 0 0 ( @margin-start-nav-main-body / @font-size-nav-main-heading );
border: 0; border: 0;

8
resources/skins.vector.styles.legacy/components/MenuPortal.less Normal file
View File

@ -0,0 +1,8 @@
.vector-menu-portal {
.vector-menu-heading {
background-image: linear-gradient( to right, @border-color-portal-heading-transparent 0, @border-color-portal-heading 33%, @border-color-portal-heading 66%, @border-color-portal-heading-transparent 100% ); // Standard (Firefox 16+, IE 10+, Safari 6.1+, Chrome 26+)
background-position: center bottom;
background-repeat: no-repeat;
background-size: 100% @border-width-base;
}
}

1
resources/skins.vector.styles.legacy/skin-legacy.less
View File

@ -10,6 +10,7 @@
// Legacy specific components // Legacy specific components
@import './components/MenuDropdown.less'; @import './components/MenuDropdown.less';
@import './components/MenuTabs.less'; @import './components/MenuTabs.less';
@import './components/MenuPortal.less';
@import './components/SearchBox.less'; @import './components/SearchBox.less';
@import './components/Sidebar.less'; @import './components/Sidebar.less';
@import './components/TabWatchstarLink.less'; @import './components/TabWatchstarLink.less';

5
resources/skins.vector.styles/components/MenuPortal.less Normal file
View File

@ -0,0 +1,5 @@
.vector-menu-portal {
.vector-menu-heading {
border-bottom: 1px solid @border-color-portal-heading;
}
}

24
resources/skins.vector.styles/components/Sidebar.less
View File

@ -66,25 +66,15 @@
} }
.mw-sidebar-action { .mw-sidebar-action {
// Align with the portal heading/links
// `.portal` + `.portal .body`
margin: 8px @margin-end-portal 8px @margin-start-portal + @margin-start-portal-body;
// Styles for SidebarAction template. // Styles for SidebarAction template.
.mw-sidebar-action-item { .mw-sidebar-action-item {
h3.mw-sidebar-action-heading { // Align with the portal heading/links
display: block; // `.portal` + `.portal .body`
background-image: linear-gradient( to right, @border-color-portal-heading-transparent 0, @border-color-portal-heading 33%, @border-color-portal-heading 66%, @border-color-portal-heading-transparent 100% ); // Standard (Firefox 16+, IE 10+, Safari 6.1+, Chrome 26+) margin-top: 4px;
background-position: center bottom; margin-bottom: 4px;
background-repeat: no-repeat;
background-size: 100% @border-width-base; .mw-sidebar-action-heading {
color: @color-base--subtle; margin-bottom: 0.75em;
margin: 0.75em 0;
border: 0;
padding: 0.3em 0;
font-size: @font-size-nav-main-heading;
font-weight: normal;
cursor: default;
} }
.mw-sidebar-action-content { .mw-sidebar-action-content {

1
resources/skins.vector.styles/skin.less
View File

@ -20,6 +20,7 @@
@import './components/Header.less'; @import './components/Header.less';
@import './components/MenuDropdown.less'; @import './components/MenuDropdown.less';
@import './components/MenuTabs.less'; @import './components/MenuTabs.less';
@import './components/MenuPortal.less';
@import './components/StickyHeader.less'; @import './components/StickyHeader.less';
@import './components/TabWatchstarLink.less'; @import './components/TabWatchstarLink.less';
@import './components/TableOfContents.less'; @import './components/TableOfContents.less';