44e04a4cef
Also fixes #251 Reviewed-on: https://codeberg.org/freesewing/freesewing/pulls/263 Co-authored-by: joostdecock <joost@joost.at> Co-committed-by: joostdecock <joost@joost.at>
100 lines
9 KiB
JavaScript
100 lines
9 KiB
JavaScript
import React from 'react'
|
|
import { LineDrawingWrapper, thin, dashed } from './shared.mjs'
|
|
|
|
/*
|
|
* This strokeScale factor is used to normalize the stroke across
|
|
* designs so we have a consistent look when showing our collection
|
|
*/
|
|
const strokeScale = 0.5
|
|
|
|
/**
|
|
* A linedrawing component for Bruce
|
|
*
|
|
* @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 Bruce = ({ className, stroke = 1 }) => (
|
|
<LineDrawingWrapper viewBox="-27 0 155 155" {...{ className, stroke }}>
|
|
<Front stroke={strokeScale * stroke} />
|
|
<g transform="translate(-100.5, 76)">
|
|
<Back stroke={strokeScale * stroke} />
|
|
</g>
|
|
</LineDrawingWrapper>
|
|
)
|
|
|
|
/**
|
|
* A linedrawing component for the front of Bruce
|
|
*
|
|
* @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 BruceFront = ({ className, stroke = 1 }) => (
|
|
<LineDrawingWrapper viewBox="0 -10 101 101" {...{ className }}>
|
|
<Front stroke={strokeScale * stroke} />
|
|
</LineDrawingWrapper>
|
|
)
|
|
|
|
/*
|
|
* React component for the back
|
|
*/
|
|
export const BruceBack = ({
|
|
className = 'tw:w-full', // CSS classes to apply
|
|
stroke = 1, // Stroke width to use
|
|
}) => {
|
|
// Normalize stroke across designs
|
|
stroke = stroke * strokeScale
|
|
|
|
return (
|
|
<LineDrawingWrapper viewBox="101 0 101 78" {...{ className, stroke }}>
|
|
<Back stroke={stroke} />
|
|
</LineDrawingWrapper>
|
|
)
|
|
}
|
|
|
|
/*
|
|
* SVG elements for the front
|
|
*/
|
|
export const Front = ({ stroke }) => (
|
|
<>
|
|
<path
|
|
key="stitches"
|
|
{...dashed(stroke)}
|
|
{...thin(stroke)}
|
|
d="m 58.695139,70.692687 c 8.628062,-3.307291 21.476229,-6.974416 37.26127,-7.056437 1.169459,-0.0053 2.320396,0.0079 3.450167,0.03969 m -40.584437,8.244414 c 8.628062,-3.307292 21.476229,-6.974417 37.26127,-7.056437 1.169459,-0.0053 2.320396,0.0079 3.450167,0.03969 M 85.841343,10.706355 H 51.244426 50.979843 16.385573 M 85.841343,9.4390006 H 51.244426 50.979843 16.385573 M 43.531868,70.692687 C 34.903806,67.385396 22.055636,63.718271 6.2705959,63.63625 c -1.16946,-0.0053 -2.32039,0.0079 -3.45016,0.03969 M 43.404868,71.920354 C 34.776806,68.613062 21.928636,64.945937 6.1435959,64.863917 c -1.16946,-0.0053 -2.32039,0.0079 -3.45016,0.03969"
|
|
/>
|
|
<path
|
|
key="seams"
|
|
{...thin(stroke)}
|
|
d="M 51.112206,59.5247 V 12.315022 m 15.566736,11.307707 c -0.195792,0.433917 -0.832116,1.537813 -1.14697,2.318334 -0.404812,1.000125 -1.317625,3.341688 -2.38125,7.408333 -0.619125,2.370667 -0.978958,4.135438 -1.322917,5.820833 -0.664104,3.264959 -1.124479,6.122459 -1.322916,7.408334 -0.431271,2.78077 -0.425979,3.214687 -0.79375,5.027083 -0.381,1.867958 -0.669396,3.288771 -1.322917,5.027083 -0.478896,1.275292 -1.096908,2.84136 -2.462158,4.815151 m 8.812158,-49.000567 c 1.156229,6.52198 2.301875,13.04925 3.439583,19.579166 2.151063,12.345459 4.796896,26.013833 6.879167,38.364583 M 35.517161,23.693373 c 0.195792,0.433917 0.860374,1.467169 1.175228,2.24769 0.404813,1.000125 1.317625,3.341688 2.38125,7.408333 0.619125,2.370667 0.978958,4.135438 1.322917,5.820833 0.664104,3.264959 1.124479,6.122459 1.322916,7.408334 0.431271,2.78077 0.42598,3.214687 0.79375,5.027083 0.381,1.867958 0.669396,3.288771 1.322917,5.027083 0.478896,1.275292 1.125166,2.84136 2.490416,4.815151 M 37.486139,12.447313 c -1.156229,6.52198 -2.301875,13.04925 -3.439583,19.579166 -2.151063,12.345459 -4.796896,26.013833 -6.879167,38.364583 m 34.517541,4.228042 c -0.66675,-2.368021 -1.54252,-5.275792 -2.500312,-7.929562 -0.230187,-0.635 -0.85725,-2.44475 -2.38125,-4.233334 -0.743479,-0.873125 -1.524,-1.785937 -2.910417,-2.38125 -1.055687,-0.452437 -2.021416,-0.529166 -2.645833,-0.529166 h -0.264583 c -0.624417,0 -1.590146,0.07673 -2.645834,0.529166 -1.386416,0.595313 -2.166937,1.508125 -2.910416,2.38125 -1.524,1.788584 -2.151063,3.598334 -2.38125,4.233334 -0.957792,2.65377 -1.833563,5.561541 -2.500313,7.929562"
|
|
/>
|
|
<path
|
|
key="outline"
|
|
d="m 100.19239,68.274396 c -1.07421,-0.01587 -2.159002,-0.01587 -3.251731,0 -13.446125,0.203729 -25.918583,2.905125 -37.26127,7.056437 M 86.169426,12.18273 h -34.925 -0.264583 -34.925 M 51.405868,2.2608555 h 33.572979 l 1.190625,9.9218745 c 0.357187,1.050396 0.709083,2.108729 1.058333,3.175 0,0 2.431521,7.440083 4.7625,16.139583 1.775354,6.627812 4.892146,19.647958 8.202085,36.777083 l -1.322918,0.79375 c -0.497417,0.20902 -1.222375,0.497416 -2.116667,0.79375 -1.987021,0.658812 -10.00125,2.344208 -15.345833,3.175 -9.136062,1.418166 -19.039417,2.182812 -21.695833,2.38125 -0.568854,-2.084917 -1.121833,-3.868209 -1.5875,-5.291667 0,0 -0.375708,-1.145646 -2.116667,-5.027083 C 55.829701,64.702521 55.469868,63.922 54.684056,63.247312 54.128431,62.768417 53.588681,62.540875 53.361139,62.453562 52.45891,62.109604 51.662514,62.141354 51.244472,62.188979 h -0.264583 c -0.418042,-0.04762 -1.214438,-0.07937 -2.116667,0.264583 -0.227541,0.08731 -0.767291,0.314855 -1.322916,0.79375 -0.785813,0.674688 -1.145646,1.455209 -1.322917,1.852084 -1.740958,3.881437 -2.116667,5.027083 -2.116667,5.027083 -0.465666,1.423458 -1.018645,3.20675 -1.5875,5.291667 -2.656416,-0.198438 -12.55977,-0.963084 -21.695836,-2.38125 -5.34458,-0.830792 -13.3588101,-2.516188 -15.3458301,-3.175 -0.89429,-0.296334 -1.61925,-0.58473 -2.11667,-0.79375 l -1.32291,-0.79375 c 3.30993,-17.129125 6.42673,-30.149271 8.2020801,-36.777083 2.33098,-8.6995 4.7625,-16.139583 4.7625,-16.139583 0.34925,-1.066271 0.70115,-2.124604 1.05833,-3.175 l 1.19063,-9.9218745 H 50.821139 Z M 2.0319759,68.274396 c 1.07421,-0.01587 2.159,-0.01587 3.25173,0 13.4461201,0.203729 25.9185791,2.905125 37.2612661,7.056437"
|
|
/>
|
|
</>
|
|
)
|
|
|
|
/*
|
|
* SVG elements for the back
|
|
*/
|
|
const Back = ({ stroke }) => (
|
|
<>
|
|
<path
|
|
key="outline"
|
|
d="m 102.30903,68.274396 c 1.07421,-0.01587 2.159,-0.01587 3.25173,0 13.44613,0.203729 25.91858,2.905125 37.26127,7.056437 M 116.3319,12.18273 h 34.925 0.26458 34.925 M 151.0982,2.2608555 h -33.57563 l -1.19062,9.9218745 c -0.35719,1.050396 -0.70909,2.108729 -1.05834,3.175 0,0 -2.43152,7.440083 -4.7625,16.139583 -1.77535,6.627812 -4.89214,19.647958 -8.20208,36.777083 l 1.32292,0.79375 c 0.49741,0.20902 1.22237,0.497416 2.11666,0.79375 1.98703,0.658812 10.00125,2.344208 15.34584,3.175 9.13606,1.418166 19.03941,2.182812 21.69583,2.38125 0.56885,-2.084917 1.12183,-3.868209 1.5875,-5.291667 0,0 0.37571,-1.145646 2.11667,-5.027083 0.17727,-0.396875 0.5371,-1.177396 1.32291,-1.852084 0.55563,-0.478895 1.09538,-0.706437 1.32292,-0.79375 0.90223,-0.343958 1.69863,-0.312208 2.11667,-0.264583 h 0.26458 c 0.41804,-0.04762 1.21444,-0.07937 2.11667,0.264583 0.22754,0.08731 0.76729,0.314855 1.32291,0.79375 0.78582,0.674688 1.14565,1.455209 1.32292,1.852084 1.74096,3.881437 2.11667,5.027083 2.11667,5.027083 0.46566,1.423458 1.01864,3.20675 1.5875,5.291667 2.65641,-0.198438 12.55977,-0.963084 21.69583,-2.38125 5.34458,-0.830792 13.35881,-2.516188 15.34583,-3.175 0.89429,-0.296334 1.61925,-0.58473 2.11667,-0.79375 l 1.32292,-0.79375 c -3.30994,-17.129125 -6.42673,-30.149271 -8.20209,-36.777083 -2.33098,-8.6995 -4.7625,-16.139583 -4.7625,-16.139583 -0.34925,-1.066271 -0.70114,-2.124604 -1.05833,-3.175 l -1.19062,-9.9218745 h -33.57298 z m 49.37125,66.0135405 c -1.07421,-0.01587 -2.159,-0.01587 -3.25173,0 -13.44613,0.203729 -25.91859,2.905125 -37.26127,7.056437"
|
|
/>
|
|
<path
|
|
key="seams"
|
|
{...thin(stroke)}
|
|
d="m 179.0382,12.447313 c 1.11125,6.328834 2.21456,12.662959 3.30729,18.997083 2.06639,11.977687 4.61169,25.24125 6.61458,37.226875 m -48.14094,5.947833 c 0.66675,-2.368021 1.54253,-5.275792 2.50032,-7.929562 0.23018,-0.635 0.85725,-2.44475 2.38125,-4.233334 0.74348,-0.873125 1.524,-1.785937 2.91041,-2.38125 1.05569,-0.452437 2.02142,-0.529166 2.64584,-0.529166 h 0.26458 c 0.62442,0 1.59015,0.07673 2.64583,0.529166 1.38642,0.595313 2.16694,1.508125 2.91042,2.38125 1.524,1.788584 2.15106,3.598334 2.38125,4.233334 0.95779,2.65377 1.83356,5.561541 2.50031,7.929562 M 123.74028,12.447313 c -1.11125,6.328834 -2.21456,12.662959 -3.30729,18.997083 -2.0664,11.977687 -4.61169,25.24125 -6.61458,37.226875"
|
|
/>
|
|
<path
|
|
key="stitches"
|
|
{...dashed(stroke)}
|
|
{...thin(stroke)}
|
|
d="m 177.58299,12.050438 c 1.11125,6.402917 2.21456,12.811125 3.30994,19.221979 2.06904,12.117916 4.61433,25.540229 6.61723,37.663437 M 125.19549,12.050438 c -1.11125,6.402917 -2.21456,12.811125 -3.30994,19.221979 -2.06904,12.117916 -4.61433,25.540229 -6.61723,37.663437 m 28.54061,1.756833 c -8.62807,-3.307291 -21.47623,-6.974416 -37.26127,-7.056437 -1.16946,-0.0053 -2.3204,0.0079 -3.45017,0.03969 m 40.58444,8.244414 c -8.62807,-3.307292 -21.47623,-6.974417 -37.26127,-7.056437 -1.16946,-0.0053 -2.3204,0.0079 -3.45017,0.03969 m 56.00171,5.78908 c 8.62806,-3.307291 21.47623,-6.974416 37.26127,-7.056437 1.16946,-0.0053 2.32039,0.0079 3.45016,0.03969 m -40.58443,8.244414 c 8.62806,-3.307292 21.47623,-6.974417 37.26127,-7.056437 1.16946,-0.0053 2.32039,0.0079 3.45016,0.03969 M 116.66242,10.706355 h 34.59427 0.26458 34.59692 M 116.66242,9.4390006 h 34.59427 0.26458 34.59692"
|
|
/>
|
|
</>
|
|
)
|