diff --git a/developer_manual/html_css_design/icons.txt b/developer_manual/html_css_design/icons.txt
new file mode 100644
index 000000000..e9338f0bf
--- /dev/null
+++ b/developer_manual/html_css_design/icons.txt
@@ -0,0 +1,1181 @@
+.. figure:: img/actions/add.*
+ :height: 32
+ :width: 32
+
+ icon-add
+
+.. figure:: img/actions/add-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-add-white
+
+.. figure:: img/actions/address.*
+ :height: 32
+ :width: 32
+
+ icon-address
+
+.. figure:: img/actions/address-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-address-white
+
+.. figure:: img/actions/audio.*
+ :height: 32
+ :width: 32
+
+ icon-audio
+
+.. figure:: img/actions/audio-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-audio-white
+
+.. figure:: img/actions/audio-off.*
+ :height: 32
+ :width: 32
+
+ icon-audio-off
+
+.. figure:: img/actions/audio-off-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-audio-off-white
+
+.. figure:: img/actions/caret-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-caret-white
+
+.. figure:: img/actions/caret.*
+ :height: 32
+ :width: 32
+
+ icon-caret-dark
+
+.. figure:: img/actions/checkmark.*
+ :height: 32
+ :width: 32
+
+ icon-checkmark
+
+.. figure:: img/actions/checkmark-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-checkmark-white
+
+.. figure:: img/actions/checkmark.*
+ :height: 32
+ :width: 32
+
+ icon-checkmark-color
+
+.. figure:: img/actions/clippy.*
+ :height: 32
+ :width: 32
+
+ icon-clippy
+
+.. figure:: img/actions/clippy-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-clippy-white
+
+.. figure:: img/actions/close.*
+ :height: 32
+ :width: 32
+
+ icon-close
+
+.. figure:: img/actions/close-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-close-white
+
+.. figure:: img/actions/comment.*
+ :height: 32
+ :width: 32
+
+ icon-comment
+
+.. figure:: img/actions/comment-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-comment-white
+
+.. figure:: img/actions/confirm.*
+ :height: 32
+ :width: 32
+
+ icon-confirm
+
+.. figure:: img/actions/confirm-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-confirm-white
+
+.. figure:: img/actions/download.*
+ :height: 32
+ :width: 32
+
+ icon-download
+
+.. figure:: img/actions/download-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-download-white
+
+.. figure:: img/actions/confirm-fade.*
+ :height: 32
+ :width: 32
+
+ icon-confirm-fade
+
+.. figure:: img/actions/delete.*
+ :height: 32
+ :width: 32
+
+ icon-delete
+
+.. figure:: img/actions/delete-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-delete-white
+
+.. figure:: img/actions/details.*
+ :height: 32
+ :width: 32
+
+ icon-details
+
+.. figure:: img/actions/details-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-details-white
+
+.. figure:: img/actions/edit.*
+ :height: 32
+ :width: 32
+
+ icon-edit
+
+.. figure:: img/actions/edit-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-edit-white
+
+.. figure:: img/actions/error.*
+ :height: 32
+ :width: 32
+
+ icon-error
+
+.. figure:: img/actions/error-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-error-white
+
+.. figure:: img/actions/error.*
+ :height: 32
+ :width: 32
+
+ icon-error-color
+
+.. figure:: img/actions/external.*
+ :height: 32
+ :width: 32
+
+ icon-external
+
+.. figure:: img/actions/external-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-external-white
+
+.. figure:: img/actions/fullscreen.*
+ :height: 32
+ :width: 32
+
+ icon-fullscreen
+
+.. figure:: img/actions/fullscreen-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-fullscreen-white
+
+.. figure:: img/actions/history.*
+ :height: 32
+ :width: 32
+
+ icon-history
+
+.. figure:: img/actions/history-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-history-white
+
+.. figure:: img/actions/info.*
+ :height: 32
+ :width: 32
+
+ icon-info
+
+.. figure:: img/actions/info-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-info-white
+
+.. figure:: img/actions/logout.*
+ :height: 32
+ :width: 32
+
+ icon-logout
+
+.. figure:: img/actions/logout-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-logout-white
+
+.. figure:: img/actions/mail.*
+ :height: 32
+ :width: 32
+
+ icon-mail
+
+.. figure:: img/actions/mail-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-mail-white
+
+.. figure:: img/actions/menu.*
+ :height: 32
+ :width: 32
+
+ icon-menu
+
+.. figure:: img/actions/menu-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-menu-white
+
+.. figure:: img/actions/menu-sidebar.*
+ :height: 32
+ :width: 32
+
+ icon-menu-sidebar
+
+.. figure:: img/actions/menu-sidebar-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-menu-sidebar-white
+
+.. figure:: img/actions/more.*
+ :height: 32
+ :width: 32
+
+ icon-more
+
+.. figure:: img/actions/more-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-more-white
+
+.. figure:: img/actions/password.*
+ :height: 32
+ :width: 32
+
+ icon-password
+
+.. figure:: img/actions/password-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-password-white
+
+.. figure:: img/actions/pause.*
+ :height: 32
+ :width: 32
+
+ icon-pause
+
+.. figure:: img/actions/pause-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-pause-white
+
+.. figure:: img/actions/play.*
+ :height: 32
+ :width: 32
+
+ icon-play
+
+.. figure:: img/actions/play-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-play-white
+
+.. figure:: img/actions/play-add.*
+ :height: 32
+ :width: 32
+
+ icon-play-add
+
+.. figure:: img/actions/play-add-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-play-add-white
+
+.. figure:: img/actions/play-next.*
+ :height: 32
+ :width: 32
+
+ icon-play-next
+
+.. figure:: img/actions/play-next-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-play-next-white
+
+.. figure:: img/actions/play-previous.*
+ :height: 32
+ :width: 32
+
+ icon-play-previous
+
+.. figure:: img/actions/play-previous-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-play-previous-white
+
+.. figure:: img/actions/projects.*
+ :height: 32
+ :width: 32
+
+ icon-projects
+
+.. figure:: img/actions/projects-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-projects-white
+
+.. figure:: img/actions/public.*
+ :height: 32
+ :width: 32
+
+ icon-public
+
+.. figure:: img/actions/public-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-public-white
+
+.. figure:: img/actions/quota.*
+ :height: 32
+ :width: 32
+
+ icon-quota
+
+.. figure:: img/actions/quota-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-quota-white
+
+.. figure:: img/actions/rename.*
+ :height: 32
+ :width: 32
+
+ icon-rename
+
+.. figure:: img/actions/rename-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-rename-white
+
+.. figure:: img/actions/screen.*
+ :height: 32
+ :width: 32
+
+ icon-screen
+
+.. figure:: img/actions/screen-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-screen-white
+
+.. figure:: img/actions/template-add.*
+ :height: 32
+ :width: 32
+
+ icon-template-add
+
+.. figure:: img/actions/template-add-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-template-add-white
+
+.. figure:: img/actions/screen-off.*
+ :height: 32
+ :width: 32
+
+ icon-screen-off
+
+.. figure:: img/actions/screen-off-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-screen-off-white
+
+.. figure:: img/actions/search.*
+ :height: 32
+ :width: 32
+
+ icon-search
+
+.. figure:: img/actions/search-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-search-white
+
+.. figure:: img/actions/settings.*
+ :height: 32
+ :width: 32
+
+ icon-settings
+
+.. figure:: img/actions/settings-dark.*
+ :height: 32
+ :width: 32
+
+ icon-settings-dark
+
+.. figure:: img/actions/settings-dark-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-settings-white
+
+.. figure:: img/actions/share.*
+ :height: 32
+ :width: 32
+
+ icon-shared
+
+.. figure:: img/actions/share-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-shared-white
+
+.. figure:: img/actions/sound.*
+ :height: 32
+ :width: 32
+
+ icon-sound
+
+.. figure:: img/actions/sound-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-sound-white
+
+.. figure:: img/actions/sound-off.*
+ :height: 32
+ :width: 32
+
+ icon-sound-off
+
+.. figure:: img/actions/sound-off-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-sound-off-white
+
+.. figure:: img/actions/star-dark.*
+ :height: 32
+ :width: 32
+
+ icon-favorite
+
+.. figure:: img/actions/star-dark.*
+ :height: 32
+ :width: 32
+
+ icon-star
+
+.. figure:: img/actions/star-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-star-white
+
+.. figure:: img/actions/star.*
+ :height: 32
+ :width: 32
+
+ icon-star-dark
+
+.. figure:: img/actions/star.*
+ :height: 32
+ :width: 32
+
+ icon-starred
+
+.. figure:: img/actions/tag.*
+ :height: 32
+ :width: 32
+
+ icon-tag
+
+.. figure:: img/actions/tag-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-tag-white
+
+.. figure:: img/actions/timezone.*
+ :height: 32
+ :width: 32
+
+ icon-timezone
+
+.. figure:: img/actions/timezone-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-timezone-white
+
+.. figure:: img/actions/toggle.*
+ :height: 32
+ :width: 32
+
+ icon-toggle
+
+.. figure:: img/actions/toggle-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-toggle-white
+
+.. figure:: img/actions/toggle-background.*
+ :height: 32
+ :width: 32
+
+ icon-toggle-background
+
+.. figure:: img/actions/toggle-background-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-toggle-background-white
+
+.. figure:: img/actions/toggle-pictures.*
+ :height: 32
+ :width: 32
+
+ icon-toggle-pictures
+
+.. figure:: img/actions/toggle-pictures-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-toggle-pictures-white
+
+.. figure:: img/actions/toggle-filelist.*
+ :height: 32
+ :width: 32
+
+ icon-toggle-filelist
+
+.. figure:: img/actions/toggle-filelist-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-toggle-filelist-white
+
+.. figure:: img/actions/triangle-e.*
+ :height: 32
+ :width: 32
+
+ icon-triangle-e
+
+.. figure:: img/actions/triangle-e-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-triangle-e-white
+
+.. figure:: img/actions/triangle-n.*
+ :height: 32
+ :width: 32
+
+ icon-triangle-n
+
+.. figure:: img/actions/triangle-n-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-triangle-n-white
+
+.. figure:: img/actions/triangle-s.*
+ :height: 32
+ :width: 32
+
+ icon-triangle-s
+
+.. figure:: img/actions/triangle-s-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-triangle-s-white
+
+.. figure:: img/actions/upload.*
+ :height: 32
+ :width: 32
+
+ icon-upload
+
+.. figure:: img/actions/upload-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-upload-white
+
+.. figure:: img/actions/user.*
+ :height: 32
+ :width: 32
+
+ icon-user
+
+.. figure:: img/actions/user-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-user-white
+
+.. figure:: img/actions/group.*
+ :height: 32
+ :width: 32
+
+ icon-group
+
+.. figure:: img/actions/group-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-group-white
+
+.. figure:: img/actions/filter.*
+ :height: 32
+ :width: 32
+
+ icon-filter
+
+.. figure:: img/actions/filter-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-filter-white
+
+.. figure:: img/actions/video.*
+ :height: 32
+ :width: 32
+
+ icon-video
+
+.. figure:: img/actions/video-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-video-white
+
+.. figure:: img/actions/video-off.*
+ :height: 32
+ :width: 32
+
+ icon-video-off
+
+.. figure:: img/actions/video-off-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-video-off-white
+
+.. figure:: img/actions/video-switch.*
+ :height: 32
+ :width: 32
+
+ icon-video-switch
+
+.. figure:: img/actions/video-switch-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-video-switch-white
+
+.. figure:: img/actions/view-close.*
+ :height: 32
+ :width: 32
+
+ icon-view-close
+
+.. figure:: img/actions/view-download.*
+ :height: 32
+ :width: 32
+
+ icon-view-download
+
+.. figure:: img/actions/view-pause.*
+ :height: 32
+ :width: 32
+
+ icon-view-pause
+
+.. figure:: img/actions/view-play.*
+ :height: 32
+ :width: 32
+
+ icon-view-play
+
+.. figure:: img/actions/arrow-right.*
+ :height: 32
+ :width: 32
+
+ icon-view-next
+
+.. figure:: img/actions/arrow-left.*
+ :height: 32
+ :width: 32
+
+ icon-view-previous
+
+.. figure:: img/actions/disabled-user.*
+ :height: 32
+ :width: 32
+
+ icon-disabled-user
+
+.. figure:: img/actions/disabled-user-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-disabled-user-white
+
+.. figure:: img/actions/disabled-users.*
+ :height: 32
+ :width: 32
+
+ icon-disabled-users
+
+.. figure:: img/actions/disabled-users-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-disabled-users-white
+
+.. figure:: img/actions/user-admin.*
+ :height: 32
+ :width: 32
+
+ icon-user-admin
+
+.. figure:: img/actions/user-admin-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-user-admin-white
+
+.. figure:: img/actions/alert-outline.*
+ :height: 32
+ :width: 32
+
+ icon-alert-outline
+
+.. figure:: img/actions/alert-outline-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-alert-outline-white
+
+.. figure:: img/places/calendar.*
+ :height: 32
+ :width: 32
+
+ icon-calendar
+
+.. figure:: img/places/calendar.*
+ :height: 32
+ :width: 32
+
+ icon-calendar-dark
+
+.. figure:: img/places/contacts.*
+ :height: 32
+ :width: 32
+
+ icon-contacts
+
+.. figure:: img/places/contacts.*
+ :height: 32
+ :width: 32
+
+ icon-contacts-dark
+
+.. figure:: img/places/files.*
+ :height: 32
+ :width: 32
+
+ icon-files
+
+.. figure:: img/places/files.*
+ :height: 32
+ :width: 32
+
+ icon-files-dark
+
+.. figure:: img/filetypes/text.*
+ :height: 32
+ :width: 32
+
+ icon-file
+
+.. figure:: img/filetypes/file.*
+ :height: 32
+ :width: 32
+
+ icon-filetype-file
+
+.. figure:: img/filetypes/folder.*
+ :height: 32
+ :width: 32
+
+ icon-folder
+
+.. figure:: img/filetypes/folder-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-folder-white
+
+.. figure:: img/filetypes/folder.*
+ :height: 32
+ :width: 32
+
+ icon-filetype-folder
+
+.. figure:: img/filetypes/folder-drag-accept.*
+ :height: 32
+ :width: 32
+
+ icon-filetype-folder-drag-accept
+
+.. figure:: img/places/home.*
+ :height: 32
+ :width: 32
+
+ icon-home
+
+.. figure:: img/places/home-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-home-white
+
+.. figure:: img/places/link.*
+ :height: 32
+ :width: 32
+
+ icon-link
+
+.. figure:: img/places/link-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-link-white
+
+.. figure:: img/places/music.*
+ :height: 32
+ :width: 32
+
+ icon-music
+
+.. figure:: img/places/music-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-music-white
+
+.. figure:: img/places/picture.*
+ :height: 32
+ :width: 32
+
+ icon-picture
+
+.. figure:: img/places/picture-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-picture-white
+
+.. figure:: img/clients/desktop.*
+ :height: 32
+ :width: 32
+
+ icon-desktop
+
+.. figure:: img/clients/desktop-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-desktop-white
+
+.. figure:: img/clients/phone.*
+ :height: 32
+ :width: 32
+
+ icon-phone
+
+.. figure:: img/clients/phone-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-phone-white
+
+.. figure:: img/clients/tablet.*
+ :height: 32
+ :width: 32
+
+ icon-tablet
+
+.. figure:: img/clients/tablet-white.*
+ :class: white-icon
+ :height: 32
+ :width: 32
+
+ icon-tablet-white
+
+.. figure:: img/actions/user.*
+ :height: 32
+ :width: 32
+
+ icon-category-installed
+
+.. figure:: img/actions/checkmark.*
+ :height: 32
+ :width: 32
+
+ icon-category-enabled
+
+.. figure:: img/actions/close.*
+ :height: 32
+ :width: 32
+
+ icon-category-disabled
+
+.. figure:: img/categories/bundles.*
+ :height: 32
+ :width: 32
+
+ icon-category-app-bundles
+
+.. figure:: img/actions/download.*
+ :height: 32
+ :width: 32
+
+ icon-category-updates
+
+.. figure:: img/categories/files.*
+ :height: 32
+ :width: 32
+
+ icon-category-files
+
+.. figure:: img/categories/social.*
+ :height: 32
+ :width: 32
+
+ icon-category-social
+
+.. figure:: img/categories/office.*
+ :height: 32
+ :width: 32
+
+ icon-category-office
+
+.. figure:: img/categories/auth.*
+ :height: 32
+ :width: 32
+
+ icon-category-auth
+
+.. figure:: img/categories/monitoring.*
+ :height: 32
+ :width: 32
+
+ icon-category-monitoring
+
+.. figure:: img/categories/multimedia.*
+ :height: 32
+ :width: 32
+
+ icon-category-multimedia
+
+.. figure:: img/categories/organization.*
+ :height: 32
+ :width: 32
+
+ icon-category-organization
+
+.. figure:: img/categories/customization.*
+ :height: 32
+ :width: 32
+
+ icon-category-customization
+
+.. figure:: img/categories/integration.*
+ :height: 32
+ :width: 32
+
+ icon-category-integration
+
+.. figure:: img/actions/settings-dark.*
+ :height: 32
+ :width: 32
+
+ icon-category-tools
+
+.. figure:: img/categories/games.*
+ :height: 32
+ :width: 32
+
+ icon-category-games
+
+.. figure:: img/actions/password.*
+ :height: 32
+ :width: 32
+
+ icon-category-security
+
+.. figure:: img/actions/search.*
+ :height: 32
+ :width: 32
+
+ icon-category-search
+
+.. figure:: img/categories/workflow.*
+ :height: 32
+ :width: 32
+
+ icon-category-workflow
+
+.. figure:: img/categories/dashboard.*
+ :height: 32
+ :width: 32
+
+ icon-category-dashboard
+