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

Updated index to use fwt components

Browse source
This commit is contained in:
Patrick Alvin Alcala 2025-09-04 12:06:44 +08:00
parent b3f5040b8e
commit 687a046dbd
1 changed files with 12 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

25
src/pages/index.astro
View file

@ -1,15 +1,18 @@
--- ---
import Layout from '../layouts/Layout.astro' import Layout from '../layouts/Layout.astro'
import Card from '../components/Card/Card.jsx' import Card from '../components/Card/Card.jsx'
import aioToolsImage from '../assets/images/aio-tools.png' import Logo from '../../fwt/components/Logo/Logo'
import { Image } from 'astro:assets' import Link from '../../fwt/components/Link/Link'
import Footer from '../../fwt/components/Footer/Footer'
import Copyright from '../../fwt/components/Copyright/Copyright'
--- ---
<Layout title="AIO Tools"> <Layout title="AIO Tools">
<main class="page"> <main class="page">
<section class="title--section"> <section class="title--section">
<div class="titleandlogo"> <div class="titleandlogo">
<Image class="titleandlogo__logo" src={aioToolsImage} alt="AIO Tools" width={90} quality={80} /> <Logo size={90} />
<div class="titleandlogo__texts"> <div class="titleandlogo__texts">
<span class="titleandlogo__texts__title">AIO Tools</span> <span class="titleandlogo__texts__title">AIO Tools</span>
<span class="titleandlogo__texts__subtitle">All-in-One Tools for Everyone</span> <span class="titleandlogo__texts__subtitle">All-in-One Tools for Everyone</span>
@ -18,17 +21,17 @@ import { Image } from 'astro:assets'
</section> </section>
<section class="cards--section"> <section class="cards--section">
<a href="/password-generator" data-astro-prefetch aria-label="Password generator page"><Card title="Password Generator" description="Generate a strong and secure password for your accounts online." /> </a> <Link to="/password-generator"><Card title="Password Generator" description="Generate a strong and secure password for your accounts online." /></Link>
<a href="/hash-generator" data-astro-prefetch aria-label="Hash generator page"><Card title="Hash Generator" description="Convert text to multiple hash formats for secure data transmission." /></a> <Link to="/hash-generator"><Card title="Hash Generator" description="Convert text to multiple hash formats for secure data transmission." /></Link>
<a href="/color-converter" data-astro-prefetch aria-label="Color converter page"><Card title="Color Converter" description="Convert colors to any format. Color picker provided inside." /></a> <Link to="/color-converter"><Card title="Color Converter" description="Convert colors to any format. Color picker provided inside." /></Link>
<a href="/text-comparison" data-astro-prefetch aria-label="Text comparison page"><Card title="Text Comparison" description="Compare text side by side to detect changes easily." /></a> <Link to="/text-comparison"><Card title="Text Comparison" description="Compare text side by side to detect changes easily." /></Link>
</section> </section>
</main> </main>
</Layout> </Layout>
<style lang="sass"> <style lang="sass">
@use '/src/assets/css/viewport.sass' as view @use '/src/styles/breakpoint.sass' as view
@use '/src/assets/css/variables.sass' as vars @use '/src/styles/variables.sass' as vars
.page .page
display: flex display: flex
@ -88,8 +91,4 @@ import { Image } from 'astro:assets'
padding: 0.5rem padding: 0.5rem
margin-top: 2rem margin-top: 2rem
border-radius: 0.5rem border-radius: 0.5rem
a
text-decoration: none
color: inherit
</style> </style>