PatAlcala9/ocbo-esign
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Updated index page

Browse source
This commit is contained in:
Patrick Alvin Alcala 2025-10-07 16:28:34 +08:00
parent c9f787ad39
commit a9970175c2
2 changed files with 41 additions and 37 deletions
Download patch file Download diff file Expand all files Collapse all files

12
src/pages/IndexPage/Index.sass
View file

@ -53,3 +53,15 @@ h1
@media only screen and (max-width: views.$tablet) @media only screen and (max-width: views.$tablet)
padding: 3.25rem 0 0 0 padding: 3.25rem 0 0 0
font-size: 1rem font-size: 1rem
.mobile-buttons
padding: 2rem 0 0 0
display: flex
flex-direction: column
flex-wrap: wrap
justify-content: center
align-items: stretch
align-content: stretch
text-align: center
gap: 0.5rem
width: 55vw

66
src/pages/IndexPage/Index.tsx
View file

@ -1,5 +1,5 @@
import './Index.sass' import './Index.sass'
import { Button, Page, Padding, Display, Row, Logo, Footer, Image, Copyright, Column } from '../../components' import { Button, Page, Padding, Display, Row, Logo, Footer, Copyright, Column, Image } from '../../components'
import { onMount } from 'solid-js' import { onMount } from 'solid-js'
import { ofetch } from 'ofetch' import { ofetch } from 'ofetch'
import ocboAvif from '../../assets/images/optimized/ocbologo.avif' import ocboAvif from '../../assets/images/optimized/ocbologo.avif'
@ -50,8 +50,8 @@ export default () => {
return ( return (
<> <>
<Page> <Page>
<Padding left={4.75} right={4.75} top={0} bottom={0}> <Display desktop tablet>
<Display desktop tablet> <Padding left={4.75} right={4.75} top={0} bottom={0}>
<Row content="split"> <Row content="split">
<Row content="left" gap={2}> <Row content="left" gap={2}>
<Logo size={200} /> <Logo size={200} />
@ -70,32 +70,15 @@ export default () => {
<span class="title__sub">for Office of the City Building Official</span> <span class="title__sub">for Office of the City Building Official</span>
<p class="title__paragraph">A paperless and effortless solution on signing permits</p> <p class="title__paragraph">A paperless and effortless solution on signing permits</p>
</section> </section>
<Column>
<Image avif={pageLogoAvif} webp={pageLogoWebp} size={500}></Image> <Display desktop>
</Column> <Column padding="3rem 0 0 0">
<Image avif={pageLogoAvif} webp={pageLogoWebp} size={450}></Image>
</Column>
</Display>
</Row> </Row>
</Display> </Padding>
<Display mobile>
<Row>
<Logo size={200} />
<h1>OCBO e-Sign</h1>
<section class="title">
<h1 class="title__main">Secure e-Signature</h1>
<span class="title__sub">for Office of the City Building Official</span>
<p class="title__paragraph">A paperless and effortless solution on signing permits</p>
</section>
<Column gap={0.5}>
<Button wide label="Login" edges="curved" design="bo-primary" to="/login" />
<Button wide label="Register" edges="curved" design="bo-primary" to="/register" />
</Column>
</Row>
</Display>
</Padding>
<Display desktop tablet>
<Footer> <Footer>
<Row content="split"> <Row content="split">
<Row gap={0.5}> <Row gap={0.5}>
@ -116,17 +99,26 @@ export default () => {
</Display> </Display>
<Display mobile> <Display mobile>
<Footer> <Column>
<Column> <Logo size={200} />
<Column gap={0.25}> <h1>OCBO e-Sign</h1>
<Copyright year="2025" name="Office of the City Building Official" /> <Image avif={pageLogoAvif} webp={pageLogoWebp} size={200}></Image>
<span>Davao City, Philippines</span>
<Row gap={0.25}> <section class="mobile-buttons">
<span>Developed by:</span> <Image avif={patAvif} webp={patWebp} size={60}></Image> <Button wide label="Login" edges="curved" design="bo-primary" to="/login" />
<span>Pat Alcala</span> <Button wide label="Register" edges="curved" design="bo-primary" to="/register" />
</Row> </section>
</Column> </Column>
<Footer>
<Column gap={0.25} width="100%">
<Copyright year="2025" name="Office of the City Building Official" />
<span>Davao City, Philippines</span>
<Row gap={0.25}>
<span>Developed by:</span> <Image avif={patAvif} webp={patWebp} size={60}></Image>
<span>Pat Alcala</span>
</Row>
</Column> </Column>
</Footer> </Footer>
</Display> </Display>