From 1b97b263045353479c00c4b47c09a5e090f7a4f1 Mon Sep 17 00:00:00 2001 From: Neeraj Rekwar <88387699+neerajrekwar@users.noreply.github.com> Date: Sun, 7 Jul 2024 14:27:38 +0000 Subject: [PATCH] fdsa --- app/add.css | 18 +++ app/blog/layout.tsx | 11 ++ app/blog/page.tsx | 10 +- app/components/StickyRelativeDemo.tsx | 117 +++++++++----------- app/components/acceries/DotCircle.tsx | 2 +- app/components/backgroundBeams.tsx | 84 +++++++------- app/components/demo.tsx | 12 ++ app/components/infiniteCard.tsx | 2 +- app/components/reviewSection.tsx | 18 --- app/components/typeWriter.tsx | 6 +- app/components/ui/infinite-moving-cards.tsx | 6 +- app/components/ui/typewriter-effect.tsx | 2 +- app/globals.css | 36 ++++-- app/layout.tsx | 6 +- app/page.tsx | 12 +- package-lock.json | 59 ++++++++++ package.json | 1 + tailwind.config.ts | 12 +- 18 files changed, 261 insertions(+), 153 deletions(-) create mode 100644 app/blog/layout.tsx create mode 100644 app/components/demo.tsx delete mode 100644 app/components/reviewSection.tsx diff --git a/app/add.css b/app/add.css index 6a1ee1a11..d02521385 100644 --- a/app/add.css +++ b/app/add.css @@ -2,7 +2,25 @@ @tailwind components; @tailwind utilities; +:root { + --color-primary: #ffffff; + --color-secondary: #416165; + --color-third: #B3FFB3; + --color-gray-light: #D1FFD7; + --color-dark: #FFC800; + --color-dark-light: #101010; +} +/* Dark mode variables */ +@media (prefers-color-scheme: dark) { + :root { + --color-primary: #0a0a0a; + --color-secondary: #3C6E71; + --color-white: #ffffff; + --color-gray-light: #D9D9D9; + --color-dark: #284B63; + } +} .workSecion{ background-image: url(../public/workSection.svg); diff --git a/app/blog/layout.tsx b/app/blog/layout.tsx new file mode 100644 index 000000000..0cb5b6938 --- /dev/null +++ b/app/blog/layout.tsx @@ -0,0 +1,11 @@ +export default function DashboardLayout({ + children, // will be a page or nested layout + }: { + children: React.ReactNode + }) { + return ( +
+ {children} +
+ ) + } \ No newline at end of file diff --git a/app/blog/page.tsx b/app/blog/page.tsx index b70522332..ac722708f 100644 --- a/app/blog/page.tsx +++ b/app/blog/page.tsx @@ -1,4 +1,10 @@ +import Demo from "../components/demo"; // `app/page.tsx` is the UI for the `/` URL -export default function Page() { - return

Hello, blog page!

