Isolate Vector Styles to their Respective Component
This will help with the encapsulation/reusability of each component. * Stylesheets were renamed to reflect their respective component name (e.g. search.less became SearchBox.less) * Styles were isolated to each component: * navigation.less now only contains classes that are relevant to Navigation.mustache. * personalNavigation.less, search.less, and tabs.less imports were removed and made first-class styles. * several selectors were moved into common.less * #p-logo was moved into sidebar * tabs.less was renamed to VectorTabs.less and styles specific to VectorMenu.less were put into VectorMenu.less * Storybook was updated to reflect changes Bug: T243281 Change-Id: Idf90ee2a0f1c1d08a31cf50099c0bebc7b67e619
This commit is contained in:
parent
cdd5ebd74d
commit
9823538683
|
@ -0,0 +1,32 @@
|
||||||
|
@import 'mediawiki.mixins.less';
|
||||||
|
|
||||||
|
/* Hide, but keep accessible for screen-readers */
|
||||||
|
#mw-navigation h2 {
|
||||||
|
position: absolute;
|
||||||
|
top: -9999px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#mw-head {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Navigation Containers */
|
||||||
|
#left-navigation {
|
||||||
|
float: left;
|
||||||
|
margin-left: 10em;
|
||||||
|
margin-top: 2.5em;
|
||||||
|
/* When right nav would overlap left nav, it's placed below it
|
||||||
|
(normal CSS floats behavior). This rule ensures that no empty space
|
||||||
|
is shown between them due to right nav's margin-top. Page layout
|
||||||
|
is still broken, but at least the nav overlaps only the page title
|
||||||
|
instead of half the content. */
|
||||||
|
margin-bottom: -2.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#right-navigation {
|
||||||
|
float: right;
|
||||||
|
margin-top: 2.5em;
|
||||||
|
}
|
|
@ -0,0 +1,49 @@
|
||||||
|
@import '../../variables.less';
|
||||||
|
@import 'mediawiki.mixins.less';
|
||||||
|
|
||||||
|
.portal {
|
||||||
|
margin: 0 0.6em 0 0.7em;
|
||||||
|
padding: 0.25em 0;
|
||||||
|
direction: ltr;
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
color: @color-nav-subtle;
|
||||||
|
font-weight: normal;
|
||||||
|
margin: 0.5em 0 0 ( @margin-left-nav-main-body / @font-size-nav-main-heading );
|
||||||
|
padding: 0.25em 0;
|
||||||
|
cursor: default;
|
||||||
|
border: 0;
|
||||||
|
font-size: @font-size-nav-main-heading;
|
||||||
|
}
|
||||||
|
|
||||||
|
.body {
|
||||||
|
background-image: url( images/portal-separator.png ); // Support: IE 8 & 9, Fx 3.6-15, Safari 5.1-6, Chrome 10-25
|
||||||
|
background-image: linear-gradient( to right, transparent 0, #c8ccd1 35%, #c8ccd1 70%, transparent 100% ); // Standard (Firefox 16+, IE 10+, Safari 6.1+, Chrome 26+)
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: 100% @border-width-base;
|
||||||
|
margin-left: @margin-left-nav-main-body;
|
||||||
|
padding-top: 0;
|
||||||
|
|
||||||
|
ul {
|
||||||
|
list-style: none none;
|
||||||
|
margin: 0;
|
||||||
|
padding-top: 0.3em;
|
||||||
|
}
|
||||||
|
|
||||||
|
li {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0.25em 0;
|
||||||
|
font-size: @font-size-nav-main-body;
|
||||||
|
line-height: @line-height-nav;
|
||||||
|
word-wrap: break-word;
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: @color-link;
|
||||||
|
|
||||||
|
&:visited {
|
||||||
|
color: @color-link--visited;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,40 @@
|
||||||
|
@import '../../variables.less';
|
||||||
|
|
||||||
|
/* Logo */
|
||||||
|
#p-logo {
|
||||||
|
width: 10em;
|
||||||
|
height: 160px;
|
||||||
|
|
||||||
|
a {
|
||||||
|
background-position: center center;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
display: block;
|
||||||
|
width: 10em;
|
||||||
|
height: 160px;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Panel */
|
||||||
|
#mw-panel {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
width: 10em;
|
||||||
|
left: 0;
|
||||||
|
font-size: @font-size-nav-main;
|
||||||
|
|
||||||
|
/* First sidebar portlet. Not using :first-of-type for IE<=8 support. */
|
||||||
|
#p-logo + .portal {
|
||||||
|
background-image: none;
|
||||||
|
margin-top: 1em;
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.body {
|
||||||
|
background-image: none;
|
||||||
|
margin-left: @margin-left-nav-main-body;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,90 +1,6 @@
|
||||||
@import '../../variables.less';
|
@import '../../variables.less';
|
||||||
@import 'mediawiki.mixins.less';
|
@import 'mediawiki.mixins.less';
|
||||||
|
|
||||||
/**
|
|
||||||
* Styling for namespace tabs (page, discussion) and views (read, edit, view history, watch and other actions)
|
|
||||||
*/
|
|
||||||
|
|
||||||
/* Namespaces and Views */
|
|
||||||
.vectorTabs {
|
|
||||||
// Tab separator: Outer start border (left in LTR) of tab row.
|
|
||||||
background-position: left bottom;
|
|
||||||
float: left;
|
|
||||||
height: 2.5em;
|
|
||||||
padding-left: @border-width-base;
|
|
||||||
|
|
||||||
/* Navigation Labels */
|
|
||||||
h3 {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul {
|
|
||||||
float: left;
|
|
||||||
height: 100%;
|
|
||||||
list-style: none none;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
li {
|
|
||||||
// Tab fade background: Fade inside from light grey to white.
|
|
||||||
background-image: url( images/tab-normal-fade.png ); // Support: IE 8 & 9, Fx 3.6-15, Safari 5.1-6, Chrome 10-25
|
|
||||||
background-image: linear-gradient( to top, @border-color-content--tabs-inactive 0, #e8f2f8 1px, #fff 100% ); // Support: Standard (Firefox 16+, IE 10+, Safari 6.1+, Chrome 26+)
|
|
||||||
background-position: left bottom;
|
|
||||||
background-repeat: repeat-x;
|
|
||||||
float: left;
|
|
||||||
display: block;
|
|
||||||
height: 100%;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
line-height: @line-height-nav;
|
|
||||||
white-space: nowrap;
|
|
||||||
|
|
||||||
a {
|
|
||||||
// Tab separator: Border between tabs and outer right border.
|
|
||||||
background-position: right bottom;
|
|
||||||
color: @color-link;
|
|
||||||
.box-sizing( border-box );
|
|
||||||
display: block;
|
|
||||||
float: left;
|
|
||||||
height: unit( 40 / @font-size-tabs / @font-size-browser, em );
|
|
||||||
position: relative;
|
|
||||||
padding-top: 1.25em;
|
|
||||||
padding-left: 8px;
|
|
||||||
padding-right: 8px;
|
|
||||||
font-size: @font-size-tabs;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.new {
|
|
||||||
a,
|
|
||||||
a:visited {
|
|
||||||
color: @color-link-new;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.selected {
|
|
||||||
// Replace tab fade with flat color (matching top of would-be fade).
|
|
||||||
background-image: url( images/tab-current-fade.png );
|
|
||||||
// Overwrite above in browsers that support `rgba()`.
|
|
||||||
background: rgba( 255, 255, 255, 1 ); // stylelint-disable-line declaration-block-no-shorthand-property-overrides
|
|
||||||
|
|
||||||
a,
|
|
||||||
a:visited {
|
|
||||||
color: @color-link-selected;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon {
|
|
||||||
a {
|
|
||||||
background-position: right bottom;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Variants and Actions */
|
/* Variants and Actions */
|
||||||
.vectorMenu {
|
.vectorMenu {
|
||||||
direction: ltr;
|
direction: ltr;
|
||||||
|
@ -242,5 +158,3 @@
|
||||||
outline: auto -webkit-focus-ring-color; // Webkit style
|
outline: auto -webkit-focus-ring-color; // Webkit style
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@import 'watchstar.less';
|
|
|
@ -0,0 +1,88 @@
|
||||||
|
@import '../../variables.less';
|
||||||
|
@import 'mediawiki.mixins.less';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Styling for namespace tabs (page, discussion) and views (read, edit, view history, watch and other actions)
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* Namespaces and Views */
|
||||||
|
.vectorTabs {
|
||||||
|
// Tab separator: Outer start border (left in LTR) of tab row.
|
||||||
|
background-position: left bottom;
|
||||||
|
float: left;
|
||||||
|
height: 2.5em;
|
||||||
|
padding-left: @border-width-base;
|
||||||
|
|
||||||
|
/* Navigation Labels */
|
||||||
|
h3 {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
float: left;
|
||||||
|
height: 100%;
|
||||||
|
list-style: none none;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
li {
|
||||||
|
// Tab fade background: Fade inside from light grey to white.
|
||||||
|
background-image: url( images/tab-normal-fade.png ); // Support: IE 8 & 9, Fx 3.6-15, Safari 5.1-6, Chrome 10-25
|
||||||
|
background-image: linear-gradient( to top, @border-color-content--tabs-inactive 0, #e8f2f8 1px, #fff 100% ); // Support: Standard (Firefox 16+, IE 10+, Safari 6.1+, Chrome 26+)
|
||||||
|
background-position: left bottom;
|
||||||
|
background-repeat: repeat-x;
|
||||||
|
float: left;
|
||||||
|
display: block;
|
||||||
|
height: 100%;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
line-height: @line-height-nav;
|
||||||
|
white-space: nowrap;
|
||||||
|
|
||||||
|
a {
|
||||||
|
// Tab separator: Border between tabs and outer right border.
|
||||||
|
background-position: right bottom;
|
||||||
|
color: @color-link;
|
||||||
|
.box-sizing( border-box );
|
||||||
|
display: block;
|
||||||
|
float: left;
|
||||||
|
height: unit( 40 / @font-size-tabs / @font-size-browser, em );
|
||||||
|
position: relative;
|
||||||
|
padding-top: 1.25em;
|
||||||
|
padding-left: 8px;
|
||||||
|
padding-right: 8px;
|
||||||
|
font-size: @font-size-tabs;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.new {
|
||||||
|
a,
|
||||||
|
a:visited {
|
||||||
|
color: @color-link-new;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.selected {
|
||||||
|
// Replace tab fade with flat color (matching top of would-be fade).
|
||||||
|
background-image: url( images/tab-current-fade.png );
|
||||||
|
// Overwrite above in browsers that support `rgba()`.
|
||||||
|
background: rgba( 255, 255, 255, 1 ); // stylelint-disable-line declaration-block-no-shorthand-property-overrides
|
||||||
|
|
||||||
|
a,
|
||||||
|
a:visited {
|
||||||
|
color: @color-link-selected;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
a {
|
||||||
|
background-position: right bottom;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@import 'watchstar.less';
|
|
@ -169,3 +169,20 @@ pre,
|
||||||
#siteNotice {
|
#siteNotice {
|
||||||
font-size: @font-size-site-notice;
|
font-size: @font-size-site-notice;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mw-jump-link:not( :focus ) {
|
||||||
|
.mixin-screen-reader-text;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Head */
|
||||||
|
#mw-page-base {
|
||||||
|
background-position: bottom left;
|
||||||
|
height: 5em;
|
||||||
|
.vertical-gradient( @background-color-base, @background-color-secondary, 50%, 100% );
|
||||||
|
}
|
||||||
|
|
||||||
|
#mw-head-base {
|
||||||
|
margin-top: -5em;
|
||||||
|
margin-left: 10em;
|
||||||
|
height: 5em;
|
||||||
|
}
|
||||||
|
|
|
@ -1,138 +0,0 @@
|
||||||
@import 'mediawiki.mixins.less';
|
|
||||||
@import 'personalNavigation.less';
|
|
||||||
@import 'search.less';
|
|
||||||
@import 'tabs.less';
|
|
||||||
|
|
||||||
/* Hide, but keep accessible for screen-readers */
|
|
||||||
#mw-navigation h2 {
|
|
||||||
position: absolute;
|
|
||||||
top: -9999px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mw-jump-link:not( :focus ) {
|
|
||||||
.mixin-screen-reader-text;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Head */
|
|
||||||
#mw-page-base {
|
|
||||||
background-position: bottom left;
|
|
||||||
height: 5em;
|
|
||||||
.vertical-gradient( @background-color-base, @background-color-secondary, 50%, 100% );
|
|
||||||
}
|
|
||||||
|
|
||||||
#mw-head-base {
|
|
||||||
margin-top: -5em;
|
|
||||||
margin-left: 10em;
|
|
||||||
height: 5em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mw-head {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
right: 0;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Navigation Containers */
|
|
||||||
#left-navigation {
|
|
||||||
float: left;
|
|
||||||
margin-left: 10em;
|
|
||||||
margin-top: 2.5em;
|
|
||||||
/* When right nav would overlap left nav, it's placed below it
|
|
||||||
(normal CSS floats behavior). This rule ensures that no empty space
|
|
||||||
is shown between them due to right nav's margin-top. Page layout
|
|
||||||
is still broken, but at least the nav overlaps only the page title
|
|
||||||
instead of half the content. */
|
|
||||||
margin-bottom: -2.5em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#right-navigation {
|
|
||||||
float: right;
|
|
||||||
margin-top: 2.5em;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Logo */
|
|
||||||
#p-logo {
|
|
||||||
width: 10em;
|
|
||||||
height: 160px;
|
|
||||||
|
|
||||||
a {
|
|
||||||
background-position: center center;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
display: block;
|
|
||||||
width: 10em;
|
|
||||||
height: 160px;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Panel */
|
|
||||||
#mw-panel {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
width: 10em;
|
|
||||||
left: 0;
|
|
||||||
font-size: @font-size-nav-main;
|
|
||||||
|
|
||||||
.portal {
|
|
||||||
margin: 0 0.6em 0 0.7em;
|
|
||||||
padding: 0.25em 0;
|
|
||||||
direction: ltr;
|
|
||||||
|
|
||||||
h3 {
|
|
||||||
color: @color-nav-subtle;
|
|
||||||
font-weight: normal;
|
|
||||||
margin: 0.5em 0 0 ( @margin-left-nav-main-body / @font-size-nav-main-heading );
|
|
||||||
padding: 0.25em 0;
|
|
||||||
cursor: default;
|
|
||||||
border: 0;
|
|
||||||
font-size: @font-size-nav-main-heading;
|
|
||||||
}
|
|
||||||
|
|
||||||
.body {
|
|
||||||
background-image: url( images/portal-separator.png ); // Support: IE 8 & 9, Fx 3.6-15, Safari 5.1-6, Chrome 10-25
|
|
||||||
background-image: linear-gradient( to right, transparent 0, #c8ccd1 35%, #c8ccd1 70%, transparent 100% ); // Standard (Firefox 16+, IE 10+, Safari 6.1+, Chrome 26+)
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-size: 100% @border-width-base;
|
|
||||||
margin-left: @margin-left-nav-main-body;
|
|
||||||
padding-top: 0;
|
|
||||||
|
|
||||||
ul {
|
|
||||||
list-style: none none;
|
|
||||||
margin: 0;
|
|
||||||
padding-top: 0.3em;
|
|
||||||
}
|
|
||||||
|
|
||||||
li {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0.25em 0;
|
|
||||||
font-size: @font-size-nav-main-body;
|
|
||||||
line-height: @line-height-nav;
|
|
||||||
word-wrap: break-word;
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: @color-link;
|
|
||||||
|
|
||||||
&:visited {
|
|
||||||
color: @color-link--visited;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* First sidebar portlet. Not using :first-of-type for IE<=8 support. */
|
|
||||||
#p-logo + .portal {
|
|
||||||
background-image: none;
|
|
||||||
margin-top: 1em;
|
|
||||||
|
|
||||||
h3 {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.body {
|
|
||||||
background-image: none;
|
|
||||||
margin-left: @margin-left-nav-main-body;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,7 +1,12 @@
|
||||||
/* Vector screen styles */
|
/* Vector screen styles */
|
||||||
|
|
||||||
@import '../../variables.less';
|
@import '../../variables.less';
|
||||||
@import 'common.less';
|
@import 'common.less';
|
||||||
@import 'navigation.less';
|
@import 'PersonalMenu.less';
|
||||||
@import 'footer.less';
|
@import 'SearchBox.less';
|
||||||
|
@import 'VectorTabs.less';
|
||||||
|
@import 'VectorMenu.less';
|
||||||
|
@import 'Navigation.less';
|
||||||
|
@import 'Portal.less';
|
||||||
|
@import 'Sidebar.less';
|
||||||
|
@import 'Footer.less';
|
||||||
@import 'externalLinks.less';
|
@import 'externalLinks.less';
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import mustache from 'mustache';
|
import mustache from 'mustache';
|
||||||
import { FOOTER_TEMPLATE_DATA, footerTemplate } from './footer.stories.data';
|
import { FOOTER_TEMPLATE_DATA, footerTemplate } from './footer.stories.data';
|
||||||
import '../resources/skins.vector.styles/footer.less';
|
import '../resources/skins.vector.styles/Footer.less';
|
||||||
import '../.storybook/common.less';
|
import '../.storybook/common.less';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import mustache from 'mustache';
|
import mustache from 'mustache';
|
||||||
import '../resources/skins.vector.styles/navigation.less';
|
import '../resources/skins.vector.styles/VectorMenu.less';
|
||||||
import '../.storybook/common.less';
|
import '../.storybook/common.less';
|
||||||
import { vectorMenuTemplate, moreData, variantsData } from './menu.stories.data';
|
import { vectorMenuTemplate, moreData, variantsData } from './menu.stories.data';
|
||||||
|
|
||||||
|
|
|
@ -2,7 +2,7 @@ import mustache from 'mustache';
|
||||||
import { navTemplate, NAVIGATION_TEMPLATE_DATA,
|
import { navTemplate, NAVIGATION_TEMPLATE_DATA,
|
||||||
NAVIGATION_TEMPLATE_PARTIALS } from './navigation.stories.data';
|
NAVIGATION_TEMPLATE_PARTIALS } from './navigation.stories.data';
|
||||||
import '../.storybook/common.less';
|
import '../.storybook/common.less';
|
||||||
import '../resources/skins.vector.styles/navigation.less';
|
import '../resources/skins.vector.styles/Navigation.less';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
title: 'Navigation (Header + Sidebar)'
|
title: 'Navigation (Header + Sidebar)'
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import mustache from 'mustache';
|
import mustache from 'mustache';
|
||||||
import { personalMenuTemplate, PERSONAL_MENU_TEMPLATE_DATA } from './personalNavigation.stories.data';
|
import { personalMenuTemplate, PERSONAL_MENU_TEMPLATE_DATA } from './personalNavigation.stories.data';
|
||||||
import '../resources/skins.vector.styles/personalNavigation.less';
|
import '../resources/skins.vector.styles/PersonalMenu.less';
|
||||||
import '../.storybook/common.less';
|
import '../.storybook/common.less';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import mustache from 'mustache';
|
import mustache from 'mustache';
|
||||||
import portalTemplate from '!!raw-loader!../includes/templates/Portal.mustache';
|
import portalTemplate from '!!raw-loader!../includes/templates/Portal.mustache';
|
||||||
import '../resources/skins.vector.styles/navigation.less';
|
import '../resources/skins.vector.styles/Portal.less';
|
||||||
import '../.storybook/common.less';
|
import '../.storybook/common.less';
|
||||||
import { placeholder, htmluserlangattributes } from './utils';
|
import { placeholder, htmluserlangattributes } from './utils';
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import mustache from 'mustache';
|
import mustache from 'mustache';
|
||||||
import '../resources/skins.vector.styles/search.less';
|
import '../resources/skins.vector.styles/SearchBox.less';
|
||||||
import '../.storybook/common.less';
|
import '../.storybook/common.less';
|
||||||
import { searchBoxData, searchBoxTemplate } from './searchBox.stories.data';
|
import { searchBoxData, searchBoxTemplate } from './searchBox.stories.data';
|
||||||
|
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import mustache from 'mustache';
|
import mustache from 'mustache';
|
||||||
import '../.storybook/common.less';
|
import '../.storybook/common.less';
|
||||||
import '../resources/skins.vector.styles/navigation.less';
|
import '../resources/skins.vector.styles/Sidebar.less';
|
||||||
|
import '../resources/skins.vector.styles/Portal.less';
|
||||||
import { sidebarTemplate, SIDEBAR_DATA, SIDEBAR_TEMPLATE_PARTIALS } from './sidebar.stories.data';
|
import { sidebarTemplate, SIDEBAR_DATA, SIDEBAR_TEMPLATE_PARTIALS } from './sidebar.stories.data';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import mustache from 'mustache';
|
import mustache from 'mustache';
|
||||||
import { namespaceTabsData, pageActionsData, vectorTabsTemplate } from './tabs.stories.data';
|
import { namespaceTabsData, pageActionsData, vectorTabsTemplate } from './tabs.stories.data';
|
||||||
import '../resources/skins.vector.styles/tabs.less';
|
import '../resources/skins.vector.styles/VectorTabs.less';
|
||||||
import '../.storybook/common.less';
|
import '../.storybook/common.less';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
|
Loading…
Reference in New Issue