Walidoux
d26b429ee8
BREAKING CHANGES - Refactored `App.tsx` to import `Component` from `solid-js`, and use a new component `TitleBar`. - Added new component `AnimateView` under `src/components/design`, and renamed old `AnimateView` to `Loader`. - Added new component `Button` under `src/components/design`. - Added new component `Image` under `src/components/design`. - Moved old `Image`, `Loader`, and `Button` components under `src/components/design`. - Refactored `Downloader` component to use `Motion` from `@motionone/solid`, moved it under `Downloader` folder, and used it to create a slick hover effect. - Removed `Downloaders/Button`. Notes: - Used `createSignal` instead of `useState` for SolidJS in `Downloaders.tsx`. - Used `type` keyword to explicitly define the type of the component props or objects where it makes the code clearer.
20 lines
418 B
TypeScript
20 lines
418 B
TypeScript
import type { Component } from 'solid-js'
|
|
|
|
import { Downloaders, TitleBar } from './components/layout'
|
|
|
|
const Main: Component = () => {
|
|
return (
|
|
<>
|
|
<TitleBar />
|
|
|
|
<main class='relative flex h-full w-screen flex-col items-center justify-center bg-[#242424] py-20'>
|
|
<span class='mb-20 text-white'>I would like to:</span>
|
|
|
|
<Downloaders />
|
|
</main>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default Main
|