; + +export default function blog() { + return( +
+ +
+ ) ; } diff --git a/app/components/StickyRelativeDemo.tsx b/app/components/StickyRelativeDemo.tsx index 1cebaa75e..fe8254ab5 100644 --- a/app/components/StickyRelativeDemo.tsx +++ b/app/components/StickyRelativeDemo.tsx @@ -1,30 +1,38 @@ "use client"; import { NextPage } from "next"; import Image from "next/image"; -import DotCircle from "./acceries/DotCircle"; import Link from "next/link"; +import { Source_Code_Pro } from "next/font/google"; + + +const source_Code_Pro = Source_Code_Pro({ + weight: '400', + subsets: ['latin'], +}); const StickyRelativeDemo: NextPage = () => { return ( -
-
- +
+
+
•
Recent projects
-
+ +
-
- 2021 +
+ 2024
-
-

+
+

Craft & Code: Building the Future, One Line at a Time

-

+

+

Lorem ipsum dolor sit amet consectetur adipisicing elit. Repudiandae quo natus accusantium eius molestiae expedita possimus accusamus, aspernatur, quia quae asperiores @@ -32,30 +40,25 @@ const StickyRelativeDemo: NextPage = () => { inventore porro?

-
-
    -
  • Role
    • +
+
+
    +
  • Role
  • Digital Marketing
-
    -
  • Deliverables
    • +
      +
    • Deliverables
    • Survey checks
    -
      -
    • Company
      • +
        +
      • Company
      • Veecrew Market Research pvt. ltd.
      -
        -
      • Visit Site
        • +
          +
        • Visit Site
        • - - Veecrew + +
        @@ -64,8 +67,8 @@ const StickyRelativeDemo: NextPage = () => {
-
- showcase +
+ Showcase
{
-
+
-
- 2021 +
+ 2024
-
-

+
+

Craft & Code: Building the Future, One Line at a Time

-

+

+

Lorem ipsum dolor sit amet consectetur adipisicing elit. Repudiandae quo natus accusantium eius molestiae expedita possimus accusamus, aspernatur, quia quae asperiores @@ -113,40 +117,25 @@ const StickyRelativeDemo: NextPage = () => { inventore porro?

-
-
    -
  • Role
    • +
+
+
    +
  • Role
  • Digital Marketing
-
    -
  • Deliverables
    • +
      +
    • Deliverables
    • Survey checks
    -
      -
    • Company
      • +
        +
      • Company
      • Veecrew Market Research pvt. ltd.
      -
        -
      • Visit Site
        • +
          +
        • Visit Site
        • - - - - - - - + +
        @@ -155,8 +144,8 @@ const StickyRelativeDemo: NextPage = () => {
-
- showcase +
+ Showcase
{ cx="50" cy="50" r="10" - fill="#3C6E71" + fill="#679436" animate={{ opacity: [1, 0, 1] }} transition={{ duration: 2, loop: Infinity, ease: "easeInOut" }} /> diff --git a/app/components/backgroundBeams.tsx b/app/components/backgroundBeams.tsx index 55023b56d..705a0466d 100644 --- a/app/components/backgroundBeams.tsx +++ b/app/components/backgroundBeams.tsx @@ -21,22 +21,25 @@ export function BackgroundBeamsDemo() { className="relative z-10 md:pb-4 text-2xl sm:text-lg md:text-7xl bg-clip-text text-transparent bg-gradient-to-b from-neutral-200 to-neutral-600 text-left font-sans font-bold" > - Build the right to way
- with
+ Build the right to way
+
+ with 
+              
+
- - - + + +

+ - + - Get started - + Get started + + - - Learn more - + Learn more + +
diff --git a/app/components/demo.tsx b/app/components/demo.tsx new file mode 100644 index 000000000..0e6901dc2 --- /dev/null +++ b/app/components/demo.tsx @@ -0,0 +1,12 @@ +export default function Demo() { + return ( +
+
+

Lorem ipsum dolor.

+

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Illo doloremque quasi minima quod perspiciatis facilis recusandae, vel quae ipsam dolores ullam voluptates quam quas eum tenetur odio explicabo enim assumenda.

+
+ +
+ ); + +} \ No newline at end of file diff --git a/app/components/infiniteCard.tsx b/app/components/infiniteCard.tsx index 2702acfa2..f029e2821 100644 --- a/app/components/infiniteCard.tsx +++ b/app/components/infiniteCard.tsx @@ -5,7 +5,7 @@ import { InfiniteMovingCards } from "./ui/infinite-moving-cards"; export function InfiniteMovingCardsDemo() { return ( -
+
-
-
- - - Recent projects - -
- -
- - ) -} \ No newline at end of file diff --git a/app/components/typeWriter.tsx b/app/components/typeWriter.tsx index 6fa8a1ef9..b8c7ba15f 100644 --- a/app/components/typeWriter.tsx +++ b/app/components/typeWriter.tsx @@ -18,13 +18,13 @@ export function TypewriterEffectSmoothDemo() { }, { text: "neeraj rekwar.", - className: "text-dark", + className: "text-third", }, ]; return ( -
+
-

+

The road to make unique from here

diff --git a/app/components/ui/infinite-moving-cards.tsx b/app/components/ui/infinite-moving-cards.tsx index a1e19ede2..a2b265e12 100644 --- a/app/components/ui/infinite-moving-cards.tsx +++ b/app/components/ui/infinite-moving-cards.tsx @@ -73,7 +73,7 @@ export const InfiniteMovingCards = ({
@@ -87,10 +87,10 @@ export const InfiniteMovingCards = ({ > {items.map((item, idx) => (
  • diff --git a/app/components/ui/typewriter-effect.tsx b/app/components/ui/typewriter-effect.tsx index 80920a244..8e1ca41df 100644 --- a/app/components/ui/typewriter-effect.tsx +++ b/app/components/ui/typewriter-effect.tsx @@ -124,7 +124,7 @@ export const TypewriterEffectSmooth = ({ {word.text.map((char, index) => ( {char} diff --git a/app/globals.css b/app/globals.css index d4d492439..3405ef36c 100644 --- a/app/globals.css +++ b/app/globals.css @@ -4,22 +4,38 @@ @import './add.css'; :root { - --color-primary: #ffffff; - --color-secondary: #416165; - --color-third: #B3FFB3; - --color-gray-light: #D1FFD7; - --color-dark: #FFC800; - --color-dark-light: #101010; + --color-primary: #EBF2FA; + /* bg */ + --color-secondary: #427AA1; + /* */ + --color-third: #dbd800; + /* */ + --color-four: #5e705e; + /* */ + --color-primary-text: #242424; + /* */ + --color-secondary-text: #323635; + /* */ + --color-third-text: #0a0a0a; + } /* Dark mode variables */ @media (prefers-color-scheme: dark) { :root { --color-primary: #0a0a0a; - --color-secondary: #3C6E71; - --color-white: #ffffff; - --color-gray-light: #D9D9D9; - --color-dark: #284B63; + /* */ + --color-secondary: #4880a8; + /* */ + --color-third: #05668D; + /* */ + --color-four: #679436; + /* */ + --color-primary-text: #e7e7e7; + /* */ + --color-secondary-text: #d2e0dd; + /* */ + --color-third-text: #f8f8f8; } } diff --git a/app/layout.tsx b/app/layout.tsx index 02eba66bf..c0df82288 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -1,5 +1,5 @@ -import { Alata } from "next/font/google"; +import { Alata, Source_Code_Pro } from "next/font/google"; import "./globals.css"; import "./add.css"; import { FloatingNavDemo } from "./components/floatingNavBar"; @@ -10,6 +10,10 @@ const alata = Alata({ subsets: ['latin'], }); +const source_Code_Pro = Source_Code_Pro({ + weight: '400', + subsets: ['latin'], +}); export default function RootLayout({ children, diff --git a/app/page.tsx b/app/page.tsx index dde3cd27d..7189123a0 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -2,8 +2,8 @@ import type { Metadata } from "next"; import HomeSectionHeader from "./components/homeSectionHeader"; import AdminWeather from "./components/AdminWeather"; import IntroSection from "./components/introSection"; -import ReviewSection from "./components/reviewSection"; import DeviceAddress from "./components/DeviceAddress"; +import { InfiniteMovingCardsDemo } from "./components/infiniteCard"; export const metadata: Metadata = { title: "nee. - Portfolio Framer Template For Freelancers", @@ -12,21 +12,21 @@ export const metadata: Metadata = { export default function Home() { return ( -
    +
    -
    +
    -
    - +
    +
    -
    +
    Vision to learn
    diff --git a/package-lock.json b/package-lock.json index f2b7df9b0..8b4c18a08 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,6 +9,7 @@ "version": "0.1.0", "dependencies": { "@fingerprintjs/fingerprintjs": "^4.4.2", + "@material/web": "^1.5.1", "@nextui-org/navbar": "^2.0.30", "@nextui-org/react": "^2.3.6", "@nextui-org/system": "^2.1.2", @@ -361,6 +362,31 @@ "@jridgewell/sourcemap-codec": "^1.4.14" } }, + "node_modules/@lit-labs/ssr-dom-shim": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/@lit-labs/ssr-dom-shim/-/ssr-dom-shim-1.2.0.tgz", + "integrity": "sha512-yWJKmpGE6lUURKAaIltoPIE/wrbY3TEkqQt+X0m+7fQNnAv0keydnYvbiJFP1PnMhizmIWRWOG5KLhYyc/xl+g==" + }, + "node_modules/@lit/reactive-element": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/@lit/reactive-element/-/reactive-element-2.0.4.tgz", + "integrity": "sha512-GFn91inaUa2oHLak8awSIigYz0cU0Payr1rcFsrkf5OJ5eSPxElyZfKh0f2p9FsTiZWXQdWGJeXZICEfXXYSXQ==", + "dependencies": { + "@lit-labs/ssr-dom-shim": "^1.2.0" + } + }, + "node_modules/@material/web": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@material/web/-/web-1.5.1.tgz", + "integrity": "sha512-S9iQV1Biq6JhNpAkqXcsFdVrLW0BC1Tez8C36MEQ/VuhT3YLQySbJkUiG+1U+J1jUqlsG8fT5XsEFbhomCY39w==", + "workspaces": [ + "catalog" + ], + "dependencies": { + "lit": "^2.7.4 || ^3.0.0", + "tslib": "^2.4.0" + } + }, "node_modules/@next/env": { "version": "14.2.3", "resolved": "https://registry.npmjs.org/@next/env/-/env-14.2.3.tgz", @@ -3693,6 +3719,11 @@ "tailwindcss": "*" } }, + "node_modules/@types/trusted-types": { + "version": "2.0.7", + "resolved": "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.7.tgz", + "integrity": "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==" + }, "node_modules/@typescript-eslint/parser": { "version": "7.2.0", "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-7.2.0.tgz", @@ -6445,6 +6476,34 @@ "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz", "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==" }, + "node_modules/lit": { + "version": "3.1.4", + "resolved": "https://registry.npmjs.org/lit/-/lit-3.1.4.tgz", + "integrity": "sha512-q6qKnKXHy2g1kjBaNfcoLlgbI3+aSOZ9Q4tiGa9bGYXq5RBXxkVTqTIVmP2VWMp29L4GyvCFm8ZQ2o56eUAMyA==", + "dependencies": { + "@lit/reactive-element": "^2.0.4", + "lit-element": "^4.0.4", + "lit-html": "^3.1.2" + } + }, + "node_modules/lit-element": { + "version": "4.0.6", + "resolved": "https://registry.npmjs.org/lit-element/-/lit-element-4.0.6.tgz", + "integrity": "sha512-U4sdJ3CSQip7sLGZ/uJskO5hGiqtlpxndsLr6mt3IQIjheg93UKYeGQjWMRql1s/cXNOaRrCzC2FQwjIwSUqkg==", + "dependencies": { + "@lit-labs/ssr-dom-shim": "^1.2.0", + "@lit/reactive-element": "^2.0.4", + "lit-html": "^3.1.2" + } + }, + "node_modules/lit-html": { + "version": "3.1.4", + "resolved": "https://registry.npmjs.org/lit-html/-/lit-html-3.1.4.tgz", + "integrity": "sha512-yKKO2uVv7zYFHlWMfZmqc+4hkmSbFp8jgjdZY9vvR9jr4J8fH6FUMXhr+ljfELgmjpvlF7Z1SJ5n5/Jeqtc9YA==", + "dependencies": { + "@types/trusted-types": "^2.0.2" + } + }, "node_modules/locate-path": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz", diff --git a/package.json b/package.json index 947c5b9e5..283b1e3aa 100644 --- a/package.json +++ b/package.json @@ -11,6 +11,7 @@ }, "dependencies": { "@fingerprintjs/fingerprintjs": "^4.4.2", + "@material/web": "^1.5.1", "@nextui-org/navbar": "^2.0.30", "@nextui-org/react": "^2.3.6", "@nextui-org/system": "^2.1.2", diff --git a/tailwind.config.ts b/tailwind.config.ts index 810b9db4f..2ec93bab2 100644 --- a/tailwind.config.ts +++ b/tailwind.config.ts @@ -13,7 +13,7 @@ module.exports = { "./app/**/*.{js,ts,jsx,tsx,mdx}", "./node_modules/@nextui-org/theme/dist/components/[object Object].js", ], - darkMode: ["class" , "selector"], + darkMode: "selector", theme: { extend: { backgroundImage: { @@ -22,9 +22,13 @@ module.exports = { colors: { primary: "var(--color-primary)", secondary: "var(--color-secondary)", - white: "var(--color-white)", - grayLight: "var(--color-gray-light)", - dark: "var(--color-dark)", + third: "var(--color-third)", + four: "var(--color-four)", + five: "var(--color-five)", + six: "var(--color-six)", + primaryText: "var(--color-primary-text)", + thirdText: "var(--color-third-text)", + secondaryText: "var(--color-secondary-text)" }, animation: { aurora: "aurora 60s linear infinite",