https://github.com/isur/video-chat-bubbles
Video Chat Bubbles that might be used for creating videos with messages like in the chat.
https://github.com/isur/video-chat-bubbles
Last synced: about 1 month ago
JSON representation
Video Chat Bubbles that might be used for creating videos with messages like in the chat.
- Host: GitHub
- URL: https://github.com/isur/video-chat-bubbles
- Owner: Isur
- Created: 2024-02-29T20:23:54.000Z (over 2 years ago)
- Default Branch: master
- Last Pushed: 2024-06-02T17:05:29.000Z (about 2 years ago)
- Last Synced: 2025-03-03T00:23:44.653Z (over 1 year ago)
- Language: TypeScript
- Homepage: https://video-chat-bubbles.vercel.app
- Size: 6.2 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Video Chat Bubble
Simple project to create a video chat bubble using Vite with React, TypeScript, Tailwind and Framer Motion.
## How to run
1. Clone the repository
2. Run `pnpm install` to install.
3. Run `pnpm dev` to start the development server.
or
4. Run `pnpm build` to build the project.
5. Run `pnpm preview` to preview the build.
## How to use
Open app and configure it to your needs.
Click START button to start the "chat".
Start typing and you will see the bubble with your message.
Click enter and start typing to create new bubble with next message.
Bubbles will dissapear after few seconds - as you set it up in configurator.
## Configurator
App have build in configurator to change some settings.
Configuration is saved in local storage.
You can change:
- Font size;
- Padding inside the bubble;
- Time for bubble to dissapear;
- Alignement of the bubble to right or left;
- Alignement of the bubble to top or bottom;
- Position of the configurator menu;
- Dark/light mode;
- Panels are resizable and by dragging you can change size of them;
## Notes
You can create notes that are stored in local storage.
## How it looks
