https://github.com/theluqmn/propulsion-ui
A component library with a look inspired by the technicality and sophistication found inside an aircraft cockpit/flight deck.
https://github.com/theluqmn/propulsion-ui
cockpit component-library propulsion-ui solidjs solidjs-component
Last synced: 2 months ago
JSON representation
A component library with a look inspired by the technicality and sophistication found inside an aircraft cockpit/flight deck.
- Host: GitHub
- URL: https://github.com/theluqmn/propulsion-ui
- Owner: theluqmn
- Created: 2024-12-30T18:58:30.000Z (9 months ago)
- Default Branch: main
- Last Pushed: 2025-01-01T09:46:24.000Z (9 months ago)
- Last Synced: 2025-06-12T21:12:02.838Z (4 months ago)
- Topics: cockpit, component-library, propulsion-ui, solidjs, solidjs-component
- Language: JavaScript
- Homepage: https://theluqmn.github.io/propulsion-ui/
- Size: 136 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Propulsion UI
**Designed and developed by** [Luqman](https://theluqmn.github.io)
→ [Website](https://theluqmn.github.io/propulsion-ui/)
> [!NOTE]
> Propulsion UI is not yet ready for production use.
A component library with a look inspired by the technicality and sophistication found inside an aircraft cockpit/flight deck. Propulsion UI is originally built to standardise the components across my projects. Created using [SolidJS](https://www.solidjs.com) and [TailwindCSS](https://tailwindcss.com).
Propulsion UI has built-in support for light mode - simply include `light="true"` to the your components.
## Installation
1. Run `npm install @theluqmn/propulsion-ui`
2. Add the following to your `tailwind.config.js` file:
```js
module.exports = {
content: [
"./node_modules/@theluqmn/propulsion-ui/dist/**/*.js",
],
}
```
That's it really.
## Components
Below are a list of the components available in Propulsion UI:
### Text
- [x] Text
- [x] Text (solid)
- [x] Text with link
- [x] Text with heading
### Buttons
- [x] Button
- [x] Button (solid)
- [x] Button with inline text
### Frames
- [x] Frame
- [x] Frame (solid)
- [x] Frame with heading