6907c81a15
Fixes the missing images in the Logo story. The current method of downloading the images into docs/ui/assets and treating them as static assets (with the start-storybook -s option) could be problematic if that directory is deleted or "cleaned" before the storybook build. Instead, the images are now downloaded into ./storybook/resolve-imports and imported explicitly in the code in Logo.stories.data.js. * ./storybook/resolve-less-imports renamed to resolve-imports * .gitignore is updated to reflect that * Webpack config is updated with the `resolve-imports` path * static option (-s) is removed from npm start script * Images are explicitly imported in Logo.stories.data.js * Type definitions are added for .svg and .png files Change-Id: I242d229242c86a5784d6d4611d0b9c7049712dac
87 lines
1.5 KiB
JavaScript
87 lines
1.5 KiB
JavaScript
/**
|
|
* @external LogoOptions
|
|
* @external LogoTemplateData
|
|
*/
|
|
|
|
import logoTemplate from '!!raw-loader!../includes/templates/Logo.mustache';
|
|
import wordmarkSrc from '../.storybook/resolve-imports/assets/wordmark.svg';
|
|
import tagelineScr from '../.storybook/resolve-imports/assets/tagline.svg';
|
|
import iconSrc from '../.storybook/resolve-imports/assets/icon.png';
|
|
|
|
/**
|
|
* @type {LogoOptions}
|
|
*/
|
|
const wordmark = {
|
|
src: wordmarkSrc,
|
|
width: 116,
|
|
height: 18
|
|
};
|
|
|
|
/**
|
|
* @type {LogoOptions}
|
|
*/
|
|
const tagline = {
|
|
src: tagelineScr,
|
|
width: 117,
|
|
height: 13
|
|
};
|
|
|
|
/**
|
|
* @type {string}
|
|
*/
|
|
const icon = iconSrc;
|
|
|
|
/**
|
|
* @type {LogoTemplateData}
|
|
*/
|
|
const wordmarkTaglineIcon = {
|
|
'data-logos': {
|
|
wordmark, tagline, icon
|
|
},
|
|
'msg-sitetitle': 'Wikipedia',
|
|
'msg-sitesubtitle': 'the free encyclopedia'
|
|
};
|
|
|
|
/**
|
|
* @type {LogoTemplateData}
|
|
*/
|
|
const wordmarkIcon = {
|
|
'data-logos': {
|
|
wordmark, icon
|
|
},
|
|
'msg-sitetitle': 'Wikipedia',
|
|
'msg-sitesubtitle': 'the free encyclopedia'
|
|
};
|
|
|
|
/**
|
|
* @type {LogoTemplateData}
|
|
*/
|
|
const wordmarkOnly = {
|
|
'data-logos': {
|
|
wordmark
|
|
},
|
|
'msg-sitetitle': 'Wikipedia',
|
|
'msg-sitesubtitle': 'the free encyclopedia'
|
|
};
|
|
|
|
/**
|
|
* @type {LogoTemplateData}
|
|
*/
|
|
const noLogo = {
|
|
'data-logos': {},
|
|
'msg-sitetitle': 'Wikipedia',
|
|
'msg-sitesubtitle': 'the free encyclopedia'
|
|
};
|
|
|
|
/**
|
|
* @type {Object.<string, LogoTemplateData>}
|
|
*/
|
|
const LOGO_TEMPLATE_DATA = {
|
|
wordmarkTaglineIcon,
|
|
wordmarkIcon,
|
|
wordmarkOnly,
|
|
noLogo
|
|
};
|
|
|
|
export { LOGO_TEMPLATE_DATA, logoTemplate };
|