[react] feat: Added docs for components/LineDrawing
This commit is contained in:
joostdecock
parent
439315de02
commit
254e271196
40 changed files with 1204 additions and 163 deletions
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.5
|
|||
/**
|
||||
* A linedrawing component for Aaron
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Aaron = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-2 -15 152 152" {...{ stroke, className }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Aaron = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Aaron
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const AaronFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-23 0 119 119" {...{ className }}>
|
||||
|
|
@ -37,9 +41,11 @@ export const AaronFront = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Aaron
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const AaronBack = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="51 0 119 119" {...{ className }}>
|
||||
|
|
@ -50,7 +56,7 @@ export const AaronBack = ({ className, stroke = 1 }) => (
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.5
|
|||
/**
|
||||
* A linedrawing component for Albert
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Albert = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-10 -2 146 146" {...{ className }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Albert = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Albert
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const AlbertFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-41 -2 145 145" {...{ className }}>
|
||||
|
|
@ -37,9 +41,11 @@ export const AlbertFront = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Albert
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const AlbertBack = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="74 0 74 119" {...props}>
|
||||
|
|
@ -50,7 +56,7 @@ export const AlbertBack = ({ className, stroke = 1 }) => (
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.4
|
|||
/**
|
||||
* A linedrawing component for Bee
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Bee = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-20 0 120 120" {...{ stroke, className }}>
|
||||
|
|
@ -21,14 +23,20 @@ export const Bee = ({ className, stroke = 1 }) => (
|
|||
)
|
||||
|
||||
/**
|
||||
* Front is the same
|
||||
* A linedrawing component for the front of Bee
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const BeeFront = Bee
|
||||
|
||||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.5
|
|||
/**
|
||||
* A linedrawing component for Bella
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Bella = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="2 -30 155 155" {...{ stroke, className }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Bella = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Bella
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const BellaFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-4 2 89 86" {...{ className, stroke }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const BellaFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Bella
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const BellaBack = ({
|
||||
className = 'tw:w-full', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const BellaBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 1.2
|
|||
/**
|
||||
* A linedrawing component for Benjamin
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Benjamin = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 -44 138 138" {...{ className, stroke }}>
|
||||
|
|
@ -20,15 +22,21 @@ export const Benjamin = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* Front is the same
|
||||
/**
|
||||
* A linedrawing component for the front of Benjamin
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const BenjaminFront = Benjamin
|
||||
|
||||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="folds"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.7
|
|||
/**
|
||||
* A linedrawing component for Bent
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Bent = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 -70 210 210" {...{ stroke }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Bent = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Bent
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const BentFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 -1 103 103" {...{ className, stroke }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const BentFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Bent
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const BentBack = ({
|
||||
className = 'tw:w-full', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const BentBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.5
|
|||
/**
|
||||
* A linedrawing component for Bibi
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Bibi = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="2 -34 167 167" {...{ className }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Bibi = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Bibi
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const BibiFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 85 90" {...{ className }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const BibiFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Bibi
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const BibiBack = ({
|
||||
className = 'tw:w-full', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const BibiBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.15
|
|||
/**
|
||||
* A linedrawing component for Bob
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Bob = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-1 -26 138 138" {...{ className }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Bob = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Bob
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const BobFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-10 1 87 87" {...{ className }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const BobFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Bob
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const BobBack = ({
|
||||
className = 'tw:w-full', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const BobBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.3
|
|||
/**
|
||||
* A linedrawing component for Breanna
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Breanna = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-5 0 106 106" {...{ className, stroke }}>
|
||||
|
|
@ -24,11 +26,13 @@ export const Breanna = ({ className, stroke = 1 }) => (
|
|||
)
|
||||
|
||||
/**
|
||||
* A linedrawing component for Breanna
|
||||
* A linedrawing component for the front of Breanna
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const BreannaFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 -15 92 92" {...{ className }}>
|
||||
|
|
@ -36,8 +40,14 @@ export const BreannaFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Breanna
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const BreannaBack = ({
|
||||
className = 'tw:w-full', // CSS classes to apply
|
||||
|
|
@ -56,7 +66,7 @@ export const BreannaBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.5
|
|||
/**
|
||||
* A linedrawing component for Brian
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Brian = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 -40 189 189" {...{ className }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Brian = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Brian
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const BrianFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 93 93" {...{ className, stroke }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const BrianFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Brian
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const BrianBack = ({
|
||||
className = 'tw:w-full', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const BrianBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.5
|
|||
/**
|
||||
* A linedrawing component for Bruce
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Bruce = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-27 0 155 155" {...{ className, stroke }}>
|
||||
|
|
@ -26,9 +28,11 @@ export const Bruce = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Bruce
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const BruceFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 -10 101 101" {...{ className }}>
|
||||
|
|
@ -36,8 +40,14 @@ export const BruceFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Bruce
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const BruceBack = ({
|
||||
className = 'tw:w-full', // CSS classes to apply
|
||||
|
|
@ -56,7 +66,7 @@ export const BruceBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.5
|
|||
/**
|
||||
* A linedrawing component for Carlita
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Carlita = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 194 175" {...{ className }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Carlita = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Carlita
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const CarlitaFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-35 4 168 168" {...{ className }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const CarlitaFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Carlita
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const CarlitaBack = ({
|
||||
className = 'w-64', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const CarlitaBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.5
|
|||
/**
|
||||
* A linedrawing component for Carlton
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Carlton = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 194 175" {...{ className, stroke }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Carlton = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Carlton
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const CarltonFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-35 4 168 168" {...{ className }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const CarltonFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Carlton
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const CarltonBack = ({
|
||||
className = 'w-64', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const CarltonBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 1.8
|
|||
/**
|
||||
* A linedrawing component for Charlie
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Charlie = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 214 265" {...{ className }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Charlie = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Charlie
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const CharlieFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-70 0 265 265" {...{ className }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const CharlieFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Charlie
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const CharlieBack = ({
|
||||
className = 'w-64', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const CharlieBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 1.3
|
|||
/**
|
||||
* A linedrawing component for Cornelius
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Cornelius = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 320 218" {...{ className, stroke }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Cornelius = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Cornelius
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const CorneliusFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-30 0 215 215" {...{ className, stroke }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const CorneliusFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Cornelius
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const CorneliusBack = ({
|
||||
className = 'w-64', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const CorneliusBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 1
|
|||
/**
|
||||
* A linedrawing component for Diana
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Diana = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 282 111" {...{ className }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Diana = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front Diana
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const DianaFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 -10 141 141" {...{ className }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const DianaFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back Diana
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const DianaBack = ({
|
||||
className = 'w-64', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const DianaBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 1.3
|
|||
/**
|
||||
* A linedrawing component for Florence
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Florence = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-1 -10 245 245" {...{ className }}>
|
||||
|
|
@ -20,13 +22,21 @@ export const Florence = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
// Front is the same
|
||||
/**
|
||||
* A linedrawing component for the front of Florence
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const FlorenceFront = Florence
|
||||
|
||||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -8,11 +8,13 @@ import { LineDrawingWrapper, thin, dashed } from './shared.mjs'
|
|||
const strokeScale = 1.3
|
||||
|
||||
/**
|
||||
* A linedrawing component for Florence
|
||||
* A linedrawing component for Florent
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Florent = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 -30 236 236" {...{ className, stroke }}>
|
||||
|
|
@ -20,13 +22,21 @@ export const Florent = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
// Front is the same
|
||||
/**
|
||||
* A linedrawing component for the front of Florent
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const FlorentFront = Florent
|
||||
|
||||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 1.3
|
|||
/**
|
||||
* A linedrawing component for Gozer
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Gozer = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 186 178" {...{ className }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Gozer = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Gozer
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const GozerFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-40 0 178 178" {...{ className, stroke }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const GozerFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Gozer
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const GozerBack = ({
|
||||
className = 'w-64', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const GozerBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="folds"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 1.3
|
|||
/**
|
||||
* A linedrawing component for Hi
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Hi = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 -40 228 228" {...{ className }}>
|
||||
|
|
@ -20,13 +22,21 @@ export const Hi = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
// Front is the same
|
||||
/**
|
||||
* A linedrawing component for the front of Hi
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const HiFront = Hi
|
||||
|
||||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="folds"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 1.3
|
|||
/**
|
||||
* A linedrawing component for Holmes
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Holmes = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 -30 260 260" {...{ className }}>
|
||||
|
|
@ -20,13 +22,21 @@ export const Holmes = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
// Front is the same
|
||||
/**
|
||||
* A linedrawing component for the front of Holmes
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const HolmesFront = Holmes
|
||||
|
||||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.7
|
|||
/**
|
||||
* A linedrawing component for Hortensia
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Hortensia = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-2 0 129 129" {...{ className }}>
|
||||
|
|
@ -20,7 +22,15 @@ export const Hortensia = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
// Front is the same
|
||||
/**
|
||||
* A linedrawing component for the front of Hortensia
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const HortensiaFront = Hortensia
|
||||
|
||||
/*
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.7
|
|||
/**
|
||||
* A linedrawing component for Huey
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Huey = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 334 218" {...{ className }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Huey = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for front of Huey
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const HueyFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-20 0 216 216" {...{ className }}>
|
||||
|
|
@ -54,7 +58,7 @@ export const HueyBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.7
|
|||
/**
|
||||
* A linedrawing component for Hugo
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Hugo = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 334 334" {...{ className, stroke }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Hugo = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Hugo
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const HugoFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-27 0 218 218" {...{ className, stroke }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const HugoFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Hugo
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const HugoBack = ({
|
||||
className = 'w-64', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const HugoBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -8,11 +8,13 @@ import { LineDrawingWrapper, thin, dashed } from './shared.mjs'
|
|||
const strokeScale = 0.5
|
||||
|
||||
/**
|
||||
* A linedrawing component for Aaron
|
||||
* A linedrawing component for Jane
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Jane = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 1052.0441 2409.9082" {...{ stroke, className }}>
|
||||
|
|
@ -22,11 +24,13 @@ export const Jane = ({ className, stroke = 1 }) => (
|
|||
)
|
||||
|
||||
/**
|
||||
* A linedrawing component for the front of Aaron
|
||||
* A linedrawing component for the front of Jane
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const JaneFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 1052.0441 1204.9541" {...{ className }}>
|
||||
|
|
@ -35,11 +39,13 @@ export const JaneFront = ({ className, stroke = 1 }) => (
|
|||
)
|
||||
|
||||
/**
|
||||
* A linedrawing component for the front of Aaron
|
||||
* A linedrawing component for the back of Jane
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const JaneBack = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 1052.0441 1204.9541" {...{ className }}>
|
||||
|
|
@ -50,7 +56,7 @@ export const JaneBack = ({ className, stroke = 1 }) => (
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="outline"
|
||||
|
|
|
|||
|
|
@ -8,11 +8,13 @@ import { LineDrawingWrapper, regular } from './shared.mjs'
|
|||
const strokeScale = 0.9
|
||||
|
||||
/**
|
||||
* A linedrawing component for Hugo
|
||||
* A linedrawing component for Lucy
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Lucy = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 -30 202 202" {...{ className }}>
|
||||
|
|
@ -20,13 +22,21 @@ export const Lucy = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
// Front is the same
|
||||
/**
|
||||
* A linedrawing component for the front of Lucy
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const LucyFront = Lucy
|
||||
|
||||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="outline"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.7
|
|||
/**
|
||||
* A linedrawing component for Lumina
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Lumina = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 187 117" {...{ className, stroke }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Lumina = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Lumina
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const LuminaFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-20 0 127 127" {...{ className, stroke }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const LuminaFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Lumina
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const LuminaBack = ({
|
||||
className = 'w-64', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const LuminaBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 1.2
|
|||
/**
|
||||
* A linedrawing component for Lumira
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Lumira = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 187 220" {...{ className, stroke }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Lumira = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Lumira
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const LumiraFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-60 0 220 220" {...{ className, stroke }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const LumiraFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Lumira
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const LumiraBack = ({
|
||||
className = 'w-64', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const LumiraBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 1.5
|
|||
/**
|
||||
* A linedrawing component for Lunetius
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Lunetius = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-60 0 294 294" {...{ className }}>
|
||||
|
|
@ -20,13 +22,21 @@ export const Lunetius = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
// Front is the same
|
||||
/**
|
||||
* A linedrawing component for the front of Lunetius
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const LunetiusFront = Lunetius
|
||||
|
||||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -4,9 +4,11 @@ import { LineDrawingWrapper, regular } from './shared.mjs'
|
|||
/**
|
||||
* A linedrawing component for designs that do not (yet) have their own
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const MissingLinedrawing = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 100 100" {...{ className }}>
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.4
|
|||
/**
|
||||
* A linedrawing component for Noble
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Noble = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 152 83" {...{ className, stroke }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Noble = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Noble
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const NobleFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-5 0 83 83" {...{ className, stroke }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const NobleFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Noble
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const NobleBack = ({
|
||||
className = 'w-64', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const NobleBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.15
|
|||
/**
|
||||
* A linedrawing component for Simon
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Simon = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 157 121" {...{ className, stroke }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Simon = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Simon
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const SimonFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-20 0 122 122" {...{ className, stroke }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const SimonFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Simon
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const SimonBack = ({
|
||||
className = 'w-64', // CSS classes to apply
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.5
|
|||
/**
|
||||
* A linedrawing component for Teagan
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Teagan = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 170 90" {...{ className }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Teagan = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Teagan
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const TeaganFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-2 0 90 90" {...{ className }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const TeaganFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Teagan
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const TeaganBack = ({
|
||||
className = 'w-64', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const TeaganBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.5
|
|||
/**
|
||||
* A linedrawing component for Tristan
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Tristan = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 152 102" {...{ className }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Tristan = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Tristan
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const TristanFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-15 0 102 102" {...{ className }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const TristanFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Tristan
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const TristanBack = ({
|
||||
className = 'w-64', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const TristanBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="folds"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.5
|
|||
/**
|
||||
* A linedrawing component for Uma
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Uma = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 221 75" {...{ className }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Uma = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Uma
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const UmaFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 -15 105 105" {...{ className }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const UmaFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Uma
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const UmaBack = ({
|
||||
className = 'w-64', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const UmaBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.5
|
|||
/**
|
||||
* A linedrawing component for Umbra
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Umbra = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 221 75" {...{ className }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Umbra = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Umbra
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const UmbraFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 -15 105 105" {...{ className }}>
|
||||
|
|
@ -34,8 +38,14 @@ export const UmbraFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/*
|
||||
* React component for the back
|
||||
/**
|
||||
* A linedrawing component for the back of Umbra
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const UmbraBack = ({
|
||||
className = 'w-64', // CSS classes to apply
|
||||
|
|
@ -54,7 +64,7 @@ export const UmbraBack = ({
|
|||
/*
|
||||
* SVG elements for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
<path
|
||||
key="stitches"
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ const strokeScale = 0.5
|
|||
/**
|
||||
* A linedrawing component for Wahid
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const Wahid = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="0 0 162 126" {...{ className }}>
|
||||
|
|
@ -24,9 +26,11 @@ export const Wahid = ({ className, stroke = 1 }) => (
|
|||
/**
|
||||
* A linedrawing component for the front of Wahid
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const WahidFront = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-20 0 126 126" {...{ className }}>
|
||||
|
|
@ -34,6 +38,15 @@ export const WahidFront = ({ className, stroke = 1 }) => (
|
|||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
/**
|
||||
* A linedrawing component for the back of Wahid
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const WahidBack = ({
|
||||
className = 'w-64', // CSS classes to apply
|
||||
stroke = 1, // Stroke width to use
|
||||
|
|
@ -68,7 +81,7 @@ const defs = (
|
|||
/*
|
||||
* React component for the front
|
||||
*/
|
||||
export const Front = ({ stroke }) => (
|
||||
const Front = ({ stroke }) => (
|
||||
<>
|
||||
{defs}
|
||||
<path
|
||||
|
|
|
|||
|
|
@ -18,3 +18,4 @@ jsdoc -c jsdoc.json components/Input/* > ../../sites/dev/prebuild/jsdoc/react/co
|
|||
jsdoc -c jsdoc.json components/Json/* > ../../sites/dev/prebuild/jsdoc/react/components/json.json
|
||||
jsdoc -c jsdoc.json components/KeyVal/* > ../../sites/dev/prebuild/jsdoc/react/components/keyval.json
|
||||
jsdoc -c jsdoc.json components/Layout/* > ../../sites/dev/prebuild/jsdoc/react/components/layout.json
|
||||
jsdoc -c jsdoc.json components/LineDrawing/* > ../../sites/dev/prebuild/jsdoc/react/components/linedrawing.json
|
||||
|
|
|
|||
|
|
@ -0,0 +1,166 @@
|
|||
import React from 'react'
|
||||
import {
|
||||
lineDrawings,
|
||||
lineDrawingsBack,
|
||||
lineDrawingsFront,
|
||||
} from '@freesewing/react/components/LineDrawing'
|
||||
import { capitalize } from '@freesewing/utils'
|
||||
|
||||
/*
|
||||
* Use this to auto-generate content in this file
|
||||
export const Generate = () => {
|
||||
const output = []
|
||||
// Imports (for readme.mdx)
|
||||
output.push(
|
||||
`import {`,
|
||||
...Object.keys(lineDrawings).map(d => ` ${capitalize(d)}Example,`),
|
||||
...Object.keys(lineDrawingsFront).map(d => ` ${capitalize(d)}FrontExample,`),
|
||||
...Object.keys(lineDrawingsBack).map(d => ` ${capitalize(d)}BackExample,`),
|
||||
`} from './_examples.js'`,
|
||||
)
|
||||
|
||||
// List (for readme.mdx)
|
||||
output.push(
|
||||
`\n\n`,
|
||||
...[
|
||||
...Object.keys(lineDrawings).map(d => ` - [${capitalize(d)}](#${d})`),
|
||||
...Object.keys(lineDrawingsFront).map(d => ` - [${capitalize(d)}Front](#${d}front)`),
|
||||
...Object.keys(lineDrawingsBack).map(d => ` - [${capitalize(d)}Back](#${d}back)`),
|
||||
].sort()
|
||||
)
|
||||
|
||||
// Docs (for readme.mdx)
|
||||
output.push(
|
||||
`\n\n`,
|
||||
...[
|
||||
...Object.keys(lineDrawings).map(d => `## ${capitalize(d)}\n<ComponentDocs docs={jsdoc.jsdoc${capitalize(d)}} example={${capitalize(d)}Example} />\n`),
|
||||
...Object.keys(lineDrawingsFront).map(d => `## ${capitalize(d)}Front\n<ComponentDocs docs={jsdoc.jsdoc${capitalize(d)}Front} example={${capitalize(d)}FrontExample} />\n`),
|
||||
...Object.keys(lineDrawingsBack).map(d => `## ${capitalize(d)}Back\n<ComponentDocs docs={jsdoc.jsdoc${capitalize(d)}Back} example={${capitalize(d)}BackExample} />\n`),
|
||||
].sort()
|
||||
)
|
||||
|
||||
// Exports (for _examples.js)
|
||||
output.push(
|
||||
[
|
||||
...Object.keys(lineDrawings).map(d => `export const ${capitalize(d)}Example = () => <LineDrawingExample design="${d}" />`),
|
||||
...Object.keys(lineDrawingsFront).map(d => `export const ${capitalize(d)}FrontExample = () => <LineDrawingExample design="${d}" side="front" />`),
|
||||
...Object.keys(lineDrawingsBack).map(d => `export const ${capitalize(d)}BackExample = () => <LineDrawingExample design="${d}" side="back" />`),
|
||||
].sort().join("\n")
|
||||
)
|
||||
|
||||
return <pre>{output.join("\n")}</pre>
|
||||
}
|
||||
*/
|
||||
|
||||
const NotFound = () => <p>No such linedrawing</p>
|
||||
|
||||
const LineDrawingExample = ({ design, side=false }) => {
|
||||
let Component = NotFound
|
||||
if (side === 'back' && lineDrawingsBack[design]) Component = lineDrawingsBack[design]
|
||||
else if (side === 'front' && lineDrawingsFront[design]) Component = lineDrawingsFront[design]
|
||||
else if (lineDrawings[design]) Component = lineDrawings[design]
|
||||
|
||||
return <Component {...{ side, design }} />
|
||||
}
|
||||
|
||||
export const AaronBackExample = () => <LineDrawingExample design="aaron" side="back" />
|
||||
export const AaronExample = () => <LineDrawingExample design="aaron" />
|
||||
export const AaronFrontExample = () => <LineDrawingExample design="aaron" side="front" />
|
||||
export const AlbertExample = () => <LineDrawingExample design="albert" />
|
||||
export const AlbertFrontExample = () => <LineDrawingExample design="albert" side="front" />
|
||||
export const BeeExample = () => <LineDrawingExample design="bee" />
|
||||
export const BeeFrontExample = () => <LineDrawingExample design="bee" side="front" />
|
||||
export const BellaBackExample = () => <LineDrawingExample design="bella" side="back" />
|
||||
export const BellaExample = () => <LineDrawingExample design="bella" />
|
||||
export const BellaFrontExample = () => <LineDrawingExample design="bella" side="front" />
|
||||
export const BenjaminExample = () => <LineDrawingExample design="benjamin" />
|
||||
export const BenjaminFrontExample = () => <LineDrawingExample design="benjamin" side="front" />
|
||||
export const BentBackExample = () => <LineDrawingExample design="bent" side="back" />
|
||||
export const BentExample = () => <LineDrawingExample design="bent" />
|
||||
export const BentFrontExample = () => <LineDrawingExample design="bent" side="front" />
|
||||
export const BibiBackExample = () => <LineDrawingExample design="bibi" side="back" />
|
||||
export const BibiExample = () => <LineDrawingExample design="bibi" />
|
||||
export const BibiFrontExample = () => <LineDrawingExample design="bibi" side="front" />
|
||||
export const BobBackExample = () => <LineDrawingExample design="bob" side="back" />
|
||||
export const BobExample = () => <LineDrawingExample design="bob" />
|
||||
export const BobFrontExample = () => <LineDrawingExample design="bob" side="front" />
|
||||
export const BreannaBackExample = () => <LineDrawingExample design="breanna" side="back" />
|
||||
export const BreannaExample = () => <LineDrawingExample design="breanna" />
|
||||
export const BreannaFrontExample = () => <LineDrawingExample design="breanna" side="front" />
|
||||
export const BrianBackExample = () => <LineDrawingExample design="brian" side="back" />
|
||||
export const BrianExample = () => <LineDrawingExample design="brian" />
|
||||
export const BrianFrontExample = () => <LineDrawingExample design="brian" side="front" />
|
||||
export const BruceBackExample = () => <LineDrawingExample design="bruce" side="back" />
|
||||
export const BruceExample = () => <LineDrawingExample design="bruce" />
|
||||
export const BruceFrontExample = () => <LineDrawingExample design="bruce" side="front" />
|
||||
export const CarlitaBackExample = () => <LineDrawingExample design="carlita" side="back" />
|
||||
export const CarlitaExample = () => <LineDrawingExample design="carlita" />
|
||||
export const CarlitaFrontExample = () => <LineDrawingExample design="carlita" side="front" />
|
||||
export const CarltonBackExample = () => <LineDrawingExample design="carlton" side="back" />
|
||||
export const CarltonExample = () => <LineDrawingExample design="carlton" />
|
||||
export const CarltonFrontExample = () => <LineDrawingExample design="carlton" side="front" />
|
||||
export const CathrinBackExample = () => <LineDrawingExample design="cathrin" side="back" />
|
||||
export const CathrinExample = () => <LineDrawingExample design="cathrin" />
|
||||
export const CathrinFrontExample = () => <LineDrawingExample design="cathrin" side="front" />
|
||||
export const CharlieBackExample = () => <LineDrawingExample design="charlie" side="back" />
|
||||
export const CharlieExample = () => <LineDrawingExample design="charlie" />
|
||||
export const CharlieFrontExample = () => <LineDrawingExample design="charlie" side="front" />
|
||||
export const CorneliusBackExample = () => <LineDrawingExample design="cornelius" side="back" />
|
||||
export const CorneliusExample = () => <LineDrawingExample design="cornelius" />
|
||||
export const CorneliusFrontExample = () => <LineDrawingExample design="cornelius" side="front" />
|
||||
export const DianaBackExample = () => <LineDrawingExample design="diana" side="back" />
|
||||
export const DianaExample = () => <LineDrawingExample design="diana" />
|
||||
export const DianaFrontExample = () => <LineDrawingExample design="diana" side="front" />
|
||||
export const FlorenceExample = () => <LineDrawingExample design="florence" />
|
||||
export const FlorenceFrontExample = () => <LineDrawingExample design="florence" side="front" />
|
||||
export const FlorentExample = () => <LineDrawingExample design="florent" />
|
||||
export const FlorentFrontExample = () => <LineDrawingExample design="florent" side="front" />
|
||||
export const GozerBackExample = () => <LineDrawingExample design="gozer" side="back" />
|
||||
export const GozerExample = () => <LineDrawingExample design="gozer" />
|
||||
export const GozerFrontExample = () => <LineDrawingExample design="gozer" side="front" />
|
||||
export const HiExample = () => <LineDrawingExample design="hi" />
|
||||
export const HiFrontExample = () => <LineDrawingExample design="hi" side="front" />
|
||||
export const HolmesExample = () => <LineDrawingExample design="holmes" />
|
||||
export const HolmesFrontExample = () => <LineDrawingExample design="holmes" side="front" />
|
||||
export const HortensiaExample = () => <LineDrawingExample design="hortensia" />
|
||||
export const HortensiaFrontExample = () => <LineDrawingExample design="hortensia" side="front" />
|
||||
export const HueyBackExample = () => <LineDrawingExample design="huey" side="back" />
|
||||
export const HueyExample = () => <LineDrawingExample design="huey" />
|
||||
export const HueyFrontExample = () => <LineDrawingExample design="huey" side="front" />
|
||||
export const HugoBackExample = () => <LineDrawingExample design="hugo" side="back" />
|
||||
export const HugoExample = () => <LineDrawingExample design="hugo" />
|
||||
export const HugoFrontExample = () => <LineDrawingExample design="hugo" side="front" />
|
||||
export const JaneBackExample = () => <LineDrawingExample design="jane" side="back" />
|
||||
export const JaneExample = () => <LineDrawingExample design="jane" />
|
||||
export const JaneFrontExample = () => <LineDrawingExample design="jane" side="front" />
|
||||
export const LucyExample = () => <LineDrawingExample design="lucy" />
|
||||
export const LucyFrontExample = () => <LineDrawingExample design="lucy" side="front" />
|
||||
export const LuminaBackExample = () => <LineDrawingExample design="lumina" side="back" />
|
||||
export const LuminaExample = () => <LineDrawingExample design="lumina" />
|
||||
export const LuminaFrontExample = () => <LineDrawingExample design="lumina" side="front" />
|
||||
export const LumiraBackExample = () => <LineDrawingExample design="lumira" side="back" />
|
||||
export const LumiraExample = () => <LineDrawingExample design="lumira" />
|
||||
export const LumiraFrontExample = () => <LineDrawingExample design="lumira" side="front" />
|
||||
export const LunetiusExample = () => <LineDrawingExample design="lunetius" />
|
||||
export const LunetiusFrontExample = () => <LineDrawingExample design="lunetius" side="front" />
|
||||
export const NobleBackExample = () => <LineDrawingExample design="noble" side="back" />
|
||||
export const NobleExample = () => <LineDrawingExample design="noble" />
|
||||
export const NobleFrontExample = () => <LineDrawingExample design="noble" side="front" />
|
||||
export const SimonBackExample = () => <LineDrawingExample design="simon" side="back" />
|
||||
export const SimonExample = () => <LineDrawingExample design="simon" />
|
||||
export const SimonFrontExample = () => <LineDrawingExample design="simon" side="front" />
|
||||
export const TeaganBackExample = () => <LineDrawingExample design="teagan" side="back" />
|
||||
export const TeaganExample = () => <LineDrawingExample design="teagan" />
|
||||
export const TeaganFrontExample = () => <LineDrawingExample design="teagan" side="front" />
|
||||
export const TristanBackExample = () => <LineDrawingExample design="tristan" side="back" />
|
||||
export const TristanExample = () => <LineDrawingExample design="tristan" />
|
||||
export const TristanFrontExample = () => <LineDrawingExample design="tristan" side="front" />
|
||||
export const UmaBackExample = () => <LineDrawingExample design="uma" side="back" />
|
||||
export const UmaExample = () => <LineDrawingExample design="uma" />
|
||||
export const UmaFrontExample = () => <LineDrawingExample design="uma" side="front" />
|
||||
export const UmbraBackExample = () => <LineDrawingExample design="umbra" side="back" />
|
||||
export const UmbraExample = () => <LineDrawingExample design="umbra" />
|
||||
export const UmbraFrontExample = () => <LineDrawingExample design="umbra" side="front" />
|
||||
export const WahidBackExample = () => <LineDrawingExample design="wahid" side="back" />
|
||||
export const WahidExample = () => <LineDrawingExample design="wahid" />
|
||||
export const WahidFrontExample = () => <LineDrawingExample design="wahid" side="front" />
|
||||
|
|
@ -2,6 +2,537 @@
|
|||
title: Linedrawing
|
||||
---
|
||||
|
||||
:::note
|
||||
This page is yet to be created
|
||||
import { DocusaurusDoc } from '@freesewing/react/components/Docusaurus'
|
||||
import { ComponentDocs } from '@site/src/components/component-docs.js'
|
||||
import * as jsdoc from '@site/prebuild/jsdoc/components.linedrawing.mjs'
|
||||
import {
|
||||
AaronExample,
|
||||
AlbertExample,
|
||||
BeeExample,
|
||||
BellaExample,
|
||||
BenjaminExample,
|
||||
BentExample,
|
||||
BibiExample,
|
||||
BobExample,
|
||||
BreannaExample,
|
||||
BrianExample,
|
||||
BruceExample,
|
||||
CarlitaExample,
|
||||
CarltonExample,
|
||||
CathrinExample,
|
||||
CharlieExample,
|
||||
CorneliusExample,
|
||||
DianaExample,
|
||||
FlorenceExample,
|
||||
FlorentExample,
|
||||
GozerExample,
|
||||
HiExample,
|
||||
HolmesExample,
|
||||
HortensiaExample,
|
||||
HueyExample,
|
||||
HugoExample,
|
||||
JaneExample,
|
||||
LucyExample,
|
||||
LuminaExample,
|
||||
LumiraExample,
|
||||
LunetiusExample,
|
||||
NobleExample,
|
||||
SimonExample,
|
||||
TeaganExample,
|
||||
TristanExample,
|
||||
UmaExample,
|
||||
UmbraExample,
|
||||
WahidExample,
|
||||
AaronFrontExample,
|
||||
AlbertFrontExample,
|
||||
BeeFrontExample,
|
||||
BellaFrontExample,
|
||||
BenjaminFrontExample,
|
||||
BentFrontExample,
|
||||
BibiFrontExample,
|
||||
BobFrontExample,
|
||||
BreannaFrontExample,
|
||||
BrianFrontExample,
|
||||
BruceFrontExample,
|
||||
CarlitaFrontExample,
|
||||
CarltonFrontExample,
|
||||
CathrinFrontExample,
|
||||
CharlieFrontExample,
|
||||
CorneliusFrontExample,
|
||||
DianaFrontExample,
|
||||
FlorenceFrontExample,
|
||||
FlorentFrontExample,
|
||||
GozerFrontExample,
|
||||
HiFrontExample,
|
||||
HolmesFrontExample,
|
||||
HortensiaFrontExample,
|
||||
HueyFrontExample,
|
||||
HugoFrontExample,
|
||||
JaneFrontExample,
|
||||
LucyFrontExample,
|
||||
LuminaFrontExample,
|
||||
LumiraFrontExample,
|
||||
LunetiusFrontExample,
|
||||
NobleFrontExample,
|
||||
SimonFrontExample,
|
||||
TeaganFrontExample,
|
||||
TristanFrontExample,
|
||||
UmaFrontExample,
|
||||
UmbraFrontExample,
|
||||
WahidFrontExample,
|
||||
AaronBackExample,
|
||||
BellaBackExample,
|
||||
BentBackExample,
|
||||
BibiBackExample,
|
||||
BobBackExample,
|
||||
BreannaBackExample,
|
||||
BrianBackExample,
|
||||
BruceBackExample,
|
||||
CarlitaBackExample,
|
||||
CarltonBackExample,
|
||||
CathrinBackExample,
|
||||
CharlieBackExample,
|
||||
CorneliusBackExample,
|
||||
DianaBackExample,
|
||||
GozerBackExample,
|
||||
HueyBackExample,
|
||||
HugoBackExample,
|
||||
JaneBackExample,
|
||||
LuminaBackExample,
|
||||
LumiraBackExample,
|
||||
NobleBackExample,
|
||||
SimonBackExample,
|
||||
TeaganBackExample,
|
||||
TristanBackExample,
|
||||
UmaBackExample,
|
||||
UmbraBackExample,
|
||||
WahidBackExample,
|
||||
} from './_examples.js'
|
||||
|
||||
<DocusaurusDoc>
|
||||
|
||||
:::tip
|
||||
This component family also exports the following helper objects:
|
||||
|
||||
- `lineDrawings`: An object where the key is the design name and the value the full LineDrawing component
|
||||
- `lineDrawingsBack`: An object where the key is the design name and the value the back LineDrawing component
|
||||
- `lineDrawingsFront`: An object where the key is the design name and the value the front LineDrawing component
|
||||
:::
|
||||
|
||||
:::warning
|
||||
All FreeSewing designs SHOULD have the full and front line drawing component.
|
||||
The back component is optional.
|
||||
|
||||
If there is no specific front component, the front component MUST be exported as a copy of the full component.
|
||||
:::
|
||||
|
||||
The __LineDrawing__ component family provides the following components:
|
||||
|
||||
- [AaronBack](#aaronback)
|
||||
- [AaronFront](#aaronfront)
|
||||
- [Aaron](#aaron)
|
||||
- [AlbertFront](#albertfront)
|
||||
- [Albert](#albert)
|
||||
- [BeeFront](#beefront)
|
||||
- [Bee](#bee)
|
||||
- [BellaBack](#bellaback)
|
||||
- [BellaFront](#bellafront)
|
||||
- [Bella](#bella)
|
||||
- [BenjaminFront](#benjaminfront)
|
||||
- [Benjamin](#benjamin)
|
||||
- [BentBack](#bentback)
|
||||
- [BentFront](#bentfront)
|
||||
- [Bent](#bent)
|
||||
- [BibiBack](#bibiback)
|
||||
- [BibiFront](#bibifront)
|
||||
- [Bibi](#bibi)
|
||||
- [BobBack](#bobback)
|
||||
- [BobFront](#bobfront)
|
||||
- [Bob](#bob)
|
||||
- [BreannaBack](#breannaback)
|
||||
- [BreannaFront](#breannafront)
|
||||
- [Breanna](#breanna)
|
||||
- [BrianBack](#brianback)
|
||||
- [BrianFront](#brianfront)
|
||||
- [Brian](#brian)
|
||||
- [BruceBack](#bruceback)
|
||||
- [BruceFront](#brucefront)
|
||||
- [Bruce](#bruce)
|
||||
- [CarlitaBack](#carlitaback)
|
||||
- [CarlitaFront](#carlitafront)
|
||||
- [Carlita](#carlita)
|
||||
- [CarltonBack](#carltonback)
|
||||
- [CarltonFront](#carltonfront)
|
||||
- [Carlton](#carlton)
|
||||
- [CathrinBack](#cathrinback)
|
||||
- [CathrinFront](#cathrinfront)
|
||||
- [Cathrin](#cathrin)
|
||||
- [CharlieBack](#charlieback)
|
||||
- [CharlieFront](#charliefront)
|
||||
- [Charlie](#charlie)
|
||||
- [CorneliusBack](#corneliusback)
|
||||
- [CorneliusFront](#corneliusfront)
|
||||
- [Cornelius](#cornelius)
|
||||
- [DianaBack](#dianaback)
|
||||
- [DianaFront](#dianafront)
|
||||
- [Diana](#diana)
|
||||
- [FlorenceFront](#florencefront)
|
||||
- [Florence](#florence)
|
||||
- [FlorentFront](#florentfront)
|
||||
- [Florent](#florent)
|
||||
- [GozerBack](#gozerback)
|
||||
- [GozerFront](#gozerfront)
|
||||
- [Gozer](#gozer)
|
||||
- [HiFront](#hifront)
|
||||
- [Hi](#hi)
|
||||
- [HolmesFront](#holmesfront)
|
||||
- [Holmes](#holmes)
|
||||
- [HortensiaFront](#hortensiafront)
|
||||
- [Hortensia](#hortensia)
|
||||
- [HueyBack](#hueyback)
|
||||
- [HueyFront](#hueyfront)
|
||||
- [Huey](#huey)
|
||||
- [HugoBack](#hugoback)
|
||||
- [HugoFront](#hugofront)
|
||||
- [Hugo](#hugo)
|
||||
- [JaneBack](#janeback)
|
||||
- [JaneFront](#janefront)
|
||||
- [Jane](#jane)
|
||||
- [LucyFront](#lucyfront)
|
||||
- [Lucy](#lucy)
|
||||
- [LuminaBack](#luminaback)
|
||||
- [LuminaFront](#luminafront)
|
||||
- [Lumina](#lumina)
|
||||
- [LumiraBack](#lumiraback)
|
||||
- [LumiraFront](#lumirafront)
|
||||
- [Lumira](#lumira)
|
||||
- [LunetiusFront](#lunetiusfront)
|
||||
- [Lunetius](#lunetius)
|
||||
- [NobleBack](#nobleback)
|
||||
- [NobleFront](#noblefront)
|
||||
- [Noble](#noble)
|
||||
- [SimonBack](#simonback)
|
||||
- [SimonFront](#simonfront)
|
||||
- [Simon](#simon)
|
||||
- [TeaganBack](#teaganback)
|
||||
- [TeaganFront](#teaganfront)
|
||||
- [Teagan](#teagan)
|
||||
- [TristanBack](#tristanback)
|
||||
- [TristanFront](#tristanfront)
|
||||
- [Tristan](#tristan)
|
||||
- [UmaBack](#umaback)
|
||||
- [UmaFront](#umafront)
|
||||
- [Uma](#uma)
|
||||
- [UmbraBack](#umbraback)
|
||||
- [UmbraFront](#umbrafront)
|
||||
- [Umbra](#umbra)
|
||||
- [WahidBack](#wahidback)
|
||||
- [WahidFront](#wahidfront)
|
||||
- [Wahid](#wahid)
|
||||
|
||||
|
||||
|
||||
## Aaron
|
||||
<ComponentDocs docs={jsdoc.jsdocAaron} example={AaronExample} />
|
||||
|
||||
## AaronBack
|
||||
<ComponentDocs docs={jsdoc.jsdocAaronBack} example={AaronBackExample} />
|
||||
|
||||
## AaronFront
|
||||
<ComponentDocs docs={jsdoc.jsdocAaronFront} example={AaronFrontExample} />
|
||||
|
||||
## Albert
|
||||
<ComponentDocs docs={jsdoc.jsdocAlbert} example={AlbertExample} />
|
||||
|
||||
## AlbertFront
|
||||
<ComponentDocs docs={jsdoc.jsdocAlbertFront} example={AlbertFrontExample} />
|
||||
|
||||
## Bee
|
||||
<ComponentDocs docs={jsdoc.jsdocBee} example={BeeExample} />
|
||||
|
||||
## BeeFront
|
||||
<ComponentDocs docs={jsdoc.jsdocBeeFront} example={BeeFrontExample} />
|
||||
|
||||
## Bella
|
||||
<ComponentDocs docs={jsdoc.jsdocBella} example={BellaExample} />
|
||||
|
||||
## BellaBack
|
||||
<ComponentDocs docs={jsdoc.jsdocBellaBack} example={BellaBackExample} />
|
||||
|
||||
## BellaFront
|
||||
<ComponentDocs docs={jsdoc.jsdocBellaFront} example={BellaFrontExample} />
|
||||
|
||||
## Benjamin
|
||||
<ComponentDocs docs={jsdoc.jsdocBenjamin} example={BenjaminExample} />
|
||||
|
||||
## BenjaminFront
|
||||
<ComponentDocs docs={jsdoc.jsdocBenjaminFront} example={BenjaminFrontExample} />
|
||||
|
||||
## Bent
|
||||
<ComponentDocs docs={jsdoc.jsdocBent} example={BentExample} />
|
||||
|
||||
## BentBack
|
||||
<ComponentDocs docs={jsdoc.jsdocBentBack} example={BentBackExample} />
|
||||
|
||||
## BentFront
|
||||
<ComponentDocs docs={jsdoc.jsdocBentFront} example={BentFrontExample} />
|
||||
|
||||
## Bibi
|
||||
<ComponentDocs docs={jsdoc.jsdocBibi} example={BibiExample} />
|
||||
|
||||
## BibiBack
|
||||
<ComponentDocs docs={jsdoc.jsdocBibiBack} example={BibiBackExample} />
|
||||
|
||||
## BibiFront
|
||||
<ComponentDocs docs={jsdoc.jsdocBibiFront} example={BibiFrontExample} />
|
||||
|
||||
## Bob
|
||||
<ComponentDocs docs={jsdoc.jsdocBob} example={BobExample} />
|
||||
|
||||
## BobBack
|
||||
<ComponentDocs docs={jsdoc.jsdocBobBack} example={BobBackExample} />
|
||||
|
||||
## BobFront
|
||||
<ComponentDocs docs={jsdoc.jsdocBobFront} example={BobFrontExample} />
|
||||
|
||||
## Breanna
|
||||
<ComponentDocs docs={jsdoc.jsdocBreanna} example={BreannaExample} />
|
||||
|
||||
## BreannaBack
|
||||
<ComponentDocs docs={jsdoc.jsdocBreannaBack} example={BreannaBackExample} />
|
||||
|
||||
## BreannaFront
|
||||
<ComponentDocs docs={jsdoc.jsdocBreannaFront} example={BreannaFrontExample} />
|
||||
|
||||
## Brian
|
||||
<ComponentDocs docs={jsdoc.jsdocBrian} example={BrianExample} />
|
||||
|
||||
## BrianBack
|
||||
<ComponentDocs docs={jsdoc.jsdocBrianBack} example={BrianBackExample} />
|
||||
|
||||
## BrianFront
|
||||
<ComponentDocs docs={jsdoc.jsdocBrianFront} example={BrianFrontExample} />
|
||||
|
||||
## Bruce
|
||||
<ComponentDocs docs={jsdoc.jsdocBruce} example={BruceExample} />
|
||||
|
||||
## BruceBack
|
||||
<ComponentDocs docs={jsdoc.jsdocBruceBack} example={BruceBackExample} />
|
||||
|
||||
## BruceFront
|
||||
<ComponentDocs docs={jsdoc.jsdocBruceFront} example={BruceFrontExample} />
|
||||
|
||||
## Carlita
|
||||
<ComponentDocs docs={jsdoc.jsdocCarlita} example={CarlitaExample} />
|
||||
|
||||
## CarlitaBack
|
||||
<ComponentDocs docs={jsdoc.jsdocCarlitaBack} example={CarlitaBackExample} />
|
||||
|
||||
## CarlitaFront
|
||||
<ComponentDocs docs={jsdoc.jsdocCarlitaFront} example={CarlitaFrontExample} />
|
||||
|
||||
## Carlton
|
||||
<ComponentDocs docs={jsdoc.jsdocCarlton} example={CarltonExample} />
|
||||
|
||||
## CarltonBack
|
||||
<ComponentDocs docs={jsdoc.jsdocCarltonBack} example={CarltonBackExample} />
|
||||
|
||||
## CarltonFront
|
||||
<ComponentDocs docs={jsdoc.jsdocCarltonFront} example={CarltonFrontExample} />
|
||||
|
||||
## Cathrin
|
||||
<ComponentDocs docs={jsdoc.jsdocCathrin} example={CathrinExample} />
|
||||
|
||||
## CathrinBack
|
||||
<ComponentDocs docs={jsdoc.jsdocCathrinBack} example={CathrinBackExample} />
|
||||
|
||||
## CathrinFront
|
||||
<ComponentDocs docs={jsdoc.jsdocCathrinFront} example={CathrinFrontExample} />
|
||||
|
||||
## Charlie
|
||||
<ComponentDocs docs={jsdoc.jsdocCharlie} example={CharlieExample} />
|
||||
|
||||
## CharlieBack
|
||||
<ComponentDocs docs={jsdoc.jsdocCharlieBack} example={CharlieBackExample} />
|
||||
|
||||
## CharlieFront
|
||||
<ComponentDocs docs={jsdoc.jsdocCharlieFront} example={CharlieFrontExample} />
|
||||
|
||||
## Cornelius
|
||||
<ComponentDocs docs={jsdoc.jsdocCornelius} example={CorneliusExample} />
|
||||
|
||||
## CorneliusBack
|
||||
<ComponentDocs docs={jsdoc.jsdocCorneliusBack} example={CorneliusBackExample} />
|
||||
|
||||
## CorneliusFront
|
||||
<ComponentDocs docs={jsdoc.jsdocCorneliusFront} example={CorneliusFrontExample} />
|
||||
|
||||
## Diana
|
||||
<ComponentDocs docs={jsdoc.jsdocDiana} example={DianaExample} />
|
||||
|
||||
## DianaBack
|
||||
<ComponentDocs docs={jsdoc.jsdocDianaBack} example={DianaBackExample} />
|
||||
|
||||
## DianaFront
|
||||
<ComponentDocs docs={jsdoc.jsdocDianaFront} example={DianaFrontExample} />
|
||||
|
||||
## Florence
|
||||
<ComponentDocs docs={jsdoc.jsdocFlorence} example={FlorenceExample} />
|
||||
|
||||
## FlorenceFront
|
||||
<ComponentDocs docs={jsdoc.jsdocFlorenceFront} example={FlorenceFrontExample} />
|
||||
|
||||
## Florent
|
||||
<ComponentDocs docs={jsdoc.jsdocFlorent} example={FlorentExample} />
|
||||
|
||||
## FlorentFront
|
||||
<ComponentDocs docs={jsdoc.jsdocFlorentFront} example={FlorentFrontExample} />
|
||||
|
||||
## Gozer
|
||||
<ComponentDocs docs={jsdoc.jsdocGozer} example={GozerExample} />
|
||||
|
||||
## GozerBack
|
||||
<ComponentDocs docs={jsdoc.jsdocGozerBack} example={GozerBackExample} />
|
||||
|
||||
## GozerFront
|
||||
<ComponentDocs docs={jsdoc.jsdocGozerFront} example={GozerFrontExample} />
|
||||
|
||||
## Hi
|
||||
<ComponentDocs docs={jsdoc.jsdocHi} example={HiExample} />
|
||||
|
||||
## HiFront
|
||||
<ComponentDocs docs={jsdoc.jsdocHiFront} example={HiFrontExample} />
|
||||
|
||||
## Holmes
|
||||
<ComponentDocs docs={jsdoc.jsdocHolmes} example={HolmesExample} />
|
||||
|
||||
## HolmesFront
|
||||
<ComponentDocs docs={jsdoc.jsdocHolmesFront} example={HolmesFrontExample} />
|
||||
|
||||
## Hortensia
|
||||
<ComponentDocs docs={jsdoc.jsdocHortensia} example={HortensiaExample} />
|
||||
|
||||
## HortensiaFront
|
||||
<ComponentDocs docs={jsdoc.jsdocHortensiaFront} example={HortensiaFrontExample} />
|
||||
|
||||
## Huey
|
||||
<ComponentDocs docs={jsdoc.jsdocHuey} example={HueyExample} />
|
||||
|
||||
## HueyBack
|
||||
<ComponentDocs docs={jsdoc.jsdocHueyBack} example={HueyBackExample} />
|
||||
|
||||
## HueyFront
|
||||
<ComponentDocs docs={jsdoc.jsdocHueyFront} example={HueyFrontExample} />
|
||||
|
||||
## Hugo
|
||||
<ComponentDocs docs={jsdoc.jsdocHugo} example={HugoExample} />
|
||||
|
||||
## HugoBack
|
||||
<ComponentDocs docs={jsdoc.jsdocHugoBack} example={HugoBackExample} />
|
||||
|
||||
## HugoFront
|
||||
<ComponentDocs docs={jsdoc.jsdocHugoFront} example={HugoFrontExample} />
|
||||
|
||||
## Jane
|
||||
<ComponentDocs docs={jsdoc.jsdocJane} example={JaneExample} />
|
||||
|
||||
## JaneBack
|
||||
<ComponentDocs docs={jsdoc.jsdocJaneBack} example={JaneBackExample} />
|
||||
|
||||
## JaneFront
|
||||
<ComponentDocs docs={jsdoc.jsdocJaneFront} example={JaneFrontExample} />
|
||||
|
||||
## Lucy
|
||||
<ComponentDocs docs={jsdoc.jsdocLucy} example={LucyExample} />
|
||||
|
||||
## LucyFront
|
||||
<ComponentDocs docs={jsdoc.jsdocLucyFront} example={LucyFrontExample} />
|
||||
|
||||
## Lumina
|
||||
<ComponentDocs docs={jsdoc.jsdocLumina} example={LuminaExample} />
|
||||
|
||||
## LuminaBack
|
||||
<ComponentDocs docs={jsdoc.jsdocLuminaBack} example={LuminaBackExample} />
|
||||
|
||||
## LuminaFront
|
||||
<ComponentDocs docs={jsdoc.jsdocLuminaFront} example={LuminaFrontExample} />
|
||||
|
||||
## Lumira
|
||||
<ComponentDocs docs={jsdoc.jsdocLumira} example={LumiraExample} />
|
||||
|
||||
## LumiraBack
|
||||
<ComponentDocs docs={jsdoc.jsdocLumiraBack} example={LumiraBackExample} />
|
||||
|
||||
## LumiraFront
|
||||
<ComponentDocs docs={jsdoc.jsdocLumiraFront} example={LumiraFrontExample} />
|
||||
|
||||
## Lunetius
|
||||
<ComponentDocs docs={jsdoc.jsdocLunetius} example={LunetiusExample} />
|
||||
|
||||
## LunetiusFront
|
||||
<ComponentDocs docs={jsdoc.jsdocLunetiusFront} example={LunetiusFrontExample} />
|
||||
|
||||
## Noble
|
||||
<ComponentDocs docs={jsdoc.jsdocNoble} example={NobleExample} />
|
||||
|
||||
## NobleBack
|
||||
<ComponentDocs docs={jsdoc.jsdocNobleBack} example={NobleBackExample} />
|
||||
|
||||
## NobleFront
|
||||
<ComponentDocs docs={jsdoc.jsdocNobleFront} example={NobleFrontExample} />
|
||||
|
||||
## Simon
|
||||
<ComponentDocs docs={jsdoc.jsdocSimon} example={SimonExample} />
|
||||
|
||||
## SimonBack
|
||||
<ComponentDocs docs={jsdoc.jsdocSimonBack} example={SimonBackExample} />
|
||||
|
||||
## SimonFront
|
||||
<ComponentDocs docs={jsdoc.jsdocSimonFront} example={SimonFrontExample} />
|
||||
|
||||
## Teagan
|
||||
<ComponentDocs docs={jsdoc.jsdocTeagan} example={TeaganExample} />
|
||||
|
||||
## TeaganBack
|
||||
<ComponentDocs docs={jsdoc.jsdocTeaganBack} example={TeaganBackExample} />
|
||||
|
||||
## TeaganFront
|
||||
<ComponentDocs docs={jsdoc.jsdocTeaganFront} example={TeaganFrontExample} />
|
||||
|
||||
## Tristan
|
||||
<ComponentDocs docs={jsdoc.jsdocTristan} example={TristanExample} />
|
||||
|
||||
## TristanBack
|
||||
<ComponentDocs docs={jsdoc.jsdocTristanBack} example={TristanBackExample} />
|
||||
|
||||
## TristanFront
|
||||
<ComponentDocs docs={jsdoc.jsdocTristanFront} example={TristanFrontExample} />
|
||||
|
||||
## Uma
|
||||
<ComponentDocs docs={jsdoc.jsdocUma} example={UmaExample} />
|
||||
|
||||
## UmaBack
|
||||
<ComponentDocs docs={jsdoc.jsdocUmaBack} example={UmaBackExample} />
|
||||
|
||||
## UmaFront
|
||||
<ComponentDocs docs={jsdoc.jsdocUmaFront} example={UmaFrontExample} />
|
||||
|
||||
## Umbra
|
||||
<ComponentDocs docs={jsdoc.jsdocUmbra} example={UmbraExample} />
|
||||
|
||||
## UmbraBack
|
||||
<ComponentDocs docs={jsdoc.jsdocUmbraBack} example={UmbraBackExample} />
|
||||
|
||||
## UmbraFront
|
||||
<ComponentDocs docs={jsdoc.jsdocUmbraFront} example={UmbraFrontExample} />
|
||||
|
||||
## Wahid
|
||||
<ComponentDocs docs={jsdoc.jsdocWahid} example={WahidExample} />
|
||||
|
||||
## WahidBack
|
||||
<ComponentDocs docs={jsdoc.jsdocWahidBack} example={WahidBackExample} />
|
||||
|
||||
## WahidFront
|
||||
<ComponentDocs docs={jsdoc.jsdocWahidFront} example={WahidFrontExample} />
|
||||
|
||||
</DocusaurusDoc>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue