Storybook: Consistent styling

- Make sure common styles are loaded for all components
- Add icon in user menu

Fixes renders of:
- Language button (no top margin and button styles)
- MenuPortal (no left margins)


Change-Id: I98b4820b6d91d46fd27a1d433d5bacd187a7cbb0

.storybook/common.less

@@ -1,10 +1,11 @@
 @import '../resources/common/variables.less';
-@import 'integration.less';
-@import 'icons.less';
+@import './integration.less';
+@import './icons.less';
 @import '../skinStyles/mediawiki.ui.icon.less';
 
 body {
 	font-family: @font-family-sans;
+	margin: 0;
 }
 
 a {

.storybook/config.js

@@ -1,4 +1,5 @@
 import { configure } from '@storybook/html';
+import './common.less';
 
 // automatically import all files ending in *.stories.js
 configure(require.context('../stories', true, /\.stories\.js$/), module);

.storybook/icons.less

@@ -22,3 +22,8 @@
 .mw-ui-icon-wikimedia-language:before {
 	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3Elanguage%3C/title%3E%3Cg fill='%2354595d'%3E%3Cpath d='M20 18h-1.44a.61.61 0 01-.4-.12.81.81 0 01-.23-.31L17 15h-5l-1 2.54a.77.77 0 01-.22.3.59.59 0 01-.4.14H9l4.55-11.47h1.89zm-3.53-4.31L14.89 9.5a11.62 11.62 0 01-.39-1.24q-.09.37-.19.69l-.19.56-1.58 4.19zm-6.3-1.58a13.43 13.43 0 01-2.91-1.41 11.46 11.46 0 002.81-5.37H12V4H7.31a4 4 0 00-.2-.56C6.87 2.79 6.6 2 6.6 2l-1.47.5s.4.89.6 1.5H0v1.33h2.15A11.23 11.23 0 005 10.7a17.19 17.19 0 01-5 2.1q.56.82.87 1.38a23.28 23.28 0 005.22-2.51 15.64 15.64 0 003.56 1.77zM3.63 5.33h4.91a8.11 8.11 0 01-2.45 4.45 9.11 9.11 0 01-2.46-4.45z'/%3E%3C/g%3E%3C/svg%3E");
 }
+
+#pt-anonuserpage,
+#pt-userpage a {
+	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAx0lEQVQ4jdXSzQmEQAwFYEuYUixhSwgkA8mQgKXYgS3YgXZgCZagHWgHuxf14t8osssGcv145CVJvjk+hBRFK2TrkK1D0cqHkN7CUBRI7L21KAqXMIDModiwD9oAkLlH0i3L+ooGiTWPAPPfJQTIHLGOB9h46YZnKS+3PI8PISW2GkV7FO2Jrb79h4+ODyElsYJYm437NSRWRCWdylgj++U0u+UAZI5E22hsWW03UWQtr2NT66zlCjz8uzNQbFiDN7F5/xB8aj57Ynp2FKI0bAAAAABJRU5ErkJggg==") !important;
+}

stories/Footer.stories.js

@@ -2,7 +2,6 @@ import mustache from 'mustache';
 import { FOOTER_TEMPLATE_DATA, FOOTER_TEMPLATE_PARTIALS,
 	footerTemplate } from './Footer.stories.data';
 import '../resources/skins.vector.styles/Footer.less';
-import '../.storybook/common.less';
 
 export default {
 	title: 'Footer'

stories/LanguageButton.stories.js

@@ -2,7 +2,6 @@ import mustache from 'mustache';
 import '../resources/skins.vector.styles/LanguageButton.less';
 import { vectorMenuTemplate } from './MenuDropdown.stories.data';
 import { languageData } from './LanguageButton.stories.data';
-import '../.storybook/common.less';
 
 export default {
 	title: 'LanguageButton'

stories/Menu.stories.js

@@ -1,7 +1,6 @@
 import mustache from 'mustache';
 import { menuTemplate, PERSONAL_MENU_TEMPLATE_DATA } from './Menu.stories.data';
 import '../resources/skins.vector.styles/Menu.less';
-import '../.storybook/common.less';
 
 export default {
 	title: 'Menu'

stories/MenuDropdown.stories.js

@@ -1,6 +1,5 @@
 import mustache from 'mustache';
 import '../resources/skins.vector.styles/MenuDropdown.less';
-import '../.storybook/common.less';
 import { vectorMenuTemplate, moreData, variantsData } from './MenuDropdown.stories.data';
 
 export default {

stories/MenuPortal.stories.data.js

@@ -4,7 +4,6 @@
 import mustache from 'mustache';
 import { vectorMenuTemplate as portalTemplate } from './MenuDropdown.stories.data';
 import '../resources/skins.vector.styles/MenuPortal.less';
-import '../.storybook/common.less';
 import { placeholder, htmlUserLanguageAttributes, portletAfter } from './utils';
 
 /**

stories/MenuTabs.stories.js

@@ -3,7 +3,6 @@ import { menuTemplate as vectorTabsTemplate } from './Menu.stories.data';
 import { namespaceTabsData, pageActionsData } from './MenuTabs.stories.data';
 import '../resources/skins.vector.styles/MenuTabs.less';
 import '../resources/skins.vector.styles/TabWatchstarLink.less';
-import '../.storybook/common.less';
 
 export default {
 	title: 'MenuTabs'

stories/SearchBox.stories.js

@@ -1,6 +1,5 @@
 import mustache from 'mustache';
 import '../resources/skins.vector.styles/SearchBox.less';
-import '../.storybook/common.less';
 import { searchBoxData, searchBoxTemplate } from './SearchBox.stories.data';
 
 export default {

stories/Sidebar.stories.js

@@ -1,8 +1,8 @@
 import mustache from 'mustache';
-import '../.storybook/common.less';
 import '../resources/skins.vector.styles/Sidebar.less';
 import '../resources/skins.vector.styles/SidebarLogo.less';
 import '../resources/skins.vector.styles/MenuPortal.less';
+
 import { sidebarTemplate,
 	sidebarLegacyTemplate, SIDEBAR_DATA, SIDEBAR_TEMPLATE_PARTIALS } from './Sidebar.stories.data';