Add developer documentation for what icons are used where

We should have documentation that defines which icons are used for specific things throughout the site. For example, we might want to say that fa-exclamation-circle is only to be used for things related specifically to Issues, fa-cubes is always for Builds, etc.

cc @dzaporozhets @axil @jschatz1 @skyruler

@rspeicher wouldn't this be directly decided by the designer? Would never have to decide this on our own I wouldn't think.

@jschatz1 oh lol it's decided by font awesome ;) but I like @rspeicher idea but maybe we should wait until we do new icons not sure

I agree with @rspeicher it should be defined/documented somewhere.

@skyruler I don't agree we should wait for new icons. This is problem that should be solved now.

@rspeicher maybe we make it a help page so we can actually render icons there? something like /help/icons where icons and definition listed. cc @jschatz1

@dzaporozhets if you want to document font awesome you can just copy and paste their website lol :)

@skyruler we are not documenting font awesome. We want to build a table where most used icons are explained.

Example:

• use fa-bookmark as project(s) entity
• use fa-exclamation-circle for issue(s)
• ..etc

@dzaporozhets Yes, exactly.

maybe we make it a help page so we can actually render icons there? something like /help/icons where icons and definition listed.

Or can we add it to /help/ui?

@rspeicher /help/ui sounds great.

@jschatz1 I think its kinda Frontend work to add existing icons and meaning on help page. I will put it to 8.8

Added frontend label

Milestone changed to 8.8

@rspeicher @dzaporozhets Thanks!

@dzaporozhets okay

Milestone changed to %8.9

Milestone changed to %Backlog

The UX Guide has 7 of the roughly 80 fontawesome icons that we use described. Should we add the other 73 there?

added ~19492 label

@winniehell thanks for resurfacing this issue We should definitely do this. I won't be able to document this now, but I'll keep it on my “bucket”.

@tauriedavis if you think a UXer can pick this up in the short term, feel free to direct this issue to them.

I have created a list (and manually removed fa-fw, fa-inverse, fa-lg and fa-spin):

fontawesome icons

grep -IhEro 'fa-[a-z-]+' app/ | sort -u | while read icon
do
  echo $icon
  grep -rl $icon app/
  echo
done

Run on 4a81867d:

fa-adjust
app/views/projects/diffs/_stats.html.haml

fa-angle-double-left
app/assets/javascripts/right_sidebar.js
app/assets/javascripts/merge_request_tabs.js

fa-angle-double-right
app/assets/javascripts/right_sidebar.js
app/assets/javascripts/merge_request_tabs.js
app/assets/javascripts/main.js

fa-angle-down
app/assets/javascripts/notes.js
app/assets/stylesheets/pages/projects.scss
app/views/projects/notes/_note.html.haml

fa-angle-left
app/assets/javascripts/aside.js
app/views/shared/_show_aside.html.haml

fa-angle-right
app/assets/javascripts/aside.js
app/assets/stylesheets/pages/tree.scss
app/views/projects/tree/_tree_content.html.haml

fa-angle-up
app/assets/javascripts/notes.js

fa-archive
app/views/projects/tree/_submodule_item.html.haml

fa-arrow-down
app/views/admin/logs/show.html.haml
app/views/help/_shortcuts.html.haml

fa-arrow-left
app/views/sherlock/transactions/show.html.haml
app/views/sherlock/queries/show.html.haml
app/views/sherlock/file_samples/show.html.haml
app/views/help/_shortcuts.html.haml

fa-arrow-right
app/assets/stylesheets/pages/builds.scss
app/views/help/_shortcuts.html.haml

fa-arrow-up
app/views/help/_shortcuts.html.haml

fa-ban
app/assets/javascripts/cycle_analytics/components/stage_review_component.js

fa-bell
app/assets/javascripts/notifications_dropdown.js
app/assets/stylesheets/pages/projects.scss

fa-bitbucket
app/views/import/bitbucket/status.html.haml

fa-bug
app/views/import/fogbugz/new_user_map.html.haml
app/views/import/fogbugz/status.html.haml
app/views/import/fogbugz/new.html.haml

fa-calendar
app/assets/javascripts/vue_pipelines_index/time_ago.js

