✨ Make a cheatsheet style list

[szepeviktor]

It would be nice to have a visually smaller list on the website.

Emoji	Code	Commit type
:art:	:art:	Improving structure / format of the code.
:zap:	:zap:	Improving performance.
:fire:	:fire:	Removing code or files.
:bug:	:bug:	Fixing a bug.
:ambulance:	:ambulance:	Critical hotfix.
:sparkles:	:sparkles:	Introducing new features.
:pencil:	:pencil:	Writing docs.
:rocket:	:rocket:	Deploying stuff.
:lipstick:	:lipstick:	Updating the UI and style files.
:tada:	:tada:	Initial commit.
:white_check_mark:	:white_check_mark:	Updating tests.
:lock:	:lock:	Fixing security issues.
:apple:	:apple:	Fixing something on macOS.
:penguin:	:penguin:	Fixing something on Linux.
:checkered_flag:	:checkered_flag:	Fixing something on Windows.
:robot:	:robot:	Fixing something on Android.
:green_apple:	:green_apple:	Fixing something on iOS.
:bookmark:	:bookmark:	Releasing / Version tags.
:rotating_light:	:rotating_light:	Removing linter warnings.
:construction:	:construction:	Work in progress.
:green_heart:	:green_heart:	Fixing CI Build.
:arrow_down:	:arrow_down:	Downgrading dependencies.
:arrow_up:	:arrow_up:	Upgrading dependencies.
:pushpin:	:pushpin:	Pinning dependencies to specific versions.
:construction_worker:	:construction_worker:	Adding CI build system.
:chart_with_upwards_trend:	:chart_with_upwards_trend:	Adding analytics or tracking code.
:recycle:	:recycle:	Refactoring code.
:whale:	:whale:	Work about Docker.
:heavy_plus_sign:	:heavy_plus_sign:	Adding a dependency.
:heavy_minus_sign:	:heavy_minus_sign:	Removing a dependency.
:wrench:	:wrench:	Changing configuration files.
:globe_with_meridians:	:globe_with_meridians:	Internationalization and localization.
:pencil2:	:pencil2:	Fixing typos.
:poop:	:poop:	Writing bad code that needs to be improved.
:rewind:	:rewind:	Reverting changes.
:twisted_rightwards_arrows:	:twisted_rightwards_arrows:	Merging branches.
:package:	:package:	Updating compiled files or packages.
:alien:	:alien:	Updating code due to external API changes.
:truck:	:truck:	Moving or renaming files.
:page_facing_up:	:page_facing_up:	Adding or updating license.
:boom:	:boom:	Introducing breaking changes.
:bento:	:bento:	Adding or updating assets.
:ok_hand:	:ok_hand:	Updating code due to code review changes.
:wheelchair:	:wheelchair:	Improving accessibility.
:bulb:	:bulb:	Documenting source code.
:beers:	:beers:	Writing code drunkenly.
:speech_balloon:	:speech_balloon:	Updating text and literals.
:card_file_box:	:card_file_box:	Performing database related changes.
:loud_sound:	:loud_sound:	Adding logs.
:mute:	:mute:	Removing logs.
:busts_in_silhouette:	:busts_in_silhouette:	Adding contributor(s).
:children_crossing:	:children_crossing:	Improving user experience / usability.
:building_construction:	:building_construction:	Making architectural changes.
:iphone:	:iphone:	Working on responsive design.
:clown_face:	:clown_face:	Mocking things.
:egg:	:egg:	Adding an easter egg.
:see_no_evil:	:see_no_evil:	Adding or updating a .gitignore file
:camera_flash:	:camera_flash:	Adding or updating snapshots
:alembic:	:alembic:	Experimenting new things
:mag:	:mag:	Improving SEO
:wheel_of_dharma:	:wheel_of_dharma:	Work about Kubernetes
:label:	:label:	Adding or updating types (Flow, TypeScript)

[szepeviktor]

wget -qO- https://github.com/carloscuesta/gitmoji/raw/master/src/data/gitmojis.json | jq -r '.gitmojis[] | "| \(.code) | `\(.code)` | \(.description) |"'

[johannchopin]

Is the website not minimal enough concerning the presentation of the gitmojis? 🤔

[vhoyer]

Well, whenever I'm looking at files in the file explorer, I tend to use details mode because I like to search for things line by line, and if they are on a grid it makes it kinda uncomfortable for me :sweat_smile: so I see the point.

It's not a matter of minimalism, it's a matter of scanning, I think :thinking:... @szepeviktor, could you comment on the reasoning behind this request?

[szepeviktor]

The website is 6 pages in my 1200×1200 browser window. I'd like to see all gitmojis on the screen at the same time. Like a cheatsheet.

[johannchopin]

Ok I see, maybe just a toggle Button for 'grid' or 'raw' mode will do the job 🤔

[vhoyer]

@johannchopin, wanna have a project to organize this tasks?

[johannchopin]

@vhoyer Never use before but yeah looks amazing 👍

[johannchopin]

What do you think about this type of layout? 🤔

[vhoyer]

What do you think about this type of layout?

I think the table is super cute and I like it, but this does not takes the advantage of the wide screen OP mentioned, maybe we could add a media query to separate the "table" in two columns :D, what d'you think?

[johannchopin]

@vhoyer Yes great idea I opened a WIP PR #453 for this layout 👍