diff --git a/config/exceptions.yaml b/config/exceptions.yaml index 39493973bdc..fdae942ddba 100644 --- a/config/exceptions.yaml +++ b/config/exceptions.yaml @@ -20,6 +20,7 @@ packageJson: - "Example/*" - "Footer/*" - "Icon/*" + - "LineDrawing/*" - "Logo/*" - "Navbar/*" - "Ogol/*" diff --git a/packages/components/LineDrawing/index.js b/packages/components/LineDrawing/index.js deleted file mode 100644 index c8d706b87d2..00000000000 --- a/packages/components/LineDrawing/index.js +++ /dev/null @@ -1,69 +0,0 @@ -/** - * @freesewing/components/LineDrawing | v2.0.0-beta.42 - * A collection of React components for FreeSewing web UIs - * (c) 2019 Joost De Cock (https://github.com/joostdecock) - * @license MIT - */ 'use strict' -function _interopDefault(a) { - return a && 'object' == typeof a && 'default' in a ? a['default'] : a -} -var React = _interopDefault(require('react')), - PropTypes = _interopDefault(require('prop-types')), - github = - 'M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12', - patterns = { - aaron: github, - benjamin: github, - bent: github, - brian: github, - bruce: github, - carlita: github, - carlton: github, - cathrin: github, - florent: github, - huey: github, - hugo: github, - jaeger: github, - sandy: github, - shin: github, - simon: github, - sven: github, - tamiko: github, - theo: github, - trayvon: github, - wahid: github - }, - LineDrawing = function(a) { - return React.createElement( - 'svg', - { - style: a.style, - className: a.className, - xmlns: 'http://www.w3.org/2000/svg', - width: a.size, - height: a.size, - viewBox: a.viewBox - }, - React.createElement('path', { - stroke: 'none', - fill: a.color ? a.color : 'currentColor', - d: patterns[a.pattern] - }) - ) - } -;(LineDrawing.propTypes = { - size: PropTypes.number, - viewBox: PropTypes.string, - pattern: PropTypes.string, - style: PropTypes.object -}), - (LineDrawing.defaultProps = { - size: 24, - viewBox: '0 0 24 24', - className: '', - pattern: 'github', - color: !1, - style: {} - }), - (module.exports = LineDrawing) -//# sourceMappingURL=index.js.map diff --git a/packages/components/LineDrawing/index.js.map b/packages/components/LineDrawing/index.js.map deleted file mode 100644 index 24b85ec79e1..00000000000 --- a/packages/components/LineDrawing/index.js.map +++ /dev/null @@ -1 +0,0 @@ -{"version":3,"file":"index.js","sources":["../src/LineDrawing/patterns.js","../src/LineDrawing/index.js"],"sourcesContent":["// FIXME: We need to actually draw these (as a single pathstring?)\n\nconst github =\n 'M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12'\n\nexport default {\n aaron: github,\n benjamin: github,\n bent: github,\n brian: github,\n bruce: github,\n carlita: github,\n carlton: github,\n cathrin: github,\n florent: github,\n huey: github,\n hugo: github,\n jaeger: github,\n sandy: github,\n shin: github,\n simon: github,\n sven: github,\n tamiko: github,\n theo: github,\n trayvon: github,\n wahid: github\n}\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport patterns from './patterns'\n\nconst LineDrawing = props => {\n return (\n \n \n \n )\n}\n\nLineDrawing.propTypes = {\n size: PropTypes.number,\n viewBox: PropTypes.string,\n pattern: PropTypes.string,\n style: PropTypes.object\n}\n\nLineDrawing.defaultProps = {\n size: 24,\n viewBox: '0 0 24 24',\n className: '',\n pattern: 'github',\n color: false,\n style: {}\n}\n\nexport default LineDrawing\n"],"names":["github","aaron","benjamin","bent","brian","bruce","carlita","carlton","cathrin","florent","huey","hugo","jaeger","sandy","shin","simon","sven","tamiko","theo","trayvon","wahid","LineDrawing","props","React","style","className","xmlns","width","size","height","viewBox","stroke","fill","color","d","patterns","pattern","propTypes","PropTypes","number","string","object","defaultProps"],"mappings":";;;;;oMAEMA,MAAM,CACV,otBAEa,CACbC,KAAK,CAAED,MADM,CAEbE,QAAQ,CAAEF,MAFG,CAGbG,IAAI,CAAEH,MAHO,CAIbI,KAAK,CAAEJ,MAJM,CAKbK,KAAK,CAAEL,MALM,CAMbM,OAAO,CAAEN,MANI,CAObO,OAAO,CAAEP,MAPI,CAQbQ,OAAO,CAAER,MARI,CASbS,OAAO,CAAET,MATI,CAUbU,IAAI,CAAEV,MAVO,CAWbW,IAAI,CAAEX,MAXO,CAYbY,MAAM,CAAEZ,MAZK,CAaba,KAAK,CAAEb,MAbM,CAcbc,IAAI,CAAEd,MAdO,CAebe,KAAK,CAAEf,MAfM,CAgBbgB,IAAI,CAAEhB,MAhBO,CAiBbiB,MAAM,CAAEjB,MAjBK,CAkBbkB,IAAI,CAAElB,MAlBO,CAmBbmB,OAAO,CAAEnB,MAnBI,CAoBboB,KAAK,CAAEpB,MApBM,ECDTqB,WAAW,CAAG,SAAAC,CAAA,CAAS,OAEzBC,CAAAA,mBAAA,MAAA,EACEC,KAAK,CAAEF,CAAK,CAACE,MACbC,SAAS,CAAEH,CAAK,CAACG,UACjBC,KAAK,CAAC,6BACNC,KAAK,CAAEL,CAAK,CAACM,KACbC,MAAM,CAAEP,CAAK,CAACM,KACdE,OAAO,CAAER,CAAK,CAACQ,QANjB,CAQEP,mBAAA,OAAA,EACEQ,MAAM,CAAC,OACPC,IAAI,CAAEV,CAAK,CAACW,KAANX,CAAcA,CAAK,CAACW,KAApBX,CAA4B,eAClCY,CAAC,CAAEC,QAAQ,CAACb,CAAK,CAACc,OAAP,EAHb,CARF,CAFJ,EAmBAf,WAAW,CAACgB,SAAZhB,CAAwB,CACtBO,IAAI,CAAEU,SAAS,CAACC,MADM,CAEtBT,OAAO,CAAEQ,SAAS,CAACE,MAFG,CAGtBJ,OAAO,CAAEE,SAAS,CAACE,MAHG,CAItBhB,KAAK,CAAEc,SAAS,CAACG,MAJK,EAOxBpB,WAAW,CAACqB,YAAZrB,CAA2B,CACzBO,IAAI,CAAE,EADmB,CAEzBE,OAAO,CAAE,WAFgB,CAGzBL,SAAS,CAAE,EAHc,CAIzBW,OAAO,CAAE,QAJgB,CAKzBH,KAAK,GALoB,CAMzBT,KAAK,CAAE,EANkB"} \ No newline at end of file diff --git a/packages/components/src/LineDrawing/index.js b/packages/components/src/LineDrawing/index.js index 7fed49e51c5..afeb06f9bbe 100644 --- a/packages/components/src/LineDrawing/index.js +++ b/packages/components/src/LineDrawing/index.js @@ -6,17 +6,13 @@ const LineDrawing = props => { return ( - + {patterns[props.pattern].map(el => el)} ) } @@ -29,10 +25,9 @@ LineDrawing.propTypes = { } LineDrawing.defaultProps = { - size: 24, - viewBox: '0 0 24 24', + size: 64, className: '', - pattern: 'github', + pattern: 'aaron', color: false, style: {} } diff --git a/packages/components/src/LineDrawing/patterns.js b/packages/components/src/LineDrawing/patterns.js index 4ddcd592041..66c5ba831f6 100644 --- a/packages/components/src/LineDrawing/patterns.js +++ b/packages/components/src/LineDrawing/patterns.js @@ -1,27 +1,360 @@ -// FIXME: We need to actually draw these (as a single pathstring?) +import React from 'react' -const github = - 'M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12' +const svg = { + aaron: [ + , + , + + ], + benjamin: [ + , + , + , + , + + ], + bent: [ + , + , + + ], + brian: [ + , + , + + ], + bruce: [ + , + + ], + carlita: [ + , + , + , + , + + ], + carlton: [ + , + , + , + , + + ], -export default { - aaron: github, - benjamin: github, - bent: github, - brian: github, - bruce: github, - carlita: github, - carlton: github, - cathrin: github, - florent: github, - huey: github, - hugo: github, - jaeger: github, - sandy: github, - shin: github, - simon: github, - sven: github, - tamiko: github, - theo: github, - trayvon: github, - wahid: github + cathrin: [ + , + , + , + + ], + florent: [ + , + , + + ], + huey: [ + , + , + , + , + , + + ], + hugo: [ + , + , + , + , + , + , + + ], + jaeger: [ + , + , + , + , + , + , + , + + ], + sandy: [ + , + + ], + shin: [ + , + + ], + simon: [ + , + , + , + , + , + , + + ], + sven: [ + , + , + , + + ], + tamiko: [ + , + , + + ], + theo: [ + , + , + , + + ], + trayvon: [ + , + + ], + wahid: [ + , + , + , + + ] } + +export default svg diff --git a/packages/css-theme/src/_components.scss b/packages/css-theme/src/_components.scss index 90a9eb4e612..4231884b195 100644 --- a/packages/css-theme/src/_components.scss +++ b/packages/css-theme/src/_components.scss @@ -9,3 +9,4 @@ @import "components/fab"; @import "components/spinner"; @import "components/box"; +@import "components/linedrawing"; diff --git a/packages/css-theme/src/components/_linedrawing.scss b/packages/css-theme/src/components/_linedrawing.scss new file mode 100644 index 00000000000..2fae6eac342 --- /dev/null +++ b/packages/css-theme/src/components/_linedrawing.scss @@ -0,0 +1,40 @@ +svg.fs.linedrawing { + path.primary { + stroke-width: 2; + } + path.secondary { + stroke-width: 1; + } + path.inside { + stroke-width: 2; + } +} + +.theme-wrapper.light svg.fs.linedrawing { + path.primary { + stroke: $oc-gray-8; + fill: $oc-gray-3; + } + path.secondary { + stroke: $oc-gray-8; + fill: none; + } + path.inside, rect.inside { + stroke: $oc-gray-8; + fill: $oc-gray-5; + } +} +.theme-wrapper.dark svg.fs.linedrawing { + path.primary { + stroke: $oc-gray-5; + fill: $oc-gray-9; + } + path.secondary { + stroke: $oc-gray-5; + fill: none; + } + path.inside, rect.inside { + stroke: $oc-gray-5; + fill: $oc-gray-7; + } +}