karaka-management / cssoms Goto Github PK

Create a list where the bullet points are icons. These icons should have dynamic sizes. The text for each bullet point should be vertically centered for this bullet point or optionally top!

At the same time this list should allow a version where the text can be left and then right alternating to the bullet point. Like some of the online CVs. These Bullet points should be connected by a line (same color as the bullet point border).

Create a slider element incl. a slider with two sliders.

This slider will require JS for sure in order to update the figures and store the in a hidden input field.

Create a custom css drop down/select element. This can be used for example for the Unit switching.

Currently input elements which are disabled look the same as normal elements. This needs to be fixed.

Somehow this causes the main flex to not work properly (example tasks and click edit and make windows smaller to see the nav side bar freak out) somehow the overflow-x is messing something up.

For many elements a email like address bar is required.

Example:
The "input" element contains e.g. the group name. on hover it shows a list or popup of all accounts part of this group. In a hidden element right afterwards it contains the group id. This input element should be able to contain multiple groups and maybe even a small + sign after each group for mobile users that can be clicked for showing all accounts part of this group.

see Outlook email address bar.

The input validation looks really bad. Potential draft layout could be:

Consider using red outlines for invalid input validation.

Also consider to give positive feedback to the user (optional).

Flexbox is not used right now but should definately be used more often. This may especially be a nicer solution for the boxes.

This should enhance the experience for mobile users.

A page containing all components helps with styling them and adjust them so they have a good harmony.

Components should be:

• Forms
• Slider
• All form elements (with validation and without)
• Page tables
• Check boxes
• Drop down fields
• Articles
• Tags
• Image slider
• Content boxes (e.g. for forms etc)

A sample of how the forms (with some form elements) could look like:

At many places input fields are used with tags below them. The current layout is really bad. Maybe a better draft layout could be the following:

Upon clicking on the right + more tags should be shown if there are more. If no more tags are available this button is hidden.

The input field itself should be able to choose from pre-defined key-value pairs or make remote requests to get them:

Mobile tables looks horrible. Fix!

Remove double border for last element.

The fixed layout makes it so that a 2 column table takes 50% content for each column. This looks bad if the second column only contains a small button. A lot of space is wasted.

This behavior shouldn't be the case. Fixed layout shouldn't do this. Something else must be causing this in combination.

Create a drop down field with a search bar and a scroll bar for many results.

[Readme] Improve readme

The placeholder is a little bit too dominant. Users might confuse it with a default value.