Thream/website
Archived
2
2
Fork 0
Code Issues Pull Requests Releases Activity

feat: create a guild (#1)

Browse Source
This commit is contained in:
Divlo
2021-10-26 16:38:55 +02:00
committed by GitHub
parent a0fa66e8f5
commit d8fab08585
45 changed files with 530 additions and 315 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
pages/application/guilds/create.tsx
View File

@ -1,77 +1,19 @@
import Image from 'next/image'
import { Form } from 'react-component-form'
import TextareaAutosize from 'react-textarea-autosize'
import { Head } from 'components/Head'
import { Application } from 'components/Application'
import { Input } from 'components/design/Input'
import { Main } from 'components/design/Main'
import { Button } from 'components/design/Button'
import { FormState } from 'components/design/FormState'
import {
authenticationFromServerSide,
AuthenticationProvider,
PagePropsWithAuthentication
} from 'utils/authentication'
import { CreateGuild } from 'components/Application/CreateGuild'
const CreateGuild: React.FC<PagePropsWithAuthentication> = (props) => {
const CreateGuildPage: React.FC<PagePropsWithAuthentication> = (props) => {
return (
<AuthenticationProvider authentication={props.authentication}>
<Head title='Thream | Create a Guild' />
<Application path='/application/guilds/create'>
<Main>
<Form className='w-4/6 max-w-xs'>
<div className='flex flex-col'>
<div className='flex justify-between mt-6 mb-2'>
<label className='pl-1' htmlFor='icon'>
Icon
</label>
</div>
<div className='mt-2 relative flex flex-col items-center'>
<button className='relative w-14 h-14 flex items-center overflow-hidden justify-center text-green-800 dark:text-green-400 transform scale-125 hover:scale-150'>
<Image
src='/images/data/guild-default.png'
alt='logo'
width={56}
height={56}
className='w-14 h-14 rounded-full'
/>
<input
name='icon'
id='icon'
type='file'
className='absolute w-22 h-20 -top-8 -left-8 opacity-0 cursor-pointer'
/>
</button>
</div>
</div>
<Input type='text' placeholder='Name' name='name' label='Name' />
<div className='flex flex-col'>
<div className='flex justify-between mt-6 mb-2'>
<label className='pl-1' htmlFor='description'>
Description
</label>
</div>
<div className='mt-0 relative'>
<TextareaAutosize
className='p-3 rounded-lg bg-[#f1f1f1] text-[#2a2a2a] caret-green-600 font-paragraph w-full focus:border focus:outline-none resize-none focus:shadow-green'
placeholder='Description...'
id='description'
name='description'
wrap='soft'
></TextareaAutosize>
<FormState state='idle' />
</div>
</div>
<Button className='w-full mt-6' type='submit'>
Create
</Button>
</Form>
</Main>
<CreateGuild />
</Application>
</AuthenticationProvider>
)
@ -81,4 +23,4 @@ export const getServerSideProps = authenticationFromServerSide({
shouldBeAuthenticated: true
})
export default CreateGuild
export default CreateGuildPage