import React from 'react'
import Text from 'funuicss/ui/text/Text'
import Input from 'funuicss/ui/input/Input'
import Button from 'funuicss/ui/button/Button'
import Section from 'funuicss/ui/specials/Section'
export default function App() {

return (

<div>
<div className="central height-500-min" >
 <div className='width-300-max fit'>
<div className="margin-bottom-40">
<Text
text='Welcome'
heading='h2'
block
/>
<Text
text='Sign in to continue!'
block
/>
</div>
<Section gap={1.5}>
<Text text="Email" funcss="margin-bottom-10" block size="small" bold color="primary"/>
<Input type="email" fullWidth bordered />
</Section>
<Section gap={1}>
<Text text="Password" funcss="margin-bottom-10" block size="small" bold color="primary"/>
<Input type="password" fullWidth bordered />
</Section>

<div className="section">
  <Link href={"/#"}>
      <Text text='Forgot password!' size='small' underline color='primary'/>
  </Link>
</div>
<div className="section">
  <Button
  text={"Let's go"}
  raised
  fullWidth
  bg='primary800'
  />
</div>

</div>
</div>
</div>

)
}

import React from 'react'
import Button from 'funuicss/ui/button/Button'

export default function App() {
return (
<Button  bg="primary" outlined text="Simple Button"/>
)
}

import React from 'react'
import Input from 'funuicss/ui/input/Input'

export default function App() {
return (
<>
<Input 
type="text" 
label="This is a simple input" 
funcss="full-width"
/>
<Input 
type="text" 
bordered 
label="This is a bordered" 
funcss="full-width section"
/>
</>
)
}