We are creating a next generation car dealer management solution with Web UI (Angular 6 with Clarity)
We are looking for: Senior Frontend Developer Angular:
- Expert Knowhow in Frontend development with AngularJS, TypeScript, (S)CSS.
- Experience creating UI-components for modular Web applications
- Creating components for the Clarity-Framework
- Project language english or german
+ Implement Toast messages/notification component for Clarity
See Feature Request: https://github.com/vmware/clarity/issues/365
+ Demopage documenting the component containing:
- Code Examples/Snippets, documentation of Summary of Options
- Living Styleguide Example/Demopage showing the different features
similar to Clarity eg. Datagrid (batch action, expandable rows, full demo), ...
+ auto-hide notification after a configurable amount of seconds (timeout)
+ support for different types of notifications (see clarity alert types)
error, warning, info, and success.
+ multiple toast messages are stacked, new items appear on top
+ Message body: support for variable content - text, icons, links, actions with dropdown ...
+ Close option (x, similar to dismissable alerts, should be parameterized)
+ Positioning: default top-center
+ Progress bar at top of notification, progressing according to remaining display time (show progress bar should be parameterized: true/false)
+ If some modal is open (wizard/dialog), toast message must appear on top of the backdrop.
+ Any component should be able to add notifications to one global container
+ closed: emit event either when timeout reached or dismissable is triggered by user.
+ Message body
+ styling should match clarity App-Level Alerts,
restyling scss must be possible, theming must be supported.
+ simple animation on appear/disappear (fade-in from top/fade-out)
+ progress bar styling should be similar to progress bar on top of the card component.
Images or animations with mocks showing the design and interactions
- visual style matching clarity’s applevel alerts, in this case warning
- dismiss-able on close link
- progress bar on top
(see attachment: toast-notification_progress.gif),
- stacking: new toast notification slide in from the top.
- different types: info, warning
(see attachment: toast-notification_stacking.gif)
If some modal is open (wizard/dialog), toast message must appear on top of the backdrop.
Hours to be determined
Less than 1 month< 1 monthProject LengthDuration
I am willing to pay higher rates for the most experienced freelancers