https://github.com/sanjaraiy/toggle_btn
This repository features a React-based Toggle Button for enabling dark mode. Switch effortlessly between light and dark themes with style! 🚀🎨
https://github.com/sanjaraiy/toggle_btn
html5 javascript reactjs tailwind-css toggle-buttons vite
Last synced: 28 days ago
JSON representation
This repository features a React-based Toggle Button for enabling dark mode. Switch effortlessly between light and dark themes with style! 🚀🎨
- Host: GitHub
- URL: https://github.com/sanjaraiy/toggle_btn
- Owner: sanjaraiy
- Created: 2023-10-27T06:41:09.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-01-28T18:37:42.000Z (over 2 years ago)
- Last Synced: 2025-02-23T14:43:50.410Z (over 1 year ago)
- Topics: html5, javascript, reactjs, tailwind-css, toggle-buttons, vite
- Language: JavaScript
- Homepage:
- Size: 42 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Toggle Feature In React.js
This project is built on `JavaScript`, `Tailwind CSS` and `React.js` .It is useful for enabling the dark and light mode feature in the React created card.
## Install Vite :-
```
npm latest@vite
```
## NPM Json Package Install :-
```
npm install
```
## Tailwind Install Link :-
```
npm install -D tailwindcss
npx tailwindcss init
```
## Tailwind Configure your template paths :-
```
module.exports = {
content: ["./src/**/*.{html,js}"],
theme: {
extend: {},
},
darkMode:"class",
plugins: [],
}
```
## Add the Tailwind directives to your CSS :-
```
@tailwind base;
@tailwind components;
@tailwind utilities;
```
## Install React-Redux :-
```
npm i react-redux
```