feat: initial commit

src/pages/home/index.tsx

@@ -0,0 +1,27 @@
+import {Box, Icon, Input, Stack, TextField} from "@mui/material";
+import Typography from "@mui/material/Typography";
+import SearchIcon from '@mui/icons-material/Search';
+
+export default function Home() {
+  return (<Box padding={5} display={'flex'} flexDirection={'column'} alignItems={'center'} justifyContent={'center'}
+               width={'100%'}>
+    <Box width={"60%"}>
+      <Stack mb={1} direction={'row'} spacing={1}> <Typography fontSize={30}>Transform Your Workflow
+        with </Typography><Typography
+        fontSize={30}
+        color={'primary'}>Omni
+        Tools</Typography></Stack>
+      <Typography fontSize={20} mb={2}>
+        Boost your productivity with Omni Tools—the ultimate toolkit for getting things done quickly! Access thousands
+        of
+        user-friendly utilities for editing images, text, lists, and data, all directly from your browser.
+      </Typography>
+
+      <TextField fullWidth placeholder={'Search all tools'} sx={{borderRadius: 2}} InputProps={{
+        endAdornment: (
+          <SearchIcon/>
+        ),
+      }}/>
+    </Box>
+  </Box>)
+}

src/pages/images/ImagesConfig.tsx

@@ -0,0 +1,10 @@
+import {RouteObject} from "react-router-dom";
+import {lazy} from "react";
+import {PngConfig} from "./png/PngConfig";
+
+const PngHome = lazy(() => import("./index"));
+
+export const ImagesConfig: RouteObject[] = [
+  {path: '', element: <PngHome/>},
+  {path: 'png', children: PngConfig},
+]

src/pages/images/index.tsx

@@ -0,0 +1,5 @@
+import {Box} from "@mui/material";
+
+export default function ImageHome() {
+  return (<Box></Box>)
+}

src/pages/images/png/PngConfig.tsx

@@ -0,0 +1,10 @@
+import {RouteObject} from "react-router-dom";
+import {lazy} from "react";
+
+const ChangeColorsInPng = lazy(() => import("./change-colors-in-png"));
+const PngHome = lazy(() => import("./"));
+
+export const PngConfig: RouteObject[] = [
+  {path: '', element: <PngHome/>},
+  {path: 'change-colors-in-png', element: <ChangeColorsInPng/>}
+]

src/pages/images/png/change-colors-in-png/index.tsx

@@ -0,0 +1,5 @@
+import { Box } from "@mui/material";
+
+export default function ChangeColorsInPng(){
+  return(<Box></Box>)
+}

src/pages/images/png/index.tsx

@@ -0,0 +1,5 @@
+import {Box} from "@mui/material";
+
+export default function PngHome() {
+  return (<Box></Box>)
+}