Added Color Converter Component and Page

This commit is contained in:
Patrick Alvin Alcala 2025-06-04 15:49:13 +08:00
parent 3deee5d463
commit ff4a000998
3 changed files with 45 additions and 0 deletions

View file

@ -0,0 +1,10 @@
import './ColorConverterComponent.sass'
export default () => {
return (
<>
<section class='section'><h1>hello</h1></section>
</>
)
}

View file

@ -0,0 +1,35 @@
---
import Layout from '../layouts/Layout.astro'
import ColorConverterComponent from '../components/PageComponents/Color-Converter/ColorConverterComponent.tsx'
import PageTitle from '../components/PageTitle/PageTitle'
---
<Layout title="Color Converter - AIO Tools">
<div class="page">
<PageTitle title="Color Converter" description="Convert colors to any format. Color picker provided inside." />
<section class="content">
<ColorConverterComponent client:visible />
</section>
</div>
</Layout>
<style lang="sass">
@use '/src/assets/css/viewport.sass' as view
.page
text-align: center
margin: 4rem 0 0 0
transition: margin 0.4s ease-in-out
@media screen and (max-width: view.$tablet)
margin-top: 1rem
.content
display: flex
justify-content: center
align-items: center
// border: 1px solid #ffffff
// padding: 2rem
// border-radius: 8px
</style>