https://github.com/lumpinif/shadcn-resize-sidebar
A shadcn/ui Resizeable Sidebar
https://github.com/lumpinif/shadcn-resize-sidebar
resizeable shadcn shadn-ui sidebar ui
Last synced: 2 months ago
JSON representation
A shadcn/ui Resizeable Sidebar
- Host: GitHub
- URL: https://github.com/lumpinif/shadcn-resize-sidebar
- Owner: lumpinif
- License: mit
- Created: 2024-11-03T07:45:20.000Z (7 months ago)
- Default Branch: main
- Last Pushed: 2024-11-28T16:07:31.000Z (7 months ago)
- Last Synced: 2025-04-03T05:01:56.148Z (2 months ago)
- Topics: resizeable, shadcn, shadn-ui, sidebar, ui
- Language: TypeScript
- Homepage: https://shadcn-resize-sidebar.vercel.app
- Size: 434 KB
- Stars: 82
- Watchers: 1
- Forks: 4
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# A shadcn/ui Resizeable Sidebar
A extended shadcn-ui drag-to-resize `` component for Next.js applications with persisted state drag-to-resize functionality.
Demo: [shadcn-resize-sidebar.vercel.app](https://shadcn-resize-sidebar.vercel.app/)
## Features
- 🕶️ Extended everthing from shadcn-ui ``
- 🖱️ Drag to resize sidebar width
- 🔄 Collapsible sidebar with smooth transitions
- 🎨 Theme support (light/dark mode)
- ⌨️ Keyboard shortcuts
- 🍪 Persistent state with cookies
## Demo Stack
- Next.js 14
- TypeScript
- shadcn/ui
- Tailwind CSS
- Radix UI
## Getting Started
1. Clone the repository:
```bash
git clone https://github.com/lumpinif/drag-to-resize-sidebar.git
cd drag-to-resize-sidebar
```
2. Install dependencies:
```bash
bun install
```
3. Run the development server:
```bash
bun dev
```
4. Open [http://localhost:3000](http://localhost:3000) with your browser.
## Contributing
Pull requests are welcome.
## License
[MIT](https://choosealicense.com/licenses/mit/)