chore: Port FreeSewing.dev to docusaurus
The replaces the NextJS site powering FreeSewing.dev with a Docusaurus setup. It's part of my efforts to simplify FreeSewing's setup so we can focus on our core value proposition.
This commit is contained in:
parent
497633d1d3
commit
ab3204f9f1
692 changed files with 11037 additions and 20674 deletions
102
sites/dev/docs/reference/packages/models/readme.mdx
Normal file
102
sites/dev/docs/reference/packages/models/readme.mdx
Normal file
|
@ -0,0 +1,102 @@
|
|||
---
|
||||
title: models
|
||||
---
|
||||
|
||||
Published as [@freesewing/models][1], this package provides body
|
||||
measurements data for a range of size models used by the FreeSewing project.
|
||||
|
||||
## Models
|
||||
|
||||
Models have names like `cisFemaleAdult34`, `cisMaleDoll30`,
|
||||
and `cisFemaleGiant150`.
|
||||
|
||||
These names are constructed according to the 3 aspects that make up the model:
|
||||
1. Gender: `cisFemale` or `cisMale`
|
||||
2. Group: `Adult`, `Doll`, or `Giant`
|
||||
3. Size: a number
|
||||
- For Adult models, the size number is the neck circumference in millimeters, Example: `34` for 34 mm.
|
||||
- For Doll and Giant models, the size number is a whole number which is the percentage to scale a base model. Examples: '30' for a 30% size reduction for a doll, and '150' for a 150% size increase for a giant.
|
||||
|
||||
## Available models
|
||||
|
||||
Available models are:
|
||||
- cisFemaleAdult sizes 28, 30, 32, 34, 36, 38, 40, 42, 44, 46
|
||||
- cisMaleAdult sizes 32, 34, 36, 38, 40, 42, 44, 46, 48, 50
|
||||
- cisFemaleDoll sizes 10, 20, 30, 40, 50, 60
|
||||
- cisMaleDoll sizes 10, 20, 30, 40, 50, 60
|
||||
- cisFemaleGiant sizes 150, 200, 250, 300
|
||||
- cisMaleGiant sizes 150, 200, 250, 300
|
||||
|
||||
## Exports
|
||||
|
||||
models: Objects with key-value pairs, with measurement name keys and measurement value (in mm) values.
|
||||
|
||||
`measurements`: Array of measurement name strings.
|
||||
See [Measurements](/reference/measurements) for a list of measurement names.
|
||||
|
||||
`group` Array of the model group name strings (`adult`, `doll`, `giant`).
|
||||
|
||||
`sizes` Object with key-value pairs, with genderGroup keys and values that are Arrays of size numbers available for each genderGroup.
|
||||
|
||||
genderGroups: Each genderGroup is an object of key-value pairs, with size keys and model values.
|
||||
Available genderGroups: `cisFemaleAdult`, `cisMaleAdult`, `cisFemaleDoll`, `cisMaleDoll`, `cisFemaleGiant`, `cisMaleGiant`.
|
||||
|
||||
groups: Each group is an object of key-value pairs, with gender keys and genderGroup values.
|
||||
Available groups: `adult`, `doll`, `giant`.
|
||||
|
||||
## Installation
|
||||
|
||||
```sh
|
||||
npm install @freesewing/models
|
||||
```
|
||||
|
||||
## Example
|
||||
|
||||
In NodeJS:
|
||||
```js
|
||||
import { cisMaleAdult38 } from @freesewing/models
|
||||
|
||||
```
|
||||
|
||||
which will give you an object with measurement: value pairs.
|
||||
The example above gives you:
|
||||
|
||||
```js
|
||||
{
|
||||
ankle: 235,
|
||||
biceps: 350,
|
||||
bustFront: 560,
|
||||
bustPointToUnderbust: 60,
|
||||
bustSpan: 190,
|
||||
chesT: 1000,
|
||||
crossSeam: 870
|
||||
crossSeamFront: 410,
|
||||
crotchDepth: 340,
|
||||
heel, 360,
|
||||
head: 590,
|
||||
...
|
||||
}
|
||||
```
|
||||
|
||||
## Units
|
||||
|
||||
All measurements are in mm.
|
||||
|
||||
|
||||
## Notes
|
||||
|
||||
These model measurement values were arbitrarily chosen by FreeSewing.
|
||||
They do __not__ correspond to any existing statistical data or
|
||||
official size charts.
|
||||
You should not expect that these models will produce garments that fit
|
||||
the same as clothing store sizes.
|
||||
|
||||
To create our models, measurement values for a base cisFemale
|
||||
and cisMale model were first chosen.
|
||||
Then, for all other models their measurement values were generated from
|
||||
the base values using a mathematical formula which scales and adjusts
|
||||
the values.
|
||||
The mathematical formula is designed to produce approximate measurements
|
||||
which are realistic enough to be useful.
|
||||
|
||||
[1]: https://www.npmjs.com/package/@freesewing/models
|
29
sites/dev/docs/reference/packages/new-design/readme.mdx
Normal file
29
sites/dev/docs/reference/packages/new-design/readme.mdx
Normal file
|
@ -0,0 +1,29 @@
|
|||
---
|
||||
title: new-design
|
||||
---
|
||||
|
||||
Published as [@freesewing/new-design][1], this is an
|
||||
initializer package for a new FreeSewing design.
|
||||
|
||||
## Usage
|
||||
|
||||
```sh
|
||||
npx @freesewing/new-design
|
||||
```
|
||||
|
||||
## Notes
|
||||
|
||||
The package will run an interactive script and install a standalone
|
||||
development environment which can be used to develop and test a new
|
||||
FreeSewing design and to generate patterns from that design.
|
||||
|
||||
:::note RELATED
|
||||
|
||||
Please see our
|
||||
[Getting Started tutorial](/tutorials/getting-started-linux/dev-setup#stand-alone-development)
|
||||
for more information about how to set up and start the standalone
|
||||
development environment.
|
||||
|
||||
:::
|
||||
|
||||
[1]: https://www.npmjs.com/package/@freesewing/new-design
|
44
sites/dev/docs/reference/packages/prettier-config/readme.mdx
Normal file
44
sites/dev/docs/reference/packages/prettier-config/readme.mdx
Normal file
|
@ -0,0 +1,44 @@
|
|||
---
|
||||
title: prettier-config
|
||||
---
|
||||
|
||||
Published as [@freesewing/prettier-config][1], this package is
|
||||
FreeSewing's shared configuration for [Prettier](https://prettier.io/).
|
||||
|
||||
## Installation
|
||||
|
||||
```sh
|
||||
npm install @freesewing/prettier-config
|
||||
```
|
||||
|
||||
## Usage
|
||||
|
||||
Edit package.json:
|
||||
|
||||
```json
|
||||
{
|
||||
// ...
|
||||
"prettier": "@freesewing/prettier-config"
|
||||
}
|
||||
```
|
||||
|
||||
## Prettier options
|
||||
|
||||
The Prettier options configured by this package:
|
||||
|
||||
| Option | Value |
|
||||
|--------|-------|
|
||||
| semi | `false` |
|
||||
| singleQuote | `true` |
|
||||
| trailingComma | "es5" |
|
||||
| printWidth | 100 |
|
||||
|
||||
:::note RELATED
|
||||
|
||||
Please see the
|
||||
[Prettier options documentation](https://prettier.io/docs/en/options.html)
|
||||
for information about the effects of each option.
|
||||
|
||||
:::
|
||||
|
||||
[1]: https://www.npmjs.com/package/@freesewing/prettier-config
|
|
@ -0,0 +1,38 @@
|
|||
---
|
||||
title: react-components
|
||||
---
|
||||
|
||||
Published as [@freesewing/react-components][1], this package provides
|
||||
various React components to render FreeSewing patterns, as well as
|
||||
some utilities to facilitate frontend integration.
|
||||
|
||||
## Exports
|
||||
|
||||
FreeSewing uses named exports, and below is a list of all exports:
|
||||
|
||||
- `Pattern`: Renders a FreeSewing pattern
|
||||
- `Svg`: Renders the svg section of a FreeSewing pattern
|
||||
- `Defs`: Renders the defs of a FreeSewing pattern
|
||||
- `Group`: Renders an SVG group of a FreeSewing pattern
|
||||
- `Stack`: Renders a stack of a FreeSewing pattern
|
||||
- `Part`: Renders a part of a FreeSewing pattern
|
||||
- `Point`: Renders a point of a FreeSewing pattern
|
||||
- `Path`: Renders a path of a FreeSewing pattern
|
||||
- `Snippet`: Renders a snippet of a FreeSewing pattern
|
||||
- `Grid`: Renders the grid of a FreeSewing pattern
|
||||
- `Text`: Renders text of a FreeSewing pattern
|
||||
- `TextOnPath`: Renders text on path of a FreeSewing pattern
|
||||
- `PatternXray`: Renders the Xray/inspector variant of a FreeSewing pattern
|
||||
- `utils`: A plain object holding the following utilities:
|
||||
- `getProps`
|
||||
- `withinPartBounds`
|
||||
- `getId`
|
||||
- `translateStrings`
|
||||
|
||||
## Installation
|
||||
|
||||
```sh
|
||||
npm install @freesewing/react-components
|
||||
```
|
||||
|
||||
[1]: https://www.npmjs.com/package/@freesewing/react-components
|
11
sites/dev/docs/reference/packages/readme.mdx
Normal file
11
sites/dev/docs/reference/packages/readme.mdx
Normal file
|
@ -0,0 +1,11 @@
|
|||
---
|
||||
title: Packages
|
||||
---
|
||||
|
||||
Aside from the main `core` package that provides our pattern-generating
|
||||
library, FreeSewing provides other packages used to provide functionality
|
||||
for our designs, websites, and infrastructure.
|
||||
|
||||
## Packages we maintain
|
||||
|
||||
<ReadMore />
|
|
@ -0,0 +1,74 @@
|
|||
---
|
||||
title: rehype-highlight-lines
|
||||
---
|
||||
|
||||
Published as [@freesewing/rehype-highlight-lines][1], this package provides
|
||||
a [Rehype](https://github.com/rehypejs/rehype)
|
||||
plugin to format highlighted and struck-out lines in code blocks.
|
||||
|
||||
## Installation
|
||||
|
||||
```sh
|
||||
npm install @freesewing/rehype-highlight-lines
|
||||
```
|
||||
|
||||
## Usage
|
||||
|
||||
In NodeJS:
|
||||
```js
|
||||
import rehypeHighlightLines from @freesewing/rehype-highlight-lines
|
||||
|
||||
...
|
||||
rehypePlugins: [
|
||||
[
|
||||
rehypeHighlightLines,
|
||||
{
|
||||
highlightClass: ['highlight-lines', 'border-l-4'],
|
||||
strikeoutClass: [
|
||||
'strikeout-lines',
|
||||
'bg-orange-300',
|
||||
'bg-opacity-5',
|
||||
'border-l-4',
|
||||
'opacity-80',
|
||||
'line-through',
|
||||
'decoration-orange-500',
|
||||
],
|
||||
},
|
||||
],
|
||||
],
|
||||
```
|
||||
|
||||
### Example
|
||||
|
||||
```js
|
||||
// These 3 lines will be highlighted:
|
||||
// highlight-start
|
||||
const a = 1
|
||||
const b = 2
|
||||
const c = 3
|
||||
// highlight-end
|
||||
const d = 4
|
||||
// These 2 lines will be struck out:
|
||||
// strikeout-start
|
||||
const e = 5
|
||||
const f = 6
|
||||
// strikeout-end
|
||||
```
|
||||
|
||||
## Configuration
|
||||
|
||||
| Property | Type | Default | Description |
|
||||
|----------|------|---------|-------|
|
||||
| commentTag | String | 'span' | Tag that identifies a comment. |
|
||||
| commentClass | String | 'hljs-comment' | CSS class that identifies a comment.|
|
||||
| openingCommentHighlight | String | 'highlight-start' | Comment text to start formatting lines as highlighted. |
|
||||
| closingCommentHighlight | String | 'highlight-end' | Comment text to stop formatting lines as highlighted. |
|
||||
| openingCommentStrikeout | String | 'strikeout-start' | Comment text to start formatting lines as struck-out. |
|
||||
| closingCommentStrikeout | String | 'strikeout-end' | Comment text to stop formatting lines as struck-out. |
|
||||
| highlightTag | String | 'section' | Tag to apply to the block of highlighted or struck-out lines. |
|
||||
| highlightClass | Array|String | 'highlight-lines' | CSS classes to apply to highlighted lines. |
|
||||
| strikeoutClass | Array|String | 'strikeout-lines' | CSS classes to apply to struck-out lines. |
|
||||
| swallow | Boolean | `true` | Remove extra linebreaks before the start of highlighted/struck-out lines. |
|
||||
|
||||
|
||||
[1]: https://www.npmjs.com/package/@freesewing/rehype-highlight-lines
|
76
sites/dev/docs/reference/packages/rehype-jargon/readme.mdx
Normal file
76
sites/dev/docs/reference/packages/rehype-jargon/readme.mdx
Normal file
|
@ -0,0 +1,76 @@
|
|||
---
|
||||
title: rehype-jargon
|
||||
---
|
||||
|
||||
Published as [@freesewing/rehype-jargon][1], this package provides
|
||||
a [Rehype](https://github.com/rehypejs/rehype)
|
||||
plugin for adding HTML markup for jargon terms.
|
||||
It allows you to use jargon in your markdown/mdx/html content and use
|
||||
a centrally managed file of jargon terms and their definitions.
|
||||
|
||||
## Installation
|
||||
|
||||
```sh
|
||||
npm install @freesewing/rehype-jargon
|
||||
```
|
||||
|
||||
## Usage
|
||||
|
||||
In file `jargon.mjs`:
|
||||
```js
|
||||
export const jargon = {
|
||||
term: '<b>term</b> has this description',
|
||||
term2: 'A <i>differenti</i> description',
|
||||
}
|
||||
```
|
||||
|
||||
In NodeJS:
|
||||
```js
|
||||
import rehypeJargon from @freesewing/rehype-jargon
|
||||
import { jargon } from './jargon.mjs'
|
||||
|
||||
...
|
||||
rehypePlugins: [
|
||||
[rehypeJargon, { jargon: jargon }],
|
||||
],
|
||||
```
|
||||
|
||||
### Example
|
||||
|
||||
Here is an example of _jargon_ in markdown.
|
||||
|
||||
|
||||
## Configuration
|
||||
|
||||
| Property | Type | Default | Description |
|
||||
|----------|------|---------|-------|
|
||||
| jargon | Object | | Key/Value pairs where the key is a jargon term and the value is the jargon description. The description is a string that can contain HTML tags. Required. |
|
||||
| transform | Function | (see below) | Given the jargon term and description, returns a string with the final HTML to output. |
|
||||
|
||||
### Default transform function
|
||||
|
||||
The default `transform` function is:
|
||||
```js
|
||||
(term, html) =>
|
||||
`<span class="jargon-term">${term}<span class="jargon-info">${html}</span></span>`
|
||||
```
|
||||
|
||||
The default `transform` function applies these CSS classes:
|
||||
- `jargon-term` is applied to jargon terms
|
||||
- `jargon-info` is applied to jargon descriptions
|
||||
|
||||
You can style your jargon by adding styles to these CSS classes.
|
||||
|
||||
## Notes
|
||||
|
||||
- Markup will be added to jargon only if the terms are _emphasized_.
|
||||
|
||||
- Keys should be in all lowercase characters in the jargon file.
|
||||
This is because terms are converted to lowercase before they are matched
|
||||
against the jargon file.
|
||||
|
||||
- How terms are capitalized does not matter, for the same reason.
|
||||
|
||||
- If you use HTML in your jargon descriptions, use only inline elements such as adding bold/italic formatting and inserting links.
|
||||
|
||||
[1]: https://www.npmjs.com/package/@freesewing/rehype-jargon
|
61
sites/dev/docs/reference/packages/snapseries/readme.mdx
Normal file
61
sites/dev/docs/reference/packages/snapseries/readme.mdx
Normal file
|
@ -0,0 +1,61 @@
|
|||
---
|
||||
title: snapseries
|
||||
---
|
||||
|
||||
Published as [@freesewing/snapseries][1], this package provides series
|
||||
of common sizes for elastics and zippers and series of common intervals
|
||||
to be used with snapped percentage options.
|
||||
|
||||
## Exports
|
||||
|
||||
All exports are plain objects with `metric` and `imperial` properties
|
||||
that can be used as the `snap` property for snapped percentage options.
|
||||
|
||||
Some exports have `metric` and `imperial` properties that are
|
||||
arrays of numbers.
|
||||
These exports and their properties are:
|
||||
|
||||
- `elastics`: Arrays of common elastic widths
|
||||
- `zippers`: Arrays of common zipper lengths
|
||||
|
||||
Other exports have `metric` and `imperial` properties that are
|
||||
numbers to allow options to be _snapped_ to multiples of the value.
|
||||
These exports and properties are:
|
||||
|
||||
- `smallSteps`: Intervals of 1 mm or 1/32 inch
|
||||
- `steps`: Intervals of 5 mm or 1/8 inch
|
||||
- `bigSteps`: Intervals of 10 mm or 1/2 inch
|
||||
|
||||
## Installation
|
||||
|
||||
```sh
|
||||
npm install @freesewing/snapseries
|
||||
```
|
||||
|
||||
## Example
|
||||
|
||||
In NodeJS:
|
||||
```js
|
||||
import { elastics } from @freesewing/snapseries
|
||||
|
||||
myOption: {
|
||||
pct: 10,
|
||||
min: 5
|
||||
max: 35,
|
||||
snap: elasitcs,
|
||||
}
|
||||
```
|
||||
|
||||
## Units
|
||||
|
||||
All measurements are in mm.
|
||||
|
||||
:::note RELATED
|
||||
|
||||
Please see
|
||||
[Snapped percentage options](/reference/api/part/config/options/pct/snap)
|
||||
to learn more about how snapped percentage options are used.
|
||||
|
||||
:::
|
||||
|
||||
[1]: https://www.npmjs.com/package/@freesewing/snapseries
|
Loading…
Add table
Add a link
Reference in a new issue