here we go
This commit is contained in:
parent
f18e06a7cb
commit
8fb12be7a6
@ -7,6 +7,6 @@
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/src/main.tsx"></script>
|
||||
<script type="module" src="/src/app/main.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
1684
package-lock.json
generated
1684
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -12,19 +12,23 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"react": "^18.3.1",
|
||||
"react-dom": "^18.3.1"
|
||||
"react-dom": "^18.3.1",
|
||||
"react-router-dom": "^6.27.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@eslint/js": "^9.11.1",
|
||||
"@types/node": "^22.7.5",
|
||||
"@types/react": "^18.3.10",
|
||||
"@types/react-dom": "^18.3.0",
|
||||
"@typescript-eslint/eslint-plugin": "^8.8.1",
|
||||
"@typescript-eslint/parser": "^8.8.1",
|
||||
"@vitejs/plugin-react-swc": "^3.5.0",
|
||||
"autoprefixer": "^10.4.20",
|
||||
"axios": "^1.7.7",
|
||||
"eslint": "^9.11.1",
|
||||
"eslint": "^9.12.0",
|
||||
"eslint-config-prettier": "^9.1.0",
|
||||
"eslint-plugin-prettier": "^5.2.1",
|
||||
"eslint-plugin-react": "^7.37.1",
|
||||
"eslint-plugin-react-hooks": "^5.1.0-rc.0",
|
||||
"eslint-plugin-react-refresh": "^0.4.12",
|
||||
"globals": "^15.9.0",
|
||||
|
@ -1,5 +0,0 @@
|
||||
function App() {
|
||||
return <></>;
|
||||
}
|
||||
|
||||
export default App;
|
8
src/app/App.tsx
Normal file
8
src/app/App.tsx
Normal file
@ -0,0 +1,8 @@
|
||||
import Index from '@/pages';
|
||||
import '@shared/assets/styles/globals.scss';
|
||||
|
||||
function App() {
|
||||
return <Index />;
|
||||
}
|
||||
|
||||
export default App;
|
17
src/app/layout/layout.tsx
Normal file
17
src/app/layout/layout.tsx
Normal file
@ -0,0 +1,17 @@
|
||||
import { FC } from 'react';
|
||||
import { LayoutRouteProps } from 'react-router-dom';
|
||||
import classes from './styles.module.scss';
|
||||
import { Navbar } from '@/widgets/navbar';
|
||||
import { Footer } from '@/widgets/footer';
|
||||
|
||||
const Layout: FC<LayoutRouteProps> = ({ children }) => {
|
||||
return (
|
||||
<div className={classes.container}>
|
||||
<Navbar />
|
||||
<main>{children}</main>
|
||||
<Footer />
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default Layout;
|
19
src/app/layout/styles.module.scss
Normal file
19
src/app/layout/styles.module.scss
Normal file
@ -0,0 +1,19 @@
|
||||
@use '../../shared/assets/styles/adaptive' as adaptive;
|
||||
|
||||
$adaptive: (
|
||||
desktop: (
|
||||
container: 1240px
|
||||
),
|
||||
laptop: (
|
||||
container: 886px
|
||||
),
|
||||
mobile: (
|
||||
container: 315px
|
||||
),
|
||||
);
|
||||
|
||||
.container {
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
@include adaptive.set-adaptive($adaptive, max-width, container);
|
||||
}
|
5
src/pages/home/home.page.tsx
Normal file
5
src/pages/home/home.page.tsx
Normal file
@ -0,0 +1,5 @@
|
||||
const HomePage = () => {
|
||||
return <></>;
|
||||
};
|
||||
|
||||
export default HomePage;
|
23
src/pages/index.tsx
Normal file
23
src/pages/index.tsx
Normal file
@ -0,0 +1,23 @@
|
||||
import { BrowserRouter, Routes, Route } from 'react-router-dom';
|
||||
import Layout from '@app/layout/layout';
|
||||
import HomePage from '@pages/home/home.page';
|
||||
|
||||
const routes = [{ path: '/', element: <HomePage /> }];
|
||||
|
||||
const Index = () => {
|
||||
return (
|
||||
<BrowserRouter>
|
||||
<Routes>
|
||||
{routes.map((route) => (
|
||||
<Route
|
||||
key={route.path}
|
||||
path={route.path}
|
||||
element={<Layout children={route.element} />}
|
||||
></Route>
|
||||
))}
|
||||
</Routes>
|
||||
</BrowserRouter>
|
||||
);
|
||||
};
|
||||
|
||||
export default Index;
|
BIN
src/shared/assets/icons/background.jpg
Normal file
BIN
src/shared/assets/icons/background.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 2.1 MiB |
33
src/shared/assets/styles/_adaptive.scss
Normal file
33
src/shared/assets/styles/_adaptive.scss
Normal file
@ -0,0 +1,33 @@
|
||||
$breakpoints: (
|
||||
desktop: (
|
||||
max: 1440px,
|
||||
min: 1024.1px
|
||||
),
|
||||
laptop: (
|
||||
max: 1024px,
|
||||
min: 375.1px
|
||||
),
|
||||
mobile: (
|
||||
max: 375px,
|
||||
min: 0px
|
||||
),
|
||||
);
|
||||
|
||||
@mixin breakpoint($point) {
|
||||
$min-width: map-get($breakpoints, $point, min);
|
||||
$max-width: map-get($breakpoints, $point, max);
|
||||
|
||||
@media (min-width: $min-width) and (max-width: $max-width) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin set-adaptive($adaptive, $property: null, $attribute: null) {
|
||||
@each $breakpoint, $settings in $adaptive {
|
||||
@include breakpoint($breakpoint) {
|
||||
@if $property and $attribute {
|
||||
#{$property}: map-get($settings, $attribute);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
0
src/shared/assets/styles/_fonts.scss
Normal file
0
src/shared/assets/styles/_fonts.scss
Normal file
2
src/shared/assets/styles/globals.scss
Normal file
2
src/shared/assets/styles/globals.scss
Normal file
@ -0,0 +1,2 @@
|
||||
@use './adaptive';
|
||||
@use './fonts';
|
5
src/shared/components/button/button.component.tsx
Normal file
5
src/shared/components/button/button.component.tsx
Normal file
@ -0,0 +1,5 @@
|
||||
import classes from './styles.module.scss';
|
||||
|
||||
const Button = () => {};
|
||||
|
||||
export default Button;
|
1
src/shared/components/button/index.ts
Normal file
1
src/shared/components/button/index.ts
Normal file
@ -0,0 +1 @@
|
||||
export { default as Button} from './button.component';
|
0
src/shared/components/button/styles.module.scss
Normal file
0
src/shared/components/button/styles.module.scss
Normal file
1
src/shared/components/selector/index.ts
Normal file
1
src/shared/components/selector/index.ts
Normal file
@ -0,0 +1 @@
|
||||
export { default as Selector } from './selector.component';
|
19
src/shared/components/selector/selector.component.tsx
Normal file
19
src/shared/components/selector/selector.component.tsx
Normal file
@ -0,0 +1,19 @@
|
||||
import { FC } from 'react';
|
||||
import classes from './styles.module.scss';
|
||||
|
||||
type SelectorProps = {
|
||||
handleSetValue: () => void;
|
||||
list: string[];
|
||||
};
|
||||
|
||||
const Selector: FC<SelectorProps> = ({ handleSetValue, list }) => {
|
||||
return (
|
||||
<section className={classes.selector}>
|
||||
{list.map((item) => (
|
||||
<option>{item}</option>
|
||||
))}
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export default Selector;
|
0
src/shared/components/selector/styles.module.scss
Normal file
0
src/shared/components/selector/styles.module.scss
Normal file
5
src/widgets/footer/footer.widget.tsx
Normal file
5
src/widgets/footer/footer.widget.tsx
Normal file
@ -0,0 +1,5 @@
|
||||
const Footer = () => {
|
||||
return <></>;
|
||||
};
|
||||
|
||||
export default Footer;
|
1
src/widgets/footer/index.ts
Normal file
1
src/widgets/footer/index.ts
Normal file
@ -0,0 +1 @@
|
||||
export { default as Footer } from './footer.widget';
|
0
src/widgets/footer/styles.module.scss
Normal file
0
src/widgets/footer/styles.module.scss
Normal file
1
src/widgets/navbar/index.ts
Normal file
1
src/widgets/navbar/index.ts
Normal file
@ -0,0 +1 @@
|
||||
export { default as Navbar } from './navbar.widget';
|
5
src/widgets/navbar/navbar.widget.tsx
Normal file
5
src/widgets/navbar/navbar.widget.tsx
Normal file
@ -0,0 +1,5 @@
|
||||
const Navbar = () => {
|
||||
return <></>;
|
||||
};
|
||||
|
||||
export default Navbar;
|
0
src/widgets/navbar/styles.module.scss
Normal file
0
src/widgets/navbar/styles.module.scss
Normal file
Loading…
Reference in New Issue
Block a user