wip: tweaks and custom components
This commit is contained in:
Joost De Cock
parent
17472fe7ec
commit
d397f2c3f4
12 changed files with 125 additions and 91 deletions
11
sites/orgdocs/docs/_controltip.mdx
Normal file
11
sites/orgdocs/docs/_controltip.mdx
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
:::tip User Experience
|
||||
|
||||
The **User Experience** setting of your FreeSewing account will impact how you
|
||||
experience the FreeSewing website.
|
||||
|
||||
By default, some of the more advanced features of this site are hidden to make
|
||||
it more easy for new users to find their way. If you want to sacrifice some of
|
||||
that simplicity to gain more power, you can update your User Experience setting
|
||||
accordingly.
|
||||
|
||||
:::
|
||||
|
|
@ -4,7 +4,6 @@ title: My reasoning behind FreeSewing's Revenue Pledge
|
|||
|
||||
:::note
|
||||
|
||||
|
||||
This is a personal note by Joost De Cock -- the FreeSewing maintainer -- about
|
||||
his motivations for [the FreeSewing revenue pledge](/docs/about/pledge/)
|
||||
|
||||
|
|
@ -17,10 +16,10 @@ I don't know if you're familiar with the phrase **noblesse oblige** but it essen
|
|||
I am privileged, and thus I have responsibilities.
|
||||
I am very fortunate to have been born in Western Europe, to have a good job, and a roof over my head.
|
||||
|
||||
Could I use the money? Yes I could.
|
||||
Could I use the money? Yes I could.
|
||||
Do I need the money? No I don't.
|
||||
|
||||
##### The value of your support
|
||||
## The value of your support
|
||||
|
||||
The main risk to FreeSewing is the same as any open source project out there: maintainer burnout.
|
||||
|
||||
|
|
@ -31,7 +30,7 @@ When you become a FreeSewing Patron, you give more than money.
|
|||
To me, the main value is the message you send to me and other people working on this.
|
||||
And that message is: **Hey, you're doing a worthwhile thing. Keep up the good work**.
|
||||
|
||||
##### The value of your money
|
||||
## The value of your money
|
||||
|
||||
It is not _just_ about the money. But that doesn't mean the money is not important.
|
||||
Much to the contrary.
|
||||
|
|
@ -45,7 +44,7 @@ It makes this project not only fun to do, but also socially responsible.
|
|||
And I need that to convince myself that yes, it's OK to spend all my time doing this,
|
||||
because FreeSewing is a force for good.
|
||||
|
||||
##### Charity is not sexy
|
||||
## Charity is not sexy
|
||||
|
||||
Here's the tricky part: People give less once they know the money goes to charity.
|
||||
I wish it wasn't the case, but it is.
|
||||
|
|
@ -58,7 +57,7 @@ Yes, everything is free, and the money doesn't actually go to paying the server
|
|||
But that doesn't mean that these contributions are not crucial to the well-being of the project,
|
||||
or at the very least its maintainer (that would be me).
|
||||
|
||||
##### Why MSF is my charity of choice
|
||||
## Why MSF is my charity of choice
|
||||
|
||||
There's a lot of misery in the world. As I watch the news, I often feel my faith in humanity slipping.
|
||||
Some of the most vulnerable people on this planet seem largely abandoned by rich countries and supra-national organisations.
|
||||
|
|
|
|||
|
|
@ -5,74 +5,78 @@ title: Curated measurements sets
|
|||
FreeSewing's **curated measurements sets** are a collection of
|
||||
measurements sets that represent real people.
|
||||
|
||||
These sets are used by designers to test their designs on a variety of bodies, as
|
||||
well as by FreeSewing users to test the platform.
|
||||
These sets are used by designers to test their designs on a variety of bodies,
|
||||
as well as by FreeSewing users to test the platform.
|
||||
|
||||
## History
|
||||
|
||||
FreeSewing is all about bespoke sewing patterns, so perpetuating the
|
||||
myth of *standard sizes* was never something we wanted to be part of.
|
||||
FreeSewing is all about bespoke sewing patterns, so perpetuating the
|
||||
myth of _standard sizes_ was never something we wanted to be part of.
|
||||
|
||||
In reality, having to take measurements prior to even being able to try the
|
||||
platform adds a lot of friction to the onboarding of new users. So at one
|
||||
point, we added a sizing table with a variety of measurements/sizes so
|
||||
people could see what generating a pattern looked like without having to
|
||||
start measuring themselves.
|
||||
start measuring themselves.
|
||||
|
||||
With the release of version 3 of FreeSewing, we wanted to move away from these
|
||||
*made up* measurements and instead work with the data of real people to test
|
||||
our platform.
|
||||
_made up_ measurements and instead work with the data of real people to test
|
||||
our platform.
|
||||
|
||||
We now no longer present users who want to try out the site a range of
|
||||
*standard sizes* but rather a collection of measurements sets where they can
|
||||
We now no longer present users who want to try out the site a range of
|
||||
_standard sizes_ but rather a collection of measurements sets where they can
|
||||
pick the one that best represents their own body.
|
||||
|
||||
## Suggesting a measurements set for curation
|
||||
|
||||
We rely on our community to submit measurements sets for curation.
|
||||
If you have a public measurements set on the site, you can suggest it for curation.
|
||||
We rely on our community to submit measurements sets for curation. If you have
|
||||
a public measurements set on the site, you can suggest it for curation.
|
||||
|
||||
To be part of our curated measurements sets collection, you should provide the following:
|
||||
|
||||
- **All measurements** of the person. We do not accept incomplete sets as that would mean some designs would not work with them.
|
||||
- **The height** of the person. This helps users select a measurements set closest to their own body.
|
||||
- **A picture** of the person to be featured [in our line-up of curated measurements sets](/curated-sets). See below for tips.
|
||||
To be part of our curated measurements sets collection, you should provide the
|
||||
following:
|
||||
|
||||
- **All measurements** of the person. We do not accept incomplete sets as that
|
||||
would mean some designs would not work with them.
|
||||
- **The height** of the person. This helps users select a measurements set
|
||||
closest to their own body.
|
||||
- **A picture** of the person to be featured [in our line-up of curated
|
||||
measurements sets](/curated-sets). See below for tips.
|
||||
|
||||
## Tips for line-up pictures
|
||||
|
||||
We present measurements sets in a line-up style, so the picture should be a
|
||||
full frontal picture where you are standing straight and relaxed with your arms
|
||||
beside your body.
|
||||
beside your body.
|
||||
|
||||
Below are some tips on how to get good results:
|
||||
|
||||
### Don't stand too close to the camera
|
||||
|
||||
For best results, ask a friend to take a picture from further away and zoom in.
|
||||
This helps avoid the *fisheye* effect that you get when taking a picture from up close.
|
||||
This helps avoid the _fisheye_ effect that you get when taking a picture from
|
||||
up close.
|
||||
|
||||
<div className="grid grid-cols-2 gap-2">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
The fist picture is taken from (too) close. There's nothing really wrong with
|
||||
this picture, but it looks weird. That's because this is taken with a mobile
|
||||
phone and the wide angle on these types of cameras gives you this subtle fish
|
||||
eye effect.
|
||||
|
||||
</div>
|
||||
|
||||
The picture on the left is taken from (too) close.
|
||||
There's nothing really wrong with this picture, but it looks weird.
|
||||
That's because this is taken with a mobile phone and the wide angle on these types of cameras gives you this subtle fish eye effect.
|
||||
|
||||
The picture on the right was take further away with zoom.
|
||||
This is a much better representation of reality and the pose looks natural because the fish eye effect is neutralized.
|
||||
The picture on the right was take further away with zoom. This is a much
|
||||
better representation of reality and the pose looks natural because the fish
|
||||
eye effect is neutralized.
|
||||
|
||||
#### Stand in front of a white background
|
||||
|
||||
We will edit out the background of your picture like this:
|
||||
|
||||
|
||||
|
||||
So you can make that step a lit easier for us if you can pose in front of a white or plain background.
|
||||
|
||||
|
||||
|
||||
So you can make that step a lit easier for us if you can pose in front of a
|
||||
white or plain background.
|
||||
|
|
|
|||
|
|
@ -1,17 +0,0 @@
|
|||
---
|
||||
title: Language
|
||||
---
|
||||
|
||||
This controls the language that will be used to translate text on your pattern.
|
||||
|
||||
FreeSewing currently supports the following languages:
|
||||
|
||||
- English
|
||||
- Spanish
|
||||
- French
|
||||
- German
|
||||
- Dutch
|
||||
- Ukrainian
|
||||
|
||||
You can pick any of these and your pattern will be translated in this language.
|
||||
|
||||
|
|
@ -2,6 +2,8 @@
|
|||
title: Core Settings
|
||||
---
|
||||
|
||||
import ControlTip from '@site/docs/_controltip.mdx'
|
||||
|
||||
The **Core Settings** menu allows you to tweak various aspects of the
|
||||
FreeSewing Core library, which -- under the hood -- generates your pattern for
|
||||
you.
|
||||
|
|
@ -14,4 +16,3 @@ what design you are generating a pattern for.
|
|||
<ReadMore />
|
||||
|
||||
<ControlTip />
|
||||
|
||||
|
|
|
|||
|
|
@ -2,6 +2,8 @@
|
|||
title: How to generate bespoke sewing patterns
|
||||
---
|
||||
|
||||
import ControlTip from '@site/docs/_controltip.mdx'
|
||||
|
||||
Generating custom sewing patterns based on your measurements is the flagship feature of our website.
|
||||
We provide an online environment that allows you to customize various aspects of your pattern.
|
||||
|
||||
|
|
@ -9,7 +11,7 @@ This environment provides a wide range of features, and on these pages we will e
|
|||
|
||||
<ControlTip />
|
||||
|
||||
## The editor
|
||||
## The editor
|
||||
|
||||
Below is a screenshot of FreeSewing's pattern editor in **kiosk mode** which hides the site header and footer and lets the editor take up the entire screen. It also has the **View menu** (on the left) expanded. By default you will only see the icons, and not the text of the menu on the left.
|
||||
|
||||
|
|
@ -56,4 +58,6 @@ This allows you to quickly verify the specific role of a setting or option witho
|
|||
|
||||
## Editor modes
|
||||
|
||||
<Fixme>Complete these docs</Fixme>
|
||||
:::note FIXME
|
||||
Complete these docs
|
||||
:::
|
||||
|
|
|
|||
|
|
@ -2,10 +2,11 @@
|
|||
title: UI Settings
|
||||
---
|
||||
|
||||
import ControlTip from '@site/docs/_controltip.mdx'
|
||||
|
||||
The **UI Settings** menu allows you to tweak certain aspects of the user interface (UI).
|
||||
Those aspects are:
|
||||
|
||||
<ReadMore />
|
||||
|
||||
<ControlTip />
|
||||
|
||||
|
|
|
|||
|
|
@ -10,11 +10,13 @@ FreeSewing does not store the pattern itself, instead we store your settings you
|
|||
- Any core settings you changes
|
||||
- The measurements used
|
||||
|
||||
With this, we can regenerate the pattern. So this is all we store.
|
||||
With this, we can regenerate the pattern. So this is all we store.
|
||||
|
||||
This also means that if a pattern goes through significant changes, or a new major version with breaking changes is released, we may no longer be able to generate the (old) pattern. For this reason, you should download the pattern as PDF or SVG and save it locally if you want to archive it.
|
||||
|
||||
<Tldr compact> Backup your patterns if you intent to keep them for a long time</Tldr>
|
||||
:::tip
|
||||
Backup your patterns if you intent to keep them for a long time
|
||||
:::
|
||||
|
||||
In addition to the settings required to recreate the pattern, patterns are stored with the following fields:
|
||||
|
||||
|
|
|
|||
|
|
@ -5,20 +5,23 @@ title: Using the FreeSewing.org website
|
|||
On these pages, we'll paint a high-level picture of how to get the most out of the FreeSewing.org website.
|
||||
Most people will be most interested in [How to generate bespoke sewing patterns](/docs/about/site/draft/).
|
||||
|
||||
:::tip Where can I download the patterns?
|
||||
|
||||
<Comment by="joost">
|
||||
It can be frustrating for visitors who come here expecting a website where they
|
||||
can download sewing patterns that they can't seem to find the sewing patterns
|
||||
to download. Almost like hiding the _download button_ is some elaborate scheme
|
||||
to waste their time.
|
||||
|
||||
##### Where can I download the patterns?
|
||||
|
||||
It can be frustrating for visitors who come here expecting a website where they can download sewing patterns that they can't seem to find the sewing patterns to download. Almost like hiding the *download button* is some elaborate scheme to waste their time.
|
||||
|
||||
I don't really know how to fix this because I cannot control people's expectations.
|
||||
FreeSewing.org is _very_ different from a website with some links to PDF sewing patterns.
|
||||
So if that's what you're expecting, we almost have to de-train you before we can talk about what this site offers.
|
||||
I don't really know how to fix this because I cannot control people's
|
||||
expectations. FreeSewing.org is _very_ different from a website with some
|
||||
links to PDF sewing patterns. So if that's what you're expecting, we almost
|
||||
have to de-train you before we can talk about what this site offers.
|
||||
|
||||
So I'm not going to do that. I'm going to assume you are reading with an open mind.
|
||||
|
||||
</Comment>
|
||||
joost
|
||||
|
||||
:::
|
||||
|
||||
## Finding your way
|
||||
|
||||
|
|
@ -35,7 +38,7 @@ On every page of FreeSewing.org is the same header with links to the most import
|
|||
In addition, the header also has buttons to change the **Theme** (or color scheme) and **Language** of the website.
|
||||
|
||||
On mobile, the header is at the bottom of the page and because of space constraints not all of these links are shown.
|
||||
However, click the *hamburger icon* to open the menu that contains all of these links.
|
||||
However, click the _hamburger icon_ to open the menu that contains all of these links.
|
||||
|
||||
## Signing up or Signing in
|
||||
|
||||
|
|
@ -48,7 +51,7 @@ Some functionality requires a FreeSewing account. So I will assume you have an a
|
|||
|
||||
## Important account settings
|
||||
|
||||
When your signed in, you can navigate to [/account](/account/) to manage the data stored in your account, which includes various settings.
|
||||
When your signed in, you can navigate to [/account](/account/) to manage the data stored in your account, which includes various settings.
|
||||
|
||||
I'd like to highlight a couple of them that are worth your attention:
|
||||
|
||||
|
|
@ -61,11 +64,11 @@ Dial this setting down if you want a simpler experience. Turn it up if you want
|
|||
|
||||
### Two-Factor Authentication
|
||||
|
||||
Please enable [Two-Factor Authentication](/account/mfa/) to secure your FreeSewing account.
|
||||
Please enable [Two-Factor Authentication](/account/mfa/) to secure your FreeSewing account.
|
||||
|
||||
## Make it your own
|
||||
|
||||
Now that you have a FreeSewing account, there's more you can do on FreeSewing.org.
|
||||
Now that you have a FreeSewing account, there's more you can do on FreeSewing.org.
|
||||
Click through to learn more about the following features:
|
||||
|
||||
- [Account](/docs/about/site/account)
|
||||
|
|
@ -75,8 +78,6 @@ Click through to learn more about the following features:
|
|||
- [Bookmarks](/docs/about/site/bookmarks)
|
||||
- [API Keys](/docs/about/site/apikeys)
|
||||
|
||||
|
||||
## Generating sewing patterns
|
||||
|
||||
With that out of the way, let's move on to [How to generate bespoke sewing patterns](/docs/about/site/draft/).
|
||||
|
||||
|
|
|
|||
|
|
@ -331,6 +331,8 @@ svg.freesewing.pattern circle.stroke-xl {
|
|||
stroke-width: calc(var(--pattern-stroke-xl) * var(--pattern-scale));
|
||||
}
|
||||
|
||||
svg.freesewing.pattern path.stroke-xxl,
|
||||
svg.freesewing.pattern circle.stroke-xxl,
|
||||
svg.freesewing.pattern path.stroke-2xl,
|
||||
svg.freesewing.pattern circle.stroke-2xl {
|
||||
stroke-width: calc(var(--pattern-stroke-2xl) * var(--pattern-scale));
|
||||
|
|
|
|||
|
|
@ -1,21 +1,22 @@
|
|||
// Ejected Docusaurus components
|
||||
import React from 'react';
|
||||
import Head from '@docusaurus/Head';
|
||||
import MDXCode from '@theme/MDXComponents/Code';
|
||||
import MDXA from '@theme/MDXComponents/A';
|
||||
import MDXPre from '@theme/MDXComponents/Pre';
|
||||
import MDXDetails from '@theme/MDXComponents/Details';
|
||||
import MDXHeading from '@theme/MDXComponents/Heading';
|
||||
import MDXUl from '@theme/MDXComponents/Ul';
|
||||
import MDXLi from '@theme/MDXComponents/Li';
|
||||
import MDXImg from '@theme/MDXComponents/Img';
|
||||
import Admonition from '@theme/Admonition';
|
||||
import Mermaid from '@theme/Mermaid';
|
||||
import React from 'react'
|
||||
import Head from '@docusaurus/Head'
|
||||
import MDXCode from '@theme/MDXComponents/Code'
|
||||
import MDXA from '@theme/MDXComponents/A'
|
||||
import MDXPre from '@theme/MDXComponents/Pre'
|
||||
import MDXDetails from '@theme/MDXComponents/Details'
|
||||
import MDXHeading from '@theme/MDXComponents/Heading'
|
||||
import MDXUl from '@theme/MDXComponents/Ul'
|
||||
import MDXLi from '@theme/MDXComponents/Li'
|
||||
import MDXImg from '@theme/MDXComponents/Img'
|
||||
import Admonition from '@theme/Admonition'
|
||||
import Mermaid from '@theme/Mermaid'
|
||||
// Other Docusaurus components
|
||||
import Tabs from '@theme/Tabs';
|
||||
import TabItem from '@theme/TabItem';
|
||||
import Tabs from '@theme/Tabs'
|
||||
import TabItem from '@theme/TabItem'
|
||||
// Custom FreeSewing components
|
||||
import { Example } from './example.mjs'
|
||||
import { Legend } from './legend.mjs'
|
||||
import { ReadMore } from './readmore.js'
|
||||
|
||||
const MDXComponents = {
|
||||
|
|
@ -41,6 +42,7 @@ const MDXComponents = {
|
|||
TabItem,
|
||||
// Custom FreeSewing components
|
||||
Example,
|
||||
Legend,
|
||||
ReadMore,
|
||||
}
|
||||
|
||||
|
|
|
|||
24
sites/orgdocs/src/theme/MDXComponents/legend.mjs
Normal file
24
sites/orgdocs/src/theme/MDXComponents/legend.mjs
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
import React from 'react'
|
||||
import { Legend as LegendDesign } from '@freesewing/legend'
|
||||
import { Pattern } from '@freesewing/react-components/pattern'
|
||||
|
||||
export const Legend = ({ part = '' }) => {
|
||||
const settings = {
|
||||
only: [`legend.${part}`],
|
||||
measurements: {
|
||||
head: 370,
|
||||
},
|
||||
}
|
||||
const pattern = new LegendDesign(settings).draft()
|
||||
|
||||
const patternProps = {
|
||||
renderProps: pattern.getRenderProps(),
|
||||
logs: pattern.getLogs(),
|
||||
}
|
||||
|
||||
return (
|
||||
<figure className="shadow p-2">
|
||||
<Pattern {...patternProps} />
|
||||
</figure>
|
||||
)
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue