VSinerva/freesewing
1
0
Fork 0
Code Activity

wip(org): Changes to footer and icons

Browse source
This commit is contained in:
Joost De Cock 2022-06-09 13:35:06 +02:00
parent c6eb841528
commit 6e8e4da0db
13 changed files with 106 additions and 185 deletions
Download patch file Download diff file Expand all files Collapse all files

179
packages/freesewing.org/components/footer.js
View file

@ -7,6 +7,14 @@ import PageLink from 'shared/components/page-link'
import DocsLink from 'shared/components/docs-link' import DocsLink from 'shared/components/docs-link'
import PinkedRibbon from 'shared/components/pinked-ribbon.js' import PinkedRibbon from 'shared/components/pinked-ribbon.js'
import Worm from 'shared/components/worm.js' import Worm from 'shared/components/worm.js'
import Link from 'next/link'
import DiscordIcon from 'shared/components/icons/discord.js'
import FacebookIcon from 'shared/components/icons/facebook.js'
import GithubIcon from 'shared/components/icons/github.js'
import InstagramIcon from 'shared/components/icons/instagram.js'
import RedditIcon from 'shared/components/icons/reddit.js'
import TwitterIcon from 'shared/components/icons/twitter.js'
// Classes // Classes
const link = "text-secondary font-bold hover:pointer hover:underline px-1" const link = "text-secondary font-bold hover:pointer hover:underline px-1"
@ -121,123 +129,98 @@ const translations = {
}, },
} }
const icon = { className: "w-20 h-20" }
const social = { const social = {
Discord: 'https://discord.freesewing.org/', Discord: [ <DiscordIcon {...icon}/>, 'https://discord.freesewing.org/' ],
Instagram: 'https://instagram.com/freesewing_org', Instagram: [ <InstagramIcon {...icon}/>, 'https://instagram.com/freesewing_org' ],
Facebook: 'https://www.facebook.com/groups/627769821272714/', Facebook: [ <FacebookIcon {...icon}/>, 'https://www.facebook.com/groups/627769821272714/' ],
Github: 'https://github.com/freesewing', Github: [ <GithubIcon {...icon} />, 'https://github.com/freesewing' ],
Reddit: 'https://www.reddit.com/r/freesewing/', Reddit: [ <RedditIcon {...icon} />, 'https://www.reddit.com/r/freesewing/' ],
Twitter: 'https://twitter.com/freesewing_org', Twitter: [ <TwitterIcon {...icon} />, 'https://twitter.com/freesewing_org' ],
} }
const Footer = ({ app }) => { const Footer = ({ app, full=false }) => {
const { t } = useTranslation(['common', 'patrons']) const { t } = useTranslation(['common', 'patrons'])
return ( return (
<footer className="bg-neutral"> <footer className="bg-neutral">
<PinkedRibbon loading={app.loading} theme={app.theme} /> <PinkedRibbon loading={app.loading} theme={app.theme} />
<div className="p-4 py-16 flex flex-row bg-neutral -mt-1 z-0 gap-8 flex-wrap justify-around text-neutral-content"> <div className="px-8 py-20 2xl:py-40 flex flex-row gap-8 flex-wrap 2xl:flex-nowrap justify-around text-neutral-content">
<div className="w-64 mt-2">
<div className="px-4 mb-4"><CreativeCommonsLogo /></div> {/* First col - CC & MIT */}
<div className="flex flex-row gap-2 justify-center items-center"> <div className="max-w-md mb-20 order-1 mt-20 2xl:mt-0">
<div className="basis-1/4"> <div className="max-w-md m-auto">
<CcByLogo /> <div><CreativeCommonsLogo className="w-80 m-auto"/></div>
<div className="flex flex-row gap-2 justify-center items-center mt-8">
<CcByLogo className="w-16"/>
<p className="text-neutral-content text-right basis-3/4">
{translations.cc[app.locale]}
</p>
</div> </div>
<p className="text-sm text-neutral-content text-right basis-3/4"> <div className="flex flex-row gap-2 justify-center items-center mt-4">
{translations.cc[app.locale]} <OsiLogo className="w-16"/>
</p> <p className="text-neutral-content text-right basis-3/4">
</div> {translations.mit[app.locale]}
<div className="flex flex-row gap-2 justify-center items-center"> </p>
<div className="basis-1/4">
<OsiLogo />
</div> </div>
<p className="text-sm text-neutral-content text-right basis-3/4">
{translations.mit[app.locale]}
</p>
</div> </div>
</div> </div>
<div className="w-full sm:w-auto"> {/* Second col - Social & Sponsors */}
<h5 className="text-neutral-content">FIXME</h5> <div className="w-full 2xl:w-fit -order-2 2xl:order-2">
<div className="theme-gradient h-1 mb-4"></div> {/* Social icons */}
<ul> <div className="w-full sm:w-auto flex flex-row flex-wrap gap-8 items-center justify-center">
<li> {Object.keys(social).map(item => (
Footer content goes here <Link key={item} href={social[item][1]}>
</li> <a className="hover:text-secondary-focus hover:-mt-2 transition-all" title={item}>
<li> {social[item][0]}
<DocsLink slug="docs/guide/what" /> </a>
</li> </Link>
</ul> ))}
</div> </div>
{/* Sponsors */}
<div className="w-full sm:w-auto sm:max-w-xs"> <div className="border rounded-xl p-8 border-dashed border-base-100/25 mt-20">
<h5 className="text-neutral-content">FIXME</h5> <p className="text-center text-neutral-content">
<div className="theme-gradient h-1 mb-2"></div> {translations.sponsors[app.locale]}
<ul>
<li>
Footer content goes here
</li>
<li>
<DocsLink slug="docs/guide/what" />
</li>
</ul>
<p className="text-sm text-neutral-content">
<a className={link} href={social.discord}>Our Discord server</a> is
the best place to ask questions and get help. It&apos;s where our community hangs out
so you&apos;ll get the fastest response and might even make a few new friends along the way.
</p>
<p className="text-sm text-neutral-content">
You can also <a href={social.twitter} className={link} >reach out on Twitter</a> or <a
href="https://github.com/freesewing/freesewing/issues/new/choose"
className={link}
> create an issue on Github </a> if Discord is not your jam.
</p>
</div>
<div className="w-full sm:w-auto">
<h5 className="text-neutral-content">Social Media</h5>
<div className="theme-gradient h-1 mb-4"></div>
<ul>
{Object.keys(social).map(item => <li key={item}><PageLink href={social[item]} txt={item}/></li>)}
</ul>
</div>
<div className="text-center">
<Logo fill='currentColor' stroke='none' size={164} className="m-auto"/>
<h5 className="text-neutral-content">FreeSewing</h5>
<p className="bold text-neutral-content text-sm">
{t('sloganCome')}
<br /> <br />
{t('sloganStay')} </p>
<div className="p-4 flex flex-row gap-4 xl:gap-8 flex-wrap justify-center items-center text-neutral-content shrink">
<a title="Search powered by Algolia" href="https://www.algolia.com/">
<img src="/brands/algolia.svg" className="w-64" alt="Search powered by Algolia"/>
</a>
<a title="Error handling by Bugsnag" href="https://www.bugsnag.com/">
<img src="/brands/bugsnag.svg" className="h-32" alt="Error handling by bugsnag" />
</a>
<a title="Translation powered by Crowdin" href="https://www.crowdin.com/">
<img src="/brands/crowdin.svg" className="w-64" alt="Translation powered by Crowdin" />
</a>
<a title="Builds & hosting by Vercel" href="https://www.vercel.com/?utm_source=freesewing&utm_campaign=oss">
<img src="/brands/vercel.svg" className="w-64 shadow-lg shadow-white/20" alt="Builds & Hosting by Vercel" />
</a>
</div>
</div>
<p className="text-center text-neutral-content mt-4 border rounded-xl p-8 border-dashed border-base-100/25">
{translations.msf[app.locale]}
<br />
[ <DocsLink slug="docs/various/pledge" /> ]
</p> </p>
</div> </div>
</div>
<p className="text-center text-neutral-content text-sm px-2"> {/* Col 3 - Logo & Slogan */}
{translations.sponsors[app.locale]} <div className="w-full 4xl:w-auto xl:max-w-md mb-20 text-center order-3 mt-20 2xl:mt-0">
<br /> <div className="max-w-md m-auto">
</p> <Logo stroke="none" size={164} className="w-40 lg:w-64 m-auto m-auto" />
<div className="p-4 py-16 flex flex-row bg-neutral -mt-2 z-0 gap-8 flex-wrap justify-center items-center text-neutral-content"> <h5 className="text-neutral-content lg:text-3xl mt-4">FreeSewing</h5>
<a title="Search powered by Algolia" href="https://www.algolia.com/"> <p className="bold text-neutral-content text-normal lg:text-xl">
<img src="/brands/algolia.svg" className="w-64 mx-12 sm:mx-4" alt="Search powered by Algolia"/> {t('sloganCome')}
</a> <br />
<a title="Error handling by Bugsnag" href="https://www.bugsnag.com/"> {t('sloganStay')}
<img src="/brands/bugsnag.svg" className="h-32 mx-12 sm:mx-4" alt="Error handling by bugsnag" /> </p>
</a> </div>
<a title="Translation powered by Crowdin" href="https://www.crowdin.com/"> </div>
<img src="/brands/crowdin.svg" className="w-64 mx-12 sm:mx-4" alt="Translation powered by Crowdin" />
</a>
<a title="Builds & hosting by Vercel" href="https://www.vercel.com/?utm_source=freesewing&utm_campaign=oss">
<img src="/brands/vercel.svg" className="w-64 mx-12 sm:mx-4" alt="Builds & Hosting by Vercel" />
</a>
</div>
<p className="text-center text-neutral-content text-sm px-2 my-20"> </div>
{translations.msf[app.locale]}
<br />
[ <DocsLink slug="docs/various/pledge" /> ]
</p>
</footer> </footer>
) )
} }

4
packages/freesewing.org/components/header.js
View file

@ -1,5 +1,5 @@
import { useState, useEffect } from 'react' import { useState, useEffect } from 'react'
import Logo from 'shared/components/logos/freesewing.js' import FreeSewingIcon from 'shared/components/icons/freesewing.js'
import Link from 'next/link' import Link from 'next/link'
import ThemePicker from 'shared/components/theme-picker.js' import ThemePicker from 'shared/components/theme-picker.js'
import LocalePicker from 'shared/components/locale-picker.js' import LocalePicker from 'shared/components/locale-picker.js'
@ -106,7 +106,7 @@ const Header = ({ app, setSearch }) => {
<div className="hidden md:flex md:flex-row gap-2"> <div className="hidden md:flex md:flex-row gap-2">
<Link href="/"> <Link href="/">
<a className="flex flex-column items-center"> <a className="flex flex-column items-center">
<Logo size={36} fill="currentColor" stroke={false} /> <FreeSewingIcon className="h-10 w-10"/>
</a> </a>
</Link> </Link>
<Link href="/"> <Link href="/">

4
packages/freesewing.shared/components/icons/discord.js
View file

@ -1,5 +1,5 @@
const Discord = () => ( const Discord = ({ className="h-6 w-6" }) => (
<svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <svg xmlns="http://www.w3.org/2000/svg" className={className} fill="currentColor" viewBox="0 0 24 24" stroke="none">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M20.222 0c1.406 0 2.54 1.137 2.607 2.475V24l-2.677-2.273-1.47-1.338-1.604-1.398.67 2.205H3.71c-1.402 0-2.54-1.065-2.54-2.476V2.48C1.17 1.142 2.31.003 3.715.003h16.5L20.222 0zm-6.118 5.683h-.03l-.202.2c2.073.6 3.076 1.537 3.076 1.537-1.336-.668-2.54-1.002-3.744-1.137-.87-.135-1.74-.064-2.475 0h-.2c-.47 0-1.47.2-2.81.735-.467.203-.735.336-.735.336s1.002-1.002 3.21-1.537l-.135-.135s-1.672-.064-3.477 1.27c0 0-1.805 3.144-1.805 7.02 0 0 1 1.74 3.743 1.806 0 0 .4-.533.805-1.002-1.54-.468-2.14-1.404-2.14-1.404s.134.066.335.2h.06c.03 0 .044.015.06.03v.006c.016.016.03.03.06.03.33.136.66.27.93.4.466.202 1.065.403 1.8.536.93.135 1.996.2 3.21 0 .6-.135 1.2-.267 1.8-.535.39-.2.87-.4 1.397-.737 0 0-.6.936-2.205 1.404.33.466.795 1 .795 1 2.744-.06 3.81-1.8 3.87-1.726 0-3.87-1.815-7.02-1.815-7.02-1.635-1.214-3.165-1.26-3.435-1.26l.056-.02zm.168 4.413c.703 0 1.27.6 1.27 1.335 0 .74-.57 1.34-1.27 1.34-.7 0-1.27-.6-1.27-1.334.002-.74.573-1.338 1.27-1.338zm-4.543 0c.7 0 1.266.6 1.266 1.335 0 .74-.57 1.34-1.27 1.34-.7 0-1.27-.6-1.27-1.334 0-.74.57-1.338 1.27-1.338z" /> <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M20.222 0c1.406 0 2.54 1.137 2.607 2.475V24l-2.677-2.273-1.47-1.338-1.604-1.398.67 2.205H3.71c-1.402 0-2.54-1.065-2.54-2.476V2.48C1.17 1.142 2.31.003 3.715.003h16.5L20.222 0zm-6.118 5.683h-.03l-.202.2c2.073.6 3.076 1.537 3.076 1.537-1.336-.668-2.54-1.002-3.744-1.137-.87-.135-1.74-.064-2.475 0h-.2c-.47 0-1.47.2-2.81.735-.467.203-.735.336-.735.336s1.002-1.002 3.21-1.537l-.135-.135s-1.672-.064-3.477 1.27c0 0-1.805 3.144-1.805 7.02 0 0 1 1.74 3.743 1.806 0 0 .4-.533.805-1.002-1.54-.468-2.14-1.404-2.14-1.404s.134.066.335.2h.06c.03 0 .044.015.06.03v.006c.016.016.03.03.06.03.33.136.66.27.93.4.466.202 1.065.403 1.8.536.93.135 1.996.2 3.21 0 .6-.135 1.2-.267 1.8-.535.39-.2.87-.4 1.397-.737 0 0-.6.936-2.205 1.404.33.466.795 1 .795 1 2.744-.06 3.81-1.8 3.87-1.726 0-3.87-1.815-7.02-1.815-7.02-1.635-1.214-3.165-1.26-3.435-1.26l.056-.02zm.168 4.413c.703 0 1.27.6 1.27 1.335 0 .74-.57 1.34-1.27 1.34-.7 0-1.27-.6-1.27-1.334.002-.74.573-1.338 1.27-1.338zm-4.543 0c.7 0 1.266.6 1.266 1.335 0 .74-.57 1.34-1.27 1.34-.7 0-1.27-.6-1.27-1.334 0-.74.57-1.338 1.27-1.338z" />
</svg> </svg>
) )

4
packages/freesewing.shared/components/icons/facebook.js
View file

@ -1,5 +1,5 @@
const Facebook = () => ( const Facebook = ({ className="h-6 w-6" }) => (
<svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <svg xmlns="http://www.w3.org/2000/svg" className={className} fill="currentColor" viewBox="0 0 24 24" stroke="none">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M22.676 0H1.324C.593 0 0 .593 0 1.324v21.352C0 23.408.593 24 1.324 24h11.494v-9.294H9.689v-3.621h3.129V8.41c0-3.099 1.894-4.785 4.659-4.785 1.325 0 2.464.097 2.796.141v3.24h-1.921c-1.5 0-1.792.721-1.792 1.771v2.311h3.584l-.465 3.63H16.56V24h6.115c.733 0 1.325-.592 1.325-1.324V1.324C24 .593 23.408 0 22.676 0" /> <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M22.676 0H1.324C.593 0 0 .593 0 1.324v21.352C0 23.408.593 24 1.324 24h11.494v-9.294H9.689v-3.621h3.129V8.41c0-3.099 1.894-4.785 4.659-4.785 1.325 0 2.464.097 2.796.141v3.24h-1.921c-1.5 0-1.792.721-1.792 1.771v2.311h3.584l-.465 3.63H16.56V24h6.115c.733 0 1.325-.592 1.325-1.324V1.324C24 .593 23.408 0 22.676 0" />
</svg> </svg>
) )

4
packages/freesewing.shared/components/icons/freesewing.js
View file

File diff suppressed because one or more lines are too long

4
packages/freesewing.shared/components/icons/github.js
View file

@ -1,5 +1,5 @@
const Github = () => ( const Github = ({ className="h-6 w-6" }) => (
<svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <svg xmlns="http://www.w3.org/2000/svg" className={className} fill="currentColor" viewBox="0 0 24 24" stroke="none">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12" /> <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12" />
</svg> </svg>
) )

4
packages/freesewing.shared/components/icons/instagram.js
View file

@ -1,5 +1,5 @@
const Instagram = () => ( const Instagram = ({ className="h-6 w-6" }) => (
<svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <svg xmlns="http://www.w3.org/2000/svg" className={className} fill="currentColor" viewBox="0 0 24 24" stroke="none">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 0C8.74 0 8.333.015 7.053.072 5.775.132 4.905.333 4.14.63c-.789.306-1.459.717-2.126 1.384S.935 3.35.63 4.14C.333 4.905.131 5.775.072 7.053.012 8.333 0 8.74 0 12s.015 3.667.072 4.947c.06 1.277.261 2.148.558 2.913.306.788.717 1.459 1.384 2.126.667.666 1.336 1.079 2.126 1.384.766.296 1.636.499 2.913.558C8.333 23.988 8.74 24 12 24s3.667-.015 4.947-.072c1.277-.06 2.148-.262 2.913-.558.788-.306 1.459-.718 2.126-1.384.666-.667 1.079-1.335 1.384-2.126.296-.765.499-1.636.558-2.913.06-1.28.072-1.687.072-4.947s-.015-3.667-.072-4.947c-.06-1.277-.262-2.149-.558-2.913-.306-.789-.718-1.459-1.384-2.126C21.319 1.347 20.651.935 19.86.63c-.765-.297-1.636-.499-2.913-.558C15.667.012 15.26 0 12 0zm0 2.16c3.203 0 3.585.016 4.85.071 1.17.055 1.805.249 2.227.415.562.217.96.477 1.382.896.419.42.679.819.896 1.381.164.422.36 1.057.413 2.227.057 1.266.07 1.646.07 4.85s-.015 3.585-.074 4.85c-.061 1.17-.256 1.805-.421 2.227-.224.562-.479.96-.899 1.382-.419.419-.824.679-1.38.896-.42.164-1.065.36-2.235.413-1.274.057-1.649.07-4.859.07-3.211 0-3.586-.015-4.859-.074-1.171-.061-1.816-.256-2.236-.421-.569-.224-.96-.479-1.379-.899-.421-.419-.69-.824-.9-1.38-.165-.42-.359-1.065-.42-2.235-.045-1.26-.061-1.649-.061-4.844 0-3.196.016-3.586.061-4.861.061-1.17.255-1.814.42-2.234.21-.57.479-.96.9-1.381.419-.419.81-.689 1.379-.898.42-.166 1.051-.361 2.221-.421 1.275-.045 1.65-.06 4.859-.06l.045.03zm0 3.678c-3.405 0-6.162 2.76-6.162 6.162 0 3.405 2.76 6.162 6.162 6.162 3.405 0 6.162-2.76 6.162-6.162 0-3.405-2.76-6.162-6.162-6.162zM12 16c-2.21 0-4-1.79-4-4s1.79-4 4-4 4 1.79 4 4-1.79 4-4 4zm7.846-10.405c0 .795-.646 1.44-1.44 1.44-.795 0-1.44-.646-1.44-1.44 0-.794.646-1.439 1.44-1.439.793-.001 1.44.645 1.44 1.439z" /> <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 0C8.74 0 8.333.015 7.053.072 5.775.132 4.905.333 4.14.63c-.789.306-1.459.717-2.126 1.384S.935 3.35.63 4.14C.333 4.905.131 5.775.072 7.053.012 8.333 0 8.74 0 12s.015 3.667.072 4.947c.06 1.277.261 2.148.558 2.913.306.788.717 1.459 1.384 2.126.667.666 1.336 1.079 2.126 1.384.766.296 1.636.499 2.913.558C8.333 23.988 8.74 24 12 24s3.667-.015 4.947-.072c1.277-.06 2.148-.262 2.913-.558.788-.306 1.459-.718 2.126-1.384.666-.667 1.079-1.335 1.384-2.126.296-.765.499-1.636.558-2.913.06-1.28.072-1.687.072-4.947s-.015-3.667-.072-4.947c-.06-1.277-.262-2.149-.558-2.913-.306-.789-.718-1.459-1.384-2.126C21.319 1.347 20.651.935 19.86.63c-.765-.297-1.636-.499-2.913-.558C15.667.012 15.26 0 12 0zm0 2.16c3.203 0 3.585.016 4.85.071 1.17.055 1.805.249 2.227.415.562.217.96.477 1.382.896.419.42.679.819.896 1.381.164.422.36 1.057.413 2.227.057 1.266.07 1.646.07 4.85s-.015 3.585-.074 4.85c-.061 1.17-.256 1.805-.421 2.227-.224.562-.479.96-.899 1.382-.419.419-.824.679-1.38.896-.42.164-1.065.36-2.235.413-1.274.057-1.649.07-4.859.07-3.211 0-3.586-.015-4.859-.074-1.171-.061-1.816-.256-2.236-.421-.569-.224-.96-.479-1.379-.899-.421-.419-.69-.824-.9-1.38-.165-.42-.359-1.065-.42-2.235-.045-1.26-.061-1.649-.061-4.844 0-3.196.016-3.586.061-4.861.061-1.17.255-1.814.42-2.234.21-.57.479-.96.9-1.381.419-.419.81-.689 1.379-.898.42-.166 1.051-.361 2.221-.421 1.275-.045 1.65-.06 4.859-.06l.045.03zm0 3.678c-3.405 0-6.162 2.76-6.162 6.162 0 3.405 2.76 6.162 6.162 6.162 3.405 0 6.162-2.76 6.162-6.162 0-3.405-2.76-6.162-6.162-6.162zM12 16c-2.21 0-4-1.79-4-4s1.79-4 4-4 4 1.79 4 4-1.79 4-4 4zm7.846-10.405c0 .795-.646 1.44-1.44 1.44-.795 0-1.44-.646-1.44-1.44 0-.794.646-1.439 1.44-1.439.793-.001 1.44.645 1.44 1.439z" />
</svg> </svg>
) )

4
packages/freesewing.shared/components/icons/reddit.js
View file

@ -1,5 +1,5 @@
const Reddit = () => ( const Reddit = ({ className="h-6 w-6" }) => (
<svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6" fill="currentColor" viewBox="0 0 24 24" stroke="none"> <svg xmlns="http://www.w3.org/2000/svg" className={className} fill="currentColor" viewBox="0 0 24 24" stroke="none">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M 11.710829,0.00384705 C 5.0683862,0.16990815 -0.16221405,5.6505729 0.00384705,12.293016 0.16990814,18.686369 5.3178021,23.833614 11.628124,24.082706 18.270567,24.248767 23.833939,19.018167 24,12.375723 V 11.710829 C 23.833939,5.0683862 18.353273,-0.16221404 11.710829,0.00384705 Z m 5.187788,5.10021625 c 0.15698,0.00649 0.313636,0.048326 0.458939,0.1313569 0.581214,0.3321223 0.912687,1.0793971 0.580565,1.660611 C 17.605998,7.4772452 16.858724,7.808718 16.27751,7.4765965 15.862357,7.3105352 15.614238,6.8947339 15.614238,6.3965506 L 13.038995,5.8159854 12.208689,9.55236 c 1.826672,0.08303 3.48858,0.664893 4.651007,1.495199 0.664245,-0.664245 1.826673,-0.664245 2.490917,0 0.332122,0.332121 0.49786,0.747274 0.49786,1.245457 0.249091,0.747275 -0.249092,1.327193 -0.830306,1.576284 v 0.49948 c 0,2.740009 -3.155161,4.897506 -7.057597,4.897506 -3.9024357,0 -7.0575963,-2.157497 -7.0575963,-4.897506 V 13.8693 C 3.9896377,13.454147 3.6578398,12.458754 3.989962,11.545418 c 0.2490916,-0.664245 0.9120387,-1.08037 1.5762832,-0.99734 0.4981831,0 0.9133359,0.167358 1.2454581,0.499481 C 8.2232228,10.134222 9.8848065,9.55236 11.545418,9.55236 l 0.913011,-4.1515273 c 0,-0.083031 0.08271,-0.1654124 0.08271,-0.1654125 0.08303,-0.08303 0.166711,-0.084328 0.249741,-0.084328 l 2.906069,0.664893 C 15.946037,5.3800751 16.427678,5.084603 16.898617,5.1040633 Z M 9.3026198,12.293016 c -0.6642443,0 -1.2454583,0.581214 -1.2454583,1.245458 0,0.664245 0.498183,1.245459 1.2454583,1.245459 0.6642442,0 1.2454582,-0.581214 1.2454582,-1.245459 0,-0.664244 -0.581214,-1.245458 -1.2454582,-1.245458 z m 5.4813132,0 c -0.664245,0 -1.245459,0.581214 -1.245459,1.245458 0,0.664245 0.581214,1.245459 1.245459,1.245459 0.664245,0 1.245458,-0.581214 1.245458,-1.245459 0,-0.664244 -0.581213,-1.245458 -1.245458,-1.245458 z m -5.3872557,3.943952 c -0.072653,0 -0.135249,0.04021 -0.1767645,0.123249 -0.1660605,0.16606 -0.1660605,0.332121 0,0.415152 0.8303052,0.830306 2.4905922,0.914633 2.9887762,0.914633 0.498183,0 2.077061,-0.08433 2.990396,-0.914633 -0.08303,-0.08303 -0.084,-0.249092 -0.167034,-0.415152 -0.166061,-0.166062 -0.332121,-0.166062 -0.415152,0 -0.498183,0.581213 -1.660611,0.747598 -2.490917,0.747598 -0.830305,0 -1.992733,-0.166385 -2.4909165,-0.747598 -0.08303,-0.08303 -0.1657365,-0.123249 -0.2383882,-0.123249 z" /> <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M 11.710829,0.00384705 C 5.0683862,0.16990815 -0.16221405,5.6505729 0.00384705,12.293016 0.16990814,18.686369 5.3178021,23.833614 11.628124,24.082706 18.270567,24.248767 23.833939,19.018167 24,12.375723 V 11.710829 C 23.833939,5.0683862 18.353273,-0.16221404 11.710829,0.00384705 Z m 5.187788,5.10021625 c 0.15698,0.00649 0.313636,0.048326 0.458939,0.1313569 0.581214,0.3321223 0.912687,1.0793971 0.580565,1.660611 C 17.605998,7.4772452 16.858724,7.808718 16.27751,7.4765965 15.862357,7.3105352 15.614238,6.8947339 15.614238,6.3965506 L 13.038995,5.8159854 12.208689,9.55236 c 1.826672,0.08303 3.48858,0.664893 4.651007,1.495199 0.664245,-0.664245 1.826673,-0.664245 2.490917,0 0.332122,0.332121 0.49786,0.747274 0.49786,1.245457 0.249091,0.747275 -0.249092,1.327193 -0.830306,1.576284 v 0.49948 c 0,2.740009 -3.155161,4.897506 -7.057597,4.897506 -3.9024357,0 -7.0575963,-2.157497 -7.0575963,-4.897506 V 13.8693 C 3.9896377,13.454147 3.6578398,12.458754 3.989962,11.545418 c 0.2490916,-0.664245 0.9120387,-1.08037 1.5762832,-0.99734 0.4981831,0 0.9133359,0.167358 1.2454581,0.499481 C 8.2232228,10.134222 9.8848065,9.55236 11.545418,9.55236 l 0.913011,-4.1515273 c 0,-0.083031 0.08271,-0.1654124 0.08271,-0.1654125 0.08303,-0.08303 0.166711,-0.084328 0.249741,-0.084328 l 2.906069,0.664893 C 15.946037,5.3800751 16.427678,5.084603 16.898617,5.1040633 Z M 9.3026198,12.293016 c -0.6642443,0 -1.2454583,0.581214 -1.2454583,1.245458 0,0.664245 0.498183,1.245459 1.2454583,1.245459 0.6642442,0 1.2454582,-0.581214 1.2454582,-1.245459 0,-0.664244 -0.581214,-1.245458 -1.2454582,-1.245458 z m 5.4813132,0 c -0.664245,0 -1.245459,0.581214 -1.245459,1.245458 0,0.664245 0.581214,1.245459 1.245459,1.245459 0.664245,0 1.245458,-0.581214 1.245458,-1.245459 0,-0.664244 -0.581213,-1.245458 -1.245458,-1.245458 z m -5.3872557,3.943952 c -0.072653,0 -0.135249,0.04021 -0.1767645,0.123249 -0.1660605,0.16606 -0.1660605,0.332121 0,0.415152 0.8303052,0.830306 2.4905922,0.914633 2.9887762,0.914633 0.498183,0 2.077061,-0.08433 2.990396,-0.914633 -0.08303,-0.08303 -0.084,-0.249092 -0.167034,-0.415152 -0.166061,-0.166062 -0.332121,-0.166062 -0.415152,0 -0.498183,0.581213 -1.660611,0.747598 -2.490917,0.747598 -0.830305,0 -1.992733,-0.166385 -2.4909165,-0.747598 -0.08303,-0.08303 -0.1657365,-0.123249 -0.2383882,-0.123249 z" />
</svg> </svg>
) )

4
packages/freesewing.shared/components/icons/twitter.js
View file

@ -1,5 +1,5 @@
const Twitter = () => ( const Twitter = ({ className="h-6 w-6" }) => (
<svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <svg xmlns="http://www.w3.org/2000/svg" className={className} fill="currentColor" viewBox="0 0 24 24" stroke="none">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M23.954 4.569c-.885.389-1.83.654-2.825.775 1.014-.611 1.794-1.574 2.163-2.723-.951.555-2.005.959-3.127 1.184-.896-.959-2.173-1.559-3.591-1.559-2.717 0-4.92 2.203-4.92 4.917 0 .39.045.765.127 1.124C7.691 8.094 4.066 6.13 1.64 3.161c-.427.722-.666 1.561-.666 2.475 0 1.71.87 3.213 2.188 4.096-.807-.026-1.566-.248-2.228-.616v.061c0 2.385 1.693 4.374 3.946 4.827-.413.111-.849.171-1.296.171-.314 0-.615-.03-.916-.086.631 1.953 2.445 3.377 4.604 3.417-1.68 1.319-3.809 2.105-6.102 2.105-.39 0-.779-.023-1.17-.067 2.189 1.394 4.768 2.209 7.557 2.209 9.054 0 13.999-7.496 13.999-13.986 0-.209 0-.42-.015-.63.961-.689 1.8-1.56 2.46-2.548l-.047-.02z" /> <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M23.954 4.569c-.885.389-1.83.654-2.825.775 1.014-.611 1.794-1.574 2.163-2.723-.951.555-2.005.959-3.127 1.184-.896-.959-2.173-1.559-3.591-1.559-2.717 0-4.92 2.203-4.92 4.917 0 .39.045.765.127 1.124C7.691 8.094 4.066 6.13 1.64 3.161c-.427.722-.666 1.561-.666 2.475 0 1.71.87 3.213 2.188 4.096-.807-.026-1.566-.248-2.228-.616v.061c0 2.385 1.693 4.374 3.946 4.827-.413.111-.849.171-1.296.171-.314 0-.615-.03-.916-.086.631 1.953 2.445 3.377 4.604 3.417-1.68 1.319-3.809 2.105-6.102 2.105-.39 0-.779-.023-1.17-.067 2.189 1.394 4.768 2.209 7.557 2.209 9.054 0 13.999-7.496 13.999-13.986 0-.209 0-.42-.015-.63.961-.689 1.8-1.56 2.46-2.548l-.047-.02z" />
</svg> </svg>
) )

4
packages/freesewing.shared/components/logos/cc-by.js
View file

@ -1,5 +1,5 @@
const CcByLogo = ({ color='currentColor' }) => ( const CcByLogo = ({ color='currentColor', className="w-6 h-6" }) => (
<svg version="1.0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"> <svg version="1.0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" className={className}>
<path d="M 15.979992,0 C 11.547725,0 7.7962273,1.5468447 4.7257722,4.6397397 1.5749793,7.8390824 0,11.625762 0,15.997998 c 0,4.372236 1.5749793,8.13178 4.7257722,11.27823 3.1507936,3.145777 6.9022908,4.71977 11.2542198,4.71977 4.405488,0 8.224496,-1.585888 11.454296,-4.759785 C 30.477964,24.223648 32,20.478011 32,15.997998 32,11.517982 30.452163,7.7326347 27.356259,4.6397397 24.257681,1.546858 20.465819,0 15.979992,0 Z m 0.04001,2.8790794 c 3.631518,0 6.715299,1.2794302 9.251469,3.8394394 2.562949,2.5325614 3.845442,5.6262482 3.845442,9.2794792 0,3.679334 -1.256021,6.733309 -3.765412,9.159434 -2.644631,2.613564 -5.753553,3.91947 -9.331499,3.91947 -3.579291,0 -6.6630856,-1.292667 -9.2514698,-3.879454 -2.5910732,-2.586786 -3.8834564,-5.653341 -3.8834564,-9.19945 0,-3.546782 1.3069629,-6.6398113 3.9234714,-9.2794792 C 9.3179574,4.1584963 12.388488,2.8790794 16.020008,2.8790794 Z m -0.09803,2.7870445 c -1.20598,0.042082 -2.16164,1.0322514 -2.16081,2.2388397 -9.9e-5,1.2364266 1.002285,2.2388084 2.23884,2.2388394 1.236554,-3.1e-5 2.238936,-1.0024128 2.238839,-2.2388394 9.8e-5,-1.2364264 -1.002285,-2.2388088 -2.238839,-2.2388397 -0.02601,-4.528e-4 -0.05202,-4.528e-4 -0.07803,0 z m -3.195198,5.3380011 c -0.5691,0 -1.032387,0.461333 -1.032387,1.032388 v 6.544454 h 1.826685 v 7.748906 h 4.95986 v -7.748906 h 1.824684 v -6.544454 c 0,-0.571042 -0.463288,-1.032389 -1.032389,-1.032388 z" fill={color} stroke="none" /> <path d="M 15.979992,0 C 11.547725,0 7.7962273,1.5468447 4.7257722,4.6397397 1.5749793,7.8390824 0,11.625762 0,15.997998 c 0,4.372236 1.5749793,8.13178 4.7257722,11.27823 3.1507936,3.145777 6.9022908,4.71977 11.2542198,4.71977 4.405488,0 8.224496,-1.585888 11.454296,-4.759785 C 30.477964,24.223648 32,20.478011 32,15.997998 32,11.517982 30.452163,7.7326347 27.356259,4.6397397 24.257681,1.546858 20.465819,0 15.979992,0 Z m 0.04001,2.8790794 c 3.631518,0 6.715299,1.2794302 9.251469,3.8394394 2.562949,2.5325614 3.845442,5.6262482 3.845442,9.2794792 0,3.679334 -1.256021,6.733309 -3.765412,9.159434 -2.644631,2.613564 -5.753553,3.91947 -9.331499,3.91947 -3.579291,0 -6.6630856,-1.292667 -9.2514698,-3.879454 -2.5910732,-2.586786 -3.8834564,-5.653341 -3.8834564,-9.19945 0,-3.546782 1.3069629,-6.6398113 3.9234714,-9.2794792 C 9.3179574,4.1584963 12.388488,2.8790794 16.020008,2.8790794 Z m -0.09803,2.7870445 c -1.20598,0.042082 -2.16164,1.0322514 -2.16081,2.2388397 -9.9e-5,1.2364266 1.002285,2.2388084 2.23884,2.2388394 1.236554,-3.1e-5 2.238936,-1.0024128 2.238839,-2.2388394 9.8e-5,-1.2364264 -1.002285,-2.2388088 -2.238839,-2.2388397 -0.02601,-4.528e-4 -0.05202,-4.528e-4 -0.07803,0 z m -3.195198,5.3380011 c -0.5691,0 -1.032387,0.461333 -1.032387,1.032388 v 6.544454 h 1.826685 v 7.748906 h 4.95986 v -7.748906 h 1.824684 v -6.544454 c 0,-0.571042 -0.463288,-1.032389 -1.032389,-1.032388 z" fill={color} stroke="none" />
</svg> </svg>
) )

4
packages/freesewing.shared/components/logos/cc.js
View file

File diff suppressed because one or more lines are too long

68
packages/freesewing.shared/components/logos/freesewing.js
View file

@ -11,81 +11,19 @@ const strokes = {
} }
let step = 0 let step = 0
const fills = { const Logo = ({ className='w-20 h-20', theme='light', stroke=false }) => {
light: (
<linearGradient id="light" x1="0%" y1="0%" x2="50%" y2="100%">
<stop offset={`10%`} stopColor={colors.yellow[500]} stopOpacity="1.0" />
<stop offset={`40%`} stopColor={colors.pink[500]} stopOpacity="1.0" />
<stop offset={`75%`} stopColor={colors.violet[500]} stopOpacity="1.0" />
<stop offset={`90%`} stopColor={colors.yellow[500]} stopOpacity="1.0" />
</linearGradient>
),
dark: (
<linearGradient id="dark" x1="50%" y1="0%" x2="0%" y2="100%">
<stop offset={`0%`} stopColor={colors.sky[500]} stopOpacity="1.0" />
<stop offset={`20%`} stopColor={colors.violet[500]} stopOpacity="1.0" />
<stop offset={`55%`} stopColor={colors.yellow[500]} stopOpacity="1.0" />
<stop offset={`85%`} stopColor={colors.pink[500]} stopOpacity="1.0" />
</linearGradient>
),
hax0r: (
<linearGradient id="hax0r" x1="0%" y1="0%" x2="50%" y2="100%">
{[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20].map( i => (
<React.Fragment key={i}>
<stop key={i} offset={`${i*5}%`} stopColor={colors.lime[900]} stopOpacity="1.0" />
<stop key={i} offset={`${i*5+1}%`} stopColor={colors.lime[800]} stopOpacity="1.0" />
<stop key={i} offset={`${i*5+2}%`} stopColor={colors.lime[900]} stopOpacity="1.0" />
</React.Fragment>
))}
</linearGradient>
),
lgbtq: (
<linearGradient id="lgbtq" x1="0%" y1="0%" x2="0%" y2="100%">
{['red', 'orange', 'yellow', 'green', 'blue', 'violet'].map(c => {
let next = step + 100/6
const stop = <React.Fragment key={c}>
<stop offset={`${step}%`} stopColor={colors[c][500]} stopOpacity="1.0" />
<stop offset={`${next}%`} stopColor={colors[c][500]} stopOpacity="1.0" />
</React.Fragment>
step = next
return stop
})}
</linearGradient>
),
trans: (
<linearGradient id="trans" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" stopColor="#77cbf9" stopOpacity="1.0" />
<stop offset="20%" stopColor="#77cbf9" stopOpacity="1.0" />
<stop offset="20%" stopColor="#ecadb9" stopOpacity="1.0" />
<stop offset="40%" stopColor="#ecadb9" stopOpacity="1.0" />
<stop offset="40%" stopColor="#ffffff" stopOpacity="1.0" />
<stop offset="60%" stopColor="#ffffff" stopOpacity="1.0" />
<stop offset="60%" stopColor="#ecadb9" stopOpacity="1.0" />
<stop offset="80%" stopColor="#ecadb9" stopOpacity="1.0" />
<stop offset="80%" stopColor="#77cbf9" stopOpacity="1.0" />
<stop offset="100%" stopColor="#77cbf9" stopOpacity="1.0" />
</linearGradient>
),
}
const Logo = ({ size=false, className='stroke-0', theme='light', fill=false, stroke=false }) => {
const svgProps = { const svgProps = {
xmlns: 'http://www.w3.org/2000/svg', xmlns: 'http://www.w3.org/2000/svg',
viewBox: '-1 0 25 25', viewBox: '1 0 25 25',
className: className className: className
} }
if (size) {
svgProps.width = size
svgProps.height = size
}
return ( return (
<svg {...svgProps}> <svg {...svgProps}>
<defs> <defs>
{fill && fills[theme]}
<path id="react-logo" d={path} /> <path id="react-logo" d={path} />
</defs> </defs>
<use xlinkHref="#react-logo" fill="none" stroke={stroke || strokes[theme]} strokeWidth="0.5"/> <use xlinkHref="#react-logo" fill="none" stroke={stroke || strokes[theme]} strokeWidth="0.5"/>
<use xlinkHref="#react-logo" fill={fill || `url(#${theme})`} stroke="none"/> <use xlinkHref="#react-logo" fill="currentColor" stroke="none"/>
</svg> </svg>
) )
} }

4
packages/freesewing.shared/components/logos/osi.js
View file

@ -1,5 +1,5 @@
const OsiLogo = ({ color='currentColor' }) => ( const OsiLogo = ({ color='currentColor', className="w-6 h-6" }) => (
<svg viewBox="-0.5 -0.5 33 33" xmlns="http://www.w3.org/2000/svg"> <svg viewBox="-0.5 -0.5 33 33" xmlns="http://www.w3.org/2000/svg" className={className}>
<path d="m16 15.993m1.9113 4.9789a5.333 5.333 0 1 0-3.8226 0l-3.5923 9.3604a15.359 15.359 0 1 1 11.007 0z" fill="none" stroke={color} strokeWidth="2"/> <path d="m16 15.993m1.9113 4.9789a5.333 5.333 0 1 0-3.8226 0l-3.5923 9.3604a15.359 15.359 0 1 1 11.007 0z" fill="none" stroke={color} strokeWidth="2"/>
</svg> </svg>
) )