├── .eslintrc.json
├── .gitignore
├── README.md
├── components
├── Card_temp_2.jsx
└── Login.jsx
├── next.config.js
├── package-lock.json
├── package.json
├── pages
├── _app.js
├── api
│ └── hello.js
└── index.js
├── postcss.config.js
├── public
├── favicon.ico
├── side.jpg
├── thumb.svg
└── vercel.svg
├── showcase
├── s1.png
├── s2.png
├── s3.png
└── s4.png
├── styles
├── Home.module.css
└── globals.css
└── tailwind.config.js
/.eslintrc.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "next/core-web-vitals"
3 | }
4 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2 |
3 | # dependencies
4 | /node_modules
5 | /.pnp
6 | .pnp.js
7 |
8 | # testing
9 | /coverage
10 |
11 | # next.js
12 | /.next/
13 | /out/
14 |
15 | # production
16 | /build
17 |
18 | # misc
19 | .DS_Store
20 | *.pem
21 |
22 | # debug
23 | npm-debug.log*
24 | yarn-debug.log*
25 | yarn-error.log*
26 |
27 | # local env files
28 | .env.local
29 | .env.development.local
30 | .env.test.local
31 | .env.production.local
32 |
33 | # vercel
34 | .vercel
35 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 |
2 |
3 | Next.Js
5 |
6 |
7 |
8 |
9 |
10 |
11 |
13 |
14 |
16 |
17 |
19 |
20 |
21 |
23 |
24 |
26 |
27 |
28 |
30 |
31 |
32 |
33 |
34 | # Project Name : Tailwind Card Component
35 |
36 | This is just a card commponent using tailwind css. it just awesome.
37 |
38 | # Technologies
39 |
40 | - Next.Js
41 | - React.Js
42 | - Tailwind Css
43 | - heroicons
44 | - React-icons
45 | - JavaScript
46 | - Visual Studio Code
47 | - Git & GitHub
14 |
15 |
16 |
FREE
17 |
18 |
19 |
27 |
28 |
29 |
30 |
Advanced
31 |
32 | React Native with TypeScript tutorial.
33 |
34 |
35 |
36 |
37 |
React Native
39 |
40 |
41 |
TypeScript
43 |
44 |
48 |
49 |
5 Part
51 |
52 |
53 |
54 |
55 |
56 |
58 | Start Learning Now
59 |
60 |
61 | settoggle(!toggle)}
64 | >
65 | {toggle ? (
66 |
71 |
72 |
73 |
9 |
10 |
12 |
13 |
14 |
valorant
15 |
16 |
17 |
22 |
23 |
24 |
25 | Create an Account
26 |
27 |
28 |
Card
14 |
18 |
19 | {/*comment out the uper one and uncomment the below one*/}
20 |
21 | {/*
24 |
25 |
26 | )
27 | }
28 |
--------------------------------------------------------------------------------
/postcss.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | plugins: {
3 | tailwindcss: {},
4 | autoprefixer: {},
5 | },
6 | }
7 |
--------------------------------------------------------------------------------
/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Pavitra554/Tailwind-css-card-component/50316346ab8cac1f7635ba1e802a4b3cade51942/public/favicon.ico
--------------------------------------------------------------------------------
/public/side.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Pavitra554/Tailwind-css-card-component/50316346ab8cac1f7635ba1e802a4b3cade51942/public/side.jpg
--------------------------------------------------------------------------------
/public/thumb.svg:
--------------------------------------------------------------------------------
1 | 
4 | 
52 | 
53 | 
54 | 
55 |
56 | # Some important information about Next.Js
57 | ## Getting Started
58 |
59 | First, run the development server:
60 |
61 | ```bash
62 | npm run dev
63 | # or
64 | yarn dev
65 | ```
66 |
67 | Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
68 |
69 | You can start editing the page by modifying `pages/index.js`. The page auto-updates as you edit the file.
70 |
71 | [API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.js`.
72 |
73 | The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
74 |
75 | ## Learn More
76 |
77 | To learn more about Next.js, take a look at the following resources:
78 |
79 | - [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
80 | - [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
81 |
82 | You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
83 |
84 | ## Some important information about Tailwind Css with Next.js
85 | Step-1 First create a next app