2022-05-11 17:41:24 +02:00
import Page from 'site/components/wrappers/page.js'
2021-12-11 14:04:05 +01:00
import useApp from 'site/hooks/useApp.js'
2021-12-31 15:35:04 +01:00
import Head from 'next/head'
2021-12-31 13:44:16 +01:00
import HelpUs from 'site/components/help-us.js'
2021-12-28 13:20:42 +01:00
import Link from 'next/link'
2022-02-13 16:00:00 +01:00
import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
2022-05-11 17:41:24 +02:00
import Layout from 'site/components/layouts/bare'
2022-05-12 10:27:42 +02:00
import Navigation , { Icons } from 'shared/components/navigation/primary'
2021-12-10 09:56:19 +01:00
2021-12-27 09:55:52 +01:00
const HomePage = ( props ) => {
2021-12-11 14:04:05 +01:00
const app = useApp ( )
2021-12-10 09:56:19 +01:00
return (
2022-05-11 17:41:24 +02:00
< Page app = { app } title = "Welcome to FreeSewing.dev" layout = { Layout } >
2021-12-31 15:35:04 +01:00
< Head >
< meta property = "og:title" content = "FreeSewing.dev" key = "title" / >
< meta property = "og:type" content = "article" key = 'type' / >
2022-01-03 18:21:43 +01:00
< meta property = "og:description" content = "Documentation and tutorials for FreeSewing developers and contributors. Plus our Developers Blog" key = 'description' / >
2021-12-31 15:35:04 +01:00
< meta property = "og:article:author" content = 'Joost De Cock' key = 'author' / >
2021-12-31 16:10:44 +01:00
< meta property = "og:image" content = "https://canary.backend.freesewing.org/og-img/en/dev/" key = 'image' / >
2021-12-31 15:35:04 +01:00
< meta property = "og:image:type" content = "image/png" / >
< meta property = "og:image:width" content = "1200" / >
< meta property = "og:image:height" content = "630" / >
< meta property = "og:url" content = "https://freesewing.dev/" key = 'url' / >
< meta property = "og:locale" content = "en_US" key = 'locale' / >
< meta property = "og:site_name" content = "freesewing.dev" key = 'site' / >
< / H e a d >
2022-05-11 17:41:24 +02:00
< section
style = { {
backgroundImage : "url('/img/splash.jpg')" ,
backgroundSize : 'cover' ,
2022-05-12 10:27:42 +02:00
backgroundPosition : '40% 50%' ,
2022-05-11 17:41:24 +02:00
} }
2022-05-12 10:27:42 +02:00
className = "m-0 p-0 shadow drop-shadow-lg w-full mb-8"
2022-05-11 17:41:24 +02:00
>
2022-05-12 10:27:42 +02:00
< div className = "mx-auto px-8 flex flex-col items-center justify-center min-h-screen lg:min-h-0 lg:py-96" >
< div className = "flex flex-col items-end max-w-4xl" >
< h1
className = { `
text - 4 xl font - black text - right px - 4
sm : text - 6 xl
md : text - 7 xl px - 6
lg : px - 8
bg - secondary
` }
style = { { textShadow : '1px 1px 3px #000' , color : 'white' } }
>
FreeSewing
< span className = "font-light" > . dev < / s p a n >
< / h 1 >
< h2
className = { `
text - right text - 2 xl mr - 0
sm : text - 3 xl
md : text - 4 xl
lg : max - w - 1 / 2 lg : text - 4 xl xl : pr - 0 ` }
style = { { textShadow : '1px 1px 3px #000' , color : 'white' } }
>
Documentation for FreeSewing contributors & developers
< / h 2 >
< / d i v >
< Icons app = { app } active = '/'
ulClasses = "flex flex-row flex-wrap mt-8 justify-around w-full max-w-6xl"
liClasses = "text-neutral-content w-1/3 my-4 lg:mx-2 lg:w-24"
linkClasses = { `
text - lg lg : text - xl py - 1 text - secondary
hover : text - secondary sm : hover : text - secondary - focus hover : cursor - pointer
flex flex - col items - center capitalize ` }
/ >
< p className = "text-neutral-content text-center mt-8" >
To learn more about FreeSewing and try our platform
go to < a
href = "https://freesewing.org/"
title = "Go to FreeSewing.org"
className = "text-secondary font-bold"
> freesewing . org < / a >
< / p >
2022-05-11 17:41:24 +02:00
< / d i v >
< / s e c t i o n >
< div >
2022-05-12 10:27:42 +02:00
< div className = "max-w-7xl m-auto my-32" >
2021-12-28 17:09:45 +01:00
< div className = "bg-cover bg-neutral w-full bg-center rounded-lg shadow p-4 "
style = { { backgroundImage : "url(/support.jpg)" } }
>
< h2 className = "text-neutral-content p-4 text-4xl font-bold sm:font-light sm:text-6xl drop-shadow" > Support FreeSewing < / h 2 >
< p className = "text-neutral-content p-4 font-bold max-w-md text-lg" >
FreeSewing is fuelled by a voluntary subscription model
< / p >
< p className = "text-neutral-content p-4 font-bold max-w-md text-lg" >
If you think what we do is worthwhile ,
and if you can spare a few coins each month without hardship ,
please support our work
< / p >
< a role = "button" className = "btn btn-accent btn-wide ml-4 mb-8" href = "https://freesewing.org/patrons/join" > Become a Patron < / a >
< / d i v >
2022-05-12 10:27:42 +02:00
< / d i v >
< div className = "max-w-7xl m-auto my-32" >
< div className = "px-8 text-base-content" >
< Icons app = { app }
active = '/'
ulClasses = "flex flex-row flex-wrap mt-8 justify-around w-full max-w-6xl"
liClasses = "w-1/3 my-4 lg:mx-2 lg:w-24"
linkClasses = { `
text - lg lg : text - xl py - 1 text - base - content
hover : text - secondary sm : hover : text - secondary - focus hover : cursor - pointer
flex flex - col items - center capitalize ` }
/ >
< / d i v >
< / d i v >
< div className = "max-w-xl m-auto my-32" >
2021-12-31 13:44:16 +01:00
< HelpUs slug = '/' / >
2021-12-28 17:09:45 +01:00
< / d i v >
2022-05-12 10:27:42 +02:00
< / d i v >
2021-12-11 14:04:05 +01:00
< / P a g e >
2021-12-10 09:56:19 +01:00
)
}
2021-12-11 14:04:05 +01:00
2021-12-27 09:55:52 +01:00
export default HomePage
2022-02-13 16:00:00 +01:00
export async function getStaticProps ( { locale } ) {
return {
props : {
2022-03-29 16:30:14 +02:00
... ( await serverSideTranslations ( 'en' ) ) ,
2022-02-13 16:00:00 +01:00
}
}
}
