neuro_llc/NwBlog
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Feat: chakra ui

Browse Source
This commit is contained in:
Sergey Elpashev
2025-01-22 17:02:12 +03:00
parent eb21d5f73d
commit bc5d6097db
11 changed files with 67 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/app/globals.css
View File

@@ -1,3 +0,0 @@
@tailwind base;
@tailwind components;
@tailwind utilities;

0
src/app/globals.scss Normal file
View File

6
src/app/layout.tsx
View File

@@ -1,7 +1,7 @@
import { Provider } from "@/components/ui/provider";
import type { Metadata } from "next";
import { Geist, Geist_Mono } from "next/font/google";
import "./globals.css";
import "./globals.scss";
import Providers from "./providers";
const geistSans = Geist({
variable: "--font-geist-sans",
@@ -26,7 +26,7 @@ export default function RootLayout({
return (
<html lang="ru" suppressHydrationWarning>
<body className={`${geistSans.variable} ${geistMono.variable} antialiased`}>
<Provider>{children}</Provider>
<Providers>{children}</Providers>
</body>
</html>
);

11
src/app/page.tsx
View File

@@ -1,11 +1,18 @@
"use client";
import { Button } from "@/components/ui/button";
import { useColorMode, useColorModeValue } from "@/components/ui/color-mode";
import { VStack } from "@chakra-ui/react";
export default function Home() {
const { toggleColorMode } = useColorMode();
const color = useColorModeValue("red", "blue");
return (
<VStack>
<Button>Test 1</Button>
<Button>Test 2</Button>
<Button onClick={toggleColorMode}>Test 1</Button>
<Button colorPalette={color} variant="solid">
{color}
</Button>
</VStack>
);
}

5
src/app/providers.tsx Normal file
View File

@@ -0,0 +1,5 @@
import { Provider } from "@/components/ui/provider";
export default function Providers(props: React.PropsWithChildren) {
return <Provider>{props.children}</Provider>;
}