wip: More work on line drawings
This commit is contained in:
parent
c8808695e5
commit
9f2da8b926
15 changed files with 263 additions and 275 deletions
|
@ -1,38 +1,27 @@
|
|||
import React from 'react'
|
||||
import { LineDrawingWrapper, thin, dashed } from './shared.mjs'
|
||||
|
||||
const strokeScale = 0.6
|
||||
|
||||
export const Lunetius = ({
|
||||
className = 'w-64', // CSS classes to apply
|
||||
stroke = 1, // Stroke width to use
|
||||
}) => {
|
||||
// Normalize stroke across designs
|
||||
stroke = stroke * strokeScale
|
||||
|
||||
return (
|
||||
<LineDrawingWrapper viewBox="0 0 152 294" {...{ className, stroke }}>
|
||||
<Front stroke={stroke} />
|
||||
</LineDrawingWrapper>
|
||||
)
|
||||
}
|
||||
|
||||
/*
|
||||
* React component for the front
|
||||
* This strokeScale factor is used to normalize the stroke across
|
||||
* designs so we have a consistent look when showing our collection
|
||||
*/
|
||||
export const LunetiusFront = ({
|
||||
className = 'w-64', // CSS classes to apply
|
||||
stroke = 1, // Stroke width to use
|
||||
}) => {
|
||||
// Normalize stroke across designs
|
||||
stroke = stroke * strokeScale
|
||||
const strokeScale = 1.2
|
||||
|
||||
return (
|
||||
<LineDrawingWrapper viewBox="0 0 152 294" {...{ className, stroke }}>
|
||||
<Front stroke={stroke} />
|
||||
</LineDrawingWrapper>
|
||||
)
|
||||
}
|
||||
/**
|
||||
* A linedrawing component for Lunetius
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @param {string} props.className - Any CSS classes to apply
|
||||
* @param {number} props.stroke - The stroke width to apply
|
||||
*/
|
||||
export const Lunetius = ({ className, stroke = 1 }) => (
|
||||
<LineDrawingWrapper viewBox="-60 0 294 294" {...{ className }}>
|
||||
<Front stroke={stroke * strokeScale} />
|
||||
</LineDrawingWrapper>
|
||||
)
|
||||
|
||||
// Front is the same
|
||||
export const LunetiusFront = Lunetius
|
||||
|
||||
/*
|
||||
* SVG elements for the front
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue