search

kobotoolbox / kpi

kpi is the (frontend) server for KoboToolbox. It includes an API for users to access data and manage their forms, question library, sharing settings, create reports, and export data.
https://www.kobotoolbox.org
GNU Affero General Public License v3.0
131 stars 176 forks source link

New KoBo Icon Library #3305

Open Ig-Rebollo opened 3 years ago

Ig-Rebollo commented 3 years ago

I have been working on a new custom icon library made from scratch (so we don't have to worry about copyrights and we expand the 'KoBo brand'). These icons are also full colour, as opposed to outline icons, so changes on hover are more obvious (since many of our icons are acting as action buttons, not just as decoration).

This file does not include the full list of icons yet, but the bulk of it is ready. I upload it so we can start testing them and see if any adjustments are necessary.

They are also slightly different to the ones we were using in terms of scale and layout. The previous ones had more margin and a smaller icon inside the frame, while the icons I created leave less space between the icon itself and the limits of the frame (which is also slightly smaller then the other frame, see screenshot below). image This means that if we simply replace one library for the other, the icons might look very big. Some small adjustments might be necessary in the CSS to adjust to the new proportions.

Here the file with the new KoBo Icons v.01 v.02: KoBo Icons v.02.zip

Ig-Rebollo commented 3 years ago

@magicznyleszek left the first badge of icons here. See my comments above. I think the most important ones are all there, but some might still be missing. There are also no replacements for the question type icons, which remain the same as the last SVG versions we used.

The important thing is to test how these new ones look like and see if we need any adjustments.

Ig-Rebollo commented 3 years ago

@duvld @magicznyleszek updated the file with the first batch of new icons (now is v.02). They are still the same size but at least now they are black and combined in a single vector.

I also included icons for pause, freeze column, audio file (for modal background), video file (for modal background if video image can't be loaded) and generic file (in case we need it for other things). For the 'play' button you can simply use the arrow_right icon.

duvld commented 3 years ago

@magicznyleszek @Ig-Rebollo what do you guys think about making a seperate repo for these? That way we can use github's versioning/releases and have sub-issues?

magicznyleszek commented 3 years ago

I guess we already have versioning in jsapp/svg-icons directory and issues here :) Unless you meant something else

magicznyleszek commented 2 years ago

Note: while working on that please have in mind the icon component idea: #3477

Ig-Rebollo commented 2 years ago

Here is the latest (expanded) set of icons. Still a few to go, but these should cover most cases Nov2021-icon_library.zip

magicznyleszek commented 1 year ago

This relies on finishing up #4109 too