fa-caret-down
app/assets/javascripts/vue_pipelines_index/stage.js
app/assets/javascripts/vue_pipelines_index/pipeline_actions.js
app/assets/javascripts/single_file_diff.js
app/assets/javascripts/environments/components/environment_actions.js
app/assets/stylesheets/framework/buttons.scss
app/assets/stylesheets/framework/forms.scss
app/assets/stylesheets/framework/nav.scss
app/assets/stylesheets/framework/header.scss
app/assets/stylesheets/pages/projects.scss
app/assets/stylesheets/pages/pipelines.scss

fa-caret-right
app/assets/javascripts/single_file_diff.js

fa-check
app/assets/javascripts/importer_status.js
app/assets/javascripts/boards/components/modal/list.js
app/assets/javascripts/notifications_form.js
app/views/import/google_code/status.html.haml
app/views/import/_githubish_status.html.haml
app/views/import/bitbucket/status.html.haml
app/views/import/fogbugz/status.html.haml
app/views/import/gitlab/status.html.haml

fa-chevron-down
app/assets/javascripts/blob/template_selector.js
app/assets/javascripts/behaviors/toggler_behavior.js
app/assets/javascripts/boards/components/modal/lists_dropdown.js
app/assets/stylesheets/framework/buttons.scss
app/assets/stylesheets/framework/filters.scss
app/assets/stylesheets/framework/dropdowns.scss
app/views/projects/cycle_analytics/show.html.haml

fa-chevron-up
app/assets/javascripts/behaviors/toggler_behavior.js

fa-circle
app/helpers/runners_helper.rb

fa-clipboard
app/views/sherlock/queries/_general.html.haml

fa-clock-o
app/views/users/calendar_activities.html.haml

fa-close
app/assets/javascripts/issuable/time_tracking/components/time_tracker.js

fa-code-fork
app/assets/javascripts/cycle_analytics/components/stage_test_component.js
app/assets/javascripts/cycle_analytics/components/stage_review_component.js
app/assets/javascripts/cycle_analytics/components/stage_staging_component.js
app/assets/javascripts/vue_shared/components/commit.js
app/views/projects/forks/error.html.haml

fa-cog
app/assets/stylesheets/framework/nav.scss

fa-color
app/assets/stylesheets/framework/variables.scss
app/assets/stylesheets/framework/dropdowns.scss

fa-comment
app/assets/javascripts/files_comment_button.js
app/views/search/results/_note.html.haml

fa-comment-o
app/assets/javascripts/files_comment_button.js

fa-device
app/assets/javascripts/dispatcher.js
app/views/u2f/_authenticate.html.haml

fa-download
app/assets/javascripts/vue_pipelines_index/pipeline_actions.js
app/views/projects/buttons/_download.html.haml
app/views/projects/blob/_download.html.haml

fa-edit
app/views/projects/runners/_runner.html.haml

fa-exclamation-circle
app/assets/stylesheets/framework/asciidoctor.scss
app/views/admin/background_jobs/show.html.haml
app/views/import/base/create.js.haml

fa-exclamation-triangle
app/assets/stylesheets/framework/asciidoctor.scss
app/assets/stylesheets/pages/merge_requests.scss
app/views/admin/background_jobs/show.html.haml

fa-external-link
app/assets/javascripts/merge_request_widget.js
app/assets/javascripts/environments/components/environment_external_url.js

fa-eye-slash
app/assets/javascripts/boards/components/issue_card_inner.js

fa-file
app/assets/javascripts/project_find_file.js
app/views/sherlock/file_samples/show.html.haml
app/views/search/results/_blob.html.haml
app/views/search/results/_wiki_blob.html.haml
app/views/search/results/_snippet_blob.html.haml
app/views/admin/logs/show.html.haml

fa-file-text-o
app/assets/javascripts/project_find_file.js
app/views/sherlock/file_samples/show.html.haml

fa-filter
app/assets/stylesheets/framework/filters.scss

fa-fire
app/assets/stylesheets/framework/asciidoctor.scss

fa-folder
app/assets/javascripts/environments/components/environment_item.js

fa-form
app/assets/javascripts/dispatcher.js
app/views/devise/sessions/two_factor.html.haml

fa-google
app/views/import/google_code/new_user_map.html.haml
app/views/import/google_code/status.html.haml
app/views/import/google_code/new.html.haml

fa-heart
app/views/import/gitlab/status.html.haml

fa-holder
app/views/profiles/notifications/_project_settings.html.haml
app/views/profiles/notifications/_group_settings.html.haml

fa-info-circle
app/assets/stylesheets/pages/merge_requests.scss

fa-lightbulb-o
app/assets/stylesheets/framework/asciidoctor.scss

fa-link
app/views/search/results/_snippet_blob.html.haml

fa-lock
app/views/search/results/_snippet_title.html.haml

fa-minus
app/views/projects/diffs/_stats.html.haml

fa-ok
app/views/ci/lints/_create.html.haml

fa-paperclip
app/assets/javascripts/dropzone_input.js
app/views/shared/_choose_group_avatar_button.html.haml
app/views/events/event/_note.html.haml

fa-pencil
app/views/projects/triggers/_trigger.html.haml
app/views/projects/project_members/_shared_group_members.html.haml
app/views/admin/projects/show.html.haml
app/views/admin/users/_head.html.haml
app/views/admin/groups/show.html.haml

fa-pencil-square-o
app/views/projects/project_members/_shared_group_members.html.haml
app/views/admin/projects/show.html.haml
app/views/admin/users/_head.html.haml
app/views/admin/groups/show.html.haml

fa-plus
app/views/projects/diffs/_stats.html.haml
app/views/projects/pages/show.html.haml

fa-question-circle
app/assets/javascripts/issuable/time_tracking/components/time_tracker.js
app/assets/stylesheets/pages/merge_requests.scss
app/views/projects/cycle_analytics/show.html.haml

fa-refresh
app/assets/javascripts/gfm_auto_complete.js
app/assets/stylesheets/pages/builds.scss
app/views/projects/builds/_sidebar.html.haml

fa-remove
app/assets/javascripts/vue_pipelines_index/pipeline_actions.js
app/views/ci/lints/_create.html.haml

fa-repeat
app/assets/javascripts/vue_pipelines_index/pipeline_actions.js

fa-rss
app/assets/stylesheets/framework/nav.scss
app/views/groups/_activities.html.haml
app/views/dashboard/_activities.html.haml

fa-search
app/assets/stylesheets/pages/search.scss
app/views/profiles/show.html.haml

fa-search-minus
app/views/profiles/show.html.haml

fa-search-plus
app/views/profiles/show.html.haml

fa-smile-o
app/assets/stylesheets/pages/notes.scss

fa-spinner
app/assets/javascripts/vue_pipelines_index/pipelines.js
app/assets/javascripts/vue_pipelines_index/stage.js
app/assets/javascripts/single_file_diff.js
app/assets/javascripts/ajax_loading_spinner.js
app/assets/javascripts/importer_status.js
app/assets/javascripts/right_sidebar.js
app/assets/javascripts/filtered_search/filtered_search_dropdown.js
app/assets/javascripts/users/calendar.js
app/assets/javascripts/merge_request_widget/ci_bundle.js
app/assets/javascripts/blob/template_selector.js
app/assets/javascripts/environments/folder/environments_folder_view.js
app/assets/javascripts/environments/components/environment.js
app/assets/javascripts/environments/components/environment_stop.js
app/assets/javascripts/environments/components/environment_actions.js
app/assets/javascripts/environments/components/environment_rollback.js
app/assets/javascripts/commit/pipelines/pipelines_table.js
app/assets/javascripts/boards/components/modal/index.js
app/assets/javascripts/notifications_dropdown.js
app/assets/javascripts/notifications_form.js
app/assets/javascripts/dropzone_input.js
app/assets/stylesheets/framework/dropdowns.scss
app/assets/stylesheets/pages/merge_conflicts.scss
app/assets/stylesheets/pages/cycle_analytics.scss
app/assets/stylesheets/pages/projects.scss
app/assets/stylesheets/pages/notes.scss
app/views/projects/graphs/show.html.haml
app/views/projects/imports/show.html.haml
app/views/projects/merge_requests/conflicts/components/_diff_file_editor.html.haml
app/views/projects/merge_requests/conflicts.html.haml
app/views/projects/edit.html.haml
app/views/projects/forks/new.html.haml
app/views/projects/new.html.haml
app/views/projects/commit/_commit_box.html.haml
app/views/projects/tree/_spinner.html.haml
app/views/shared/_mini_pipeline_graph.html.haml
app/views/users/show.html.haml
app/views/import/google_code/status.html.haml
app/views/import/base/create.js.haml
app/views/import/_githubish_status.html.haml
app/views/import/bitbucket/status.html.haml
app/views/import/fogbugz/status.html.haml
app/views/import/gitlab/status.html.haml

fa-star
app/assets/javascripts/star.js

fa-star-o
app/assets/javascripts/star.js

fa-stop
app/assets/javascripts/merge_request_widget.js
app/assets/javascripts/environments/components/environment_stop.js

fa-stop-circle-o
app/assets/javascripts/merge_request_widget.js

fa-tag
app/assets/javascripts/vue_shared/components/commit.js

fa-thumb-tack
app/assets/stylesheets/framework/asciidoctor.scss

fa-times
app/assets/javascripts/user_callout.js
app/assets/javascripts/issuable.js
app/assets/stylesheets/framework/filters.scss
app/assets/stylesheets/pages/search.scss
app/assets/stylesheets/pages/projects.scss
app/views/admin/users/show.html.haml
app/views/admin/users/projects.html.haml

fa-trash
app/views/projects/tags/show.html.haml
app/views/projects/triggers/_trigger.html.haml
app/views/sherlock/transactions/index.html.haml

fa-trash-o
app/views/projects/tags/show.html.haml

fa-user
app/assets/javascripts/users_select.js

fa-warning
app/helpers/runners_helper.rb
app/assets/javascripts/cycle_analytics/components/stage_plan_component.js
app/assets/javascripts/single_file_diff.js
app/views/projects/no_repo.html.haml

Unfortunately, I can't display them here, because class="..." gets stripped away.

@hazelyang has been working a lot with icons. Maybe this could be something to do whenever you have down time, @hazelyang. I would prioritize milestone issues before this but it is something we definitely want to have as part of our guide.

assigned to @hazelyang

Related to #30254 (moved).

We are going to create new icons for GitLab (#32894 (closed)). Once the works in #32894 (closed) are done, and then I will work on this document.

removed frontend label

moved to gitlab#4499

Hey!

GitLab is moving all development for both GitLab Community Edition and Enterprise Edition into a single codebase. The current gitlab-ce repository will become a read-only mirror, without any proprietary code. All development is moved to the current gitlab-ee repository, which we will rename to just gitlab in the coming weeks. As part of this migration, issues will be moved to the current gitlab-ee project.

If you have any questions about all of this, please ask them in our dedicated FAQ issue.

https://gitlab.com/gitlab-org/gitlab-ee/issues/13855

You can also find more information here:

• https://gitlab.com/gitlab-org/gitlab-ee/issues/13304
• https://about.gitlab.com/2019/08/23/a-single-codebase-for-gitlab-community-and-enterprise-edition/

Frequently Asked Questions

For an up to date list of questions and answers, please take a look at https://gitlab.com/gitlab-org/gitlab-ee/issues/13855

What will we do with the repository names?

https://gitlab.com/gitlab-org/gitlab-ee/ will become https://gitlab.com/gitlab-org/gitlab, and https://gitlab.com/gitlab-org/gitlab-ce will become https://gitlab.com/gitlab-org/gitlab-foss.

Why rename gitlab-ce to gitlab-foss?

Using "gitlab" and "gitlab-ce" would be confusing, so we decided to rename gitlab-ce to gitlab-foss to make the purpose of this FOSS repository more clear

I created a merge requests for CE, and this got closed. What do I need to do?

You will need to create a merge request at https://gitlab.com/gitlab-org/gitlab-ee/. This link will eventually redirect to https://gitlab.com/gitlab-org/gitlab.

How does the licensing work in this new setup?

Everything in the ee/ directory is proprietary. Everything else is free and open source software. If your merge request does not change anything in the ee/ directory, the process of contributing changes is the same as when using the gitlab-ce repository.

Will you accept merge requests on the gitlab-ce/gitlab-foss project after it has been renamed?

No. Merge requests submitted to this project will be closed automatically.

Will I still be able to view old issues and merge requests in gitlab-ce/gitlab-foss?

Yes.

How will this affect users of GitLab CE using Omnibus?

No changes will be necessary, as the packages built remain the same.

How will this affect users of GitLab CE that build from source?

Once the project has been renamed, you will need to change your Git remotes to use this new URL. GitLab will take care of redirecting Git operations so there is no hard deadline, but we recommend doing this as soon as the projects have been renamed.

Where can I see a timeline of the remaining steps?

https://gitlab.com/gitlab-org/gitlab-ee/issues/13304

Will community contributions submitted to the new "gitlab" repository be available in the new gitlab-foss repository?

Yes, these changes will be synced to gitlab-foss automatically, several times per day.

locked this issue