Product Promotion
0x5a.live
for different kinds of informations and explorations.
GitHub - ngx-semantic/ngx-semantic: A new take on an Angular implementation for Semantic UI
A new take on an Angular implementation for Semantic UI - ngx-semantic/ngx-semantic
Visit SiteGitHub - ngx-semantic/ngx-semantic: A new take on an Angular implementation for Semantic UI
A new take on an Angular implementation for Semantic UI - ngx-semantic/ngx-semantic
Powered by 0x5a.live 💗
Introduction
Angular and jQuery don't go together - this is the fundamental principle of this library. It provides Angular component versions of the Semantic UI elements, views and modules, so that you don't need to add jQuery to your app.
NOTE: Unlike most other angular libraries that provide Semantic UI support, this library covers much more than the Semantic UI modules. It also provides Angular wrappers for the Elements, Collections, as well as Views.
Looking for help!
There is a lot to do and few maintainers with little time :). If you'd like to help with this project, please let us know.
NgxSemantic is the Angular integration for Semantic UI. It is highly inspired by Semantic UI React and Semantic UI Vue NgxSemantic is still under heavy development. Please, feel free to contribute to the codebase or to the documentation.
🚀 Installation
See the Documentation for installation instructions and extensive examples.
Dependencies
- Angular (>=9.0.0)
- Semantic UI CSS (>=2.4.1) (jQuery is not required)
Component Support
| Icon | Description |
|---|---|
| :white_check_mark: | Component supported by ngx-semantic. |
| :rocket: | Semantic UI plugin supported by ngx-semantic (not in Semantic UI Core). |
| :x: | Component currently unavailable. |
| :no_entry_sign: | Component not applicable to Angular. |
| Elements | Collections | Views | Modules | Behaviors |
|---|---|---|---|---|
| :white_check_mark: Button | :white_check_mark: Breadcrumb | :white_check_mark: Advertisement | :white_check_mark: Accordion | :no_entry_sign: API |
| :white_check_mark: Container | :white_check_mark: Form | :white_check_mark: Card | :white_check_mark: Checkbox | :no_entry_sign: Form Validation |
| :white_check_mark: Divider | :white_check_mark: Grid | :white_check_mark: Comment | :white_check_mark: Dimmer | :x: Visibility |
| :white_check_mark: Flag | :white_check_mark: Menu | :white_check_mark: Feed | :white_check_mark: Dropdown | |
| :white_check_mark: Header | :white_check_mark: Message | :white_check_mark: Item | :white_check_mark: Embed | |
| :white_check_mark: Icon | :white_check_mark: Table | :white_check_mark: Statistic | :white_check_mark: Modal | |
| :white_check_mark: Image | :white_check_mark: Popup | |||
| :white_check_mark: Input | :white_check_mark: Progress | |||
| :white_check_mark: Label | :white_check_mark: Rating | |||
| :white_check_mark: List | :white_check_mark: Search | |||
| :white_check_mark: Loader | :rocket: Select | |||
| :white_check_mark: Rail | :x: Shape | |||
| :white_check_mark: Reveal | :white_check_mark: Sidebar | |||
| :white_check_mark: Segment | :x: Sticky | |||
| :white_check_mark: Step | :white_check_mark: Tab | |||
| :x: Transition |
Development
To generate all library files:
$ yarn build:local
Testing
To run the unit tests suite:
$ yarn test
License
MIT © Ngx-Semantic Team
Angular Resources
are all listed below.
Made with ❤️
to provide different kinds of informations and resources.