JQuery and CSS/HTML enhancements to application toolbar
We have a windows desktop application which runs Embedded Chrome
The dynamic menu of the application is implemented in HTML/JQUERY/CSS
We need to make enhancements to the toolbar according to design.
All files are attached.
PSD files - toolbar design
app_toolbar.zip - contains all toolbar files
inside of it
UI elements, features and behavior:
1. Buttons - Back button, minimize, maximize & close buttons, as well as two categories navigation buttons. The back button
allows to go back to the last page you were at (like in any browser), and the two navigation buttons allows to skip between the
categories and to use & customize the next group.
2. Customization - drug n' drop as works currently. Customization should be possible for setting the order of the categories or
for setting the order of the links inside the categories.
3. Responsive - the UI should be responsive to re sizing.
4. Mouse over - the sketch 52(5) reflects the state of the UI without mouse over effect, when the mouse over effect is visible
on 52(4). In words:
a) on categories creates black gradient and the blue line below.
b) on links create a black gradient and the text turns into blue.
c) on the button (X_, back and categories navigation buttons) the mouse over creates a black gradient and the button turns
5. Search box - when typing in the search box, the search box is highlighted with the blue color (as shown on 52(4)).
6. Categories - if its too much to have 6 categories visible, you can feel free to remove one.
We want it to move and feel as smooth and clean as possible. Please let me know if you have any question, comment, or any
problem with any of the mentioned requirements.
Of course please let me know if you need anything in addition.