Vodafone-ng Angular UI framework of Vodafone Egypt

UI framework based on Angular framework check Demo here Vodafone-ng Demo.

Vodafone-ng

Mobile-ready components for faster and easier web development. is high-performance,accessible and fully customizable UI Components. All components are designed with extensibility and adaptivity in mind.

Features

• +118 Components of native components built with Angular and Typescript to use it for all your business logic requirements
• Tinker-friendly code customizable native Angular CLI application templates to get you started in no time.
• Enhanced mobile user experience with touch optimized responsive design elements.
• look&feel Choose from a dark or light or any different customized theme.
• Good documentation a lot of demos and previews for the components in many options which enable you cover all use cases

Dependencies

Vodafone-ng uses a number of open source plugins and libraries with MIT License (MIT) to complete the whole experience and fit all business uses cases

• Angular CLI: Angular is SPA Framework for building mobile and desktop web applications.
• Ngx-translate: The internationalization (i18n) library for Angular.
• Google Maps: Contains type definitions for Google Maps JavaScript API.
• Chart.js: Simple yet flexible JavaScript charting for designers & developers.
• Prime Icons: Font Icon Library for VodafoneNG
• Prime Flex: is a lightweight responsive CSS grid system optimized for all screen sizes

Installation

Requires Node.js at least v14.18.1 or above and NPM v6.14.15 or Above installed globally

npm install vodafone-ng

Usage

Styles Import

you should import the main CSS file of the framework into your global SCSS file

@import 'node_modules/vodafone-ng/resources/vodafone-ng.min.css';

and import one of the provided themes and by default the framework use vodafone light theme

@import 'node_modules/vodafone-ng/resources/themes/vodafone/light/theme.css';

and should after that import all the dependencies for grid system and font icons

@import 'node_modules/primeicons/primeicons.css';
@import 'node_modules/primeflex/primeflex.min.css';

Modules Import

you can import what you need of UI module in your application to use it for demo visit this link Vodafone-ng Demo.