VSinerva/freesewing
1
0
Fork 0
Code Activity

wip: Bunch of changes for v4

Browse source 
From the top of my head (but I'll write this up later):

- We keep the info about the designs in the design
- We use a new about.json file for this
- The auto-generated data.mjs file is no more
- Linedrawings we use in the design picker use the front
- Linedrawings should respect square aspect ration
- Migrated components to use the 'tw-' prefic for tailwind CSS classes
  to avoid conflicts with docusaurus styles
This commit is contained in:
joostdecock 2024-12-26 18:33:49 +01:00
parent 6b8eea2724
commit c8808695e5
255 changed files with 3038 additions and 2304 deletions
Download patch file Download diff file Expand all files Collapse all files

85
packages/react/components/LineDrawing/albert.mjs
View file

@ -1,56 +1,51 @@
import React from 'react'
import { LineDrawingWrapper, thin, dashed } from './shared.mjs'
const strokeScale = 0.6
export const Albert = ({
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 128 141" {...{ className, stroke }}>
<Front stroke={stroke} />
<Back 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 AlbertFront = ({
className = 'w-64', // CSS classes to apply
stroke = 1, // Stroke width to use
}) => {
// Normalize stroke across designs
stroke = stroke * strokeScale
const strokeScale = 0.5
return (
<LineDrawingWrapper viewBox="0 0 64 141" {...{ className, stroke }}>
<Front stroke={stroke} />
</LineDrawingWrapper>
)
}
/*
* React component for the back
/**
* A linedrawing component for Albert
*
* @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 AlbertBack = ({
className = 'w-64', // CSS classes to apply
stroke = 1, // Stroke width to use
}) => {
// Normalize stroke across designs
stroke = stroke * strokeScale
export const Albert = ({ className, stroke = 1 }) => (
<LineDrawingWrapper viewBox="-10 -2 146 146" {...{ className }}>
<Front stroke={stroke * strokeScale} />
<Back stroke={stroke * strokeScale} />
</LineDrawingWrapper>
)
return (
<LineDrawingWrapper viewBox="64 0 64 141" {...{ className, stroke }}>
<Back stroke={stroke} />
</LineDrawingWrapper>
)
}
/**
* A linedrawing component for the front of Albert
*
* @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 AlbertFront = ({ className, stroke = 1 }) => (
<LineDrawingWrapper viewBox="-41 -2 145 145" {...{ className }}>
<Front stroke={stroke * strokeScale} />
</LineDrawingWrapper>
)
/**
* A linedrawing component for the front of Albert
*
* @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 AlbertBack = ({ className, stroke = 1 }) => (
<LineDrawingWrapper viewBox="74 0 74 119" {...props}>
<Back stroke={stroke * strokeScale} />
</LineDrawingWrapper>
)
/*
* SVG elements for the front