first draft for ux icons support

README.md

@@ -33,7 +33,7 @@ You can check it out here at Github in the [TablerBundle-Demo](https://github.co
 - ContextHelper for dynamic layout changes (e.g. based on user preferences)
 - Translations for: english, german, italian, czech, spanish, russian, arabic, finnish, japanese, swedish, portuguese (brazilian), dutch, french, turkish, danish, chinese, slovakian, basque, polish, esperanto, hebrew, romanian ([please help translating it to more languages](https://hosted.weblate.org/projects/kimai/theme/))
 - Based on Bootstrap 5
-- Supports FontAwesome 5
+- Supports [Symfony UX icons](https://ux.symfony.com/icons)
 
 ## Installation
 
@@ -68,13 +68,15 @@ return [
 ];
 ```
 
+Now reload the cache and call `php bin/console tabler:icons`.
+
 ### Step 4: Documentation
 
-Now read what you should do in order to use the theme at [docs/](docs/index.md).
+Read how to use the theme at [docs/](docs/index.md).
 
 ## License and contributors
 
 Published under the MIT, read the [LICENSE](LICENSE) file for more information.
 
-Translations managed with the fantastic [Weblate project](https://hosted.weblate.org/projects/kimai/theme/).
+Translations managed with the fantastic [Weblate](https://hosted.weblate.org/projects/kimai/theme/) project.
 

assets/tabler-rtl.scss

@@ -1,6 +1,7 @@
 @import '~@tabler/core/dist/css/tabler.rtl.css';
 @import '~@tabler/core/dist/css/tabler-vendors.rtl.css';
 
+// FIXME remove this with the next major update
 $fa-font-path: "~@fortawesome/fontawesome-free/webfonts/";
 @import '~@fortawesome/fontawesome-free/scss/fontawesome';
 @import '~@fortawesome/fontawesome-free/scss/regular';

assets/tabler.scss

@@ -1,6 +1,7 @@
 @import '~@tabler/core/dist/css/tabler.css';
 @import '~@tabler/core/dist/css/tabler-vendors.css';
 
+// FIXME remove this with the next major update
 $fa-font-path: "~@fortawesome/fontawesome-free/webfonts/";
 @import '~@fortawesome/fontawesome-free/scss/fontawesome';
 @import '~@fortawesome/fontawesome-free/scss/regular';

composer.json

@@ -1,7 +1,7 @@
 {
     "name": "kevinpapst/tabler-bundle",
     "type": "symfony-bundle",
-    "description": "Admin/Backend theme bundle for Symfony based on Tabler.io",
+    "description": "Theme bundle for Symfony based on Tabler.io",
     "license": "MIT",
     "authors": [
         {
@@ -21,6 +21,7 @@
         "symfony/security-core": "^6.0 || ^7.0",
         "symfony/translation": "^6.0 || ^7.0",
         "symfony/twig-bridge": "^6.0 || ^7.0",
+        "symfony/ux-icons": "^2.0",
         "twig/twig": "^3.0"
     },
     "require-dev": {
@@ -32,6 +33,15 @@
         "phpstan/phpstan-symfony": "^1.0",
         "knplabs/knp-menu-bundle": "^3.0"
     },
+    "config": {
+        "platform": {
+            "php": "8.1.3"
+        },
+        "preferred-install": {
+            "*": "dist"
+        },
+        "sort-packages": true
+    },
     "suggest" : {
         "knplabs/knp-menu-bundle" : "Allows easy menu integration"
     },

config/packages/tabler.yaml

@@ -44,35 +44,34 @@ tabler:
 
     icons:
         # used for the action_collapsebutton components
-        collapse: fas fa-chevron-down
+        collapse: "fa6-solid:chevron-down"
         # used for the password-reset template
-        mail: far fa-envelope
+        mail: "fa6-regular:envelope"
         # used for the 404/500/... error page
-        back: fas fa-long-arrow-alt-left
+        back: "fa6-solid:left-long"
         # the following are only ideas to be used in your own templates
-        about: fas fa-info-circle
-        admin: fas fa-wrench
-        bookmark: far fa-star
-        calendar: far fa-calendar-alt
-        clock: far fa-clock
-        comment: far fa-comment
-        copy: far fa-copy
-        create: far fa-plus-square
-        dashboard: fas fa-tachometer-alt
-        delete: far fa-trash-alt
-        download: fas fa-download
-        edit: far fa-edit
-        email: fa fa-at
-        export: fas fa-file-export
-        filter: fas fa-filter
-        help: far fa-question-circle
-        home: fas fa-home
-        password: fas fa-key
-        phone: fas fa-phone
-        print: fas fa-print
-        search: fas fa-search
-        settings: fas fa-cog
-        start: fas fa-play
-        stop: fas fa-stop
-        upload: fas fa-upload
-        user: fas fa-user
+        about: "fa6-solid:circle-info"
+        admin: "fa6-solid:wrench"
+        bookmark: "fa6-regular:star"
+        calendar: "fa6-regular:calendar-days"
+        clock: "fa6-regular:clock"
+        comment: "fa6-regular:comment"
+        copy: "fa6-regular:copy"
+        create: "fa6-regular:square-plus"
+        dashboard: "fa6-solid:gauge"
+        delete: "fa6-regular:trash-can"
+        download: "fa6-solid:download"
+        edit: "fa6-regular:pen-to-square"
+        export: "fa6-solid:file-export"
+        filter: "fa6-solid:filter"
+        help: "fa6-regular:circle-question"
+        home: "fa6-solid:house"
+        password: "fa6-solid:key"
+        phone: "fa6-solid:phone"
+        print: "fa6-solid:print"
+        search: "fa6-solid:magnifying-glass"
+        settings: "fa6-solid:gear"
+        start: "fa6-solid:play"
+        stop: "fa6-solid:stop"
+        upload: "fa6-solid:upload"
+        user: "fa6-solid:user"

config/services.yml

@@ -1,11 +1,25 @@
 services:
 
+    KevinPapst\TablerBundle\Command\IconsCommand:
+        arguments:
+            - '%kernel.project_dir%'
+            - '%tabler_bundle.icons%'
+        tags:
+            - { name: 'console.command' }
+
     KevinPapst\TablerBundle\Twig\RuntimeExtension:
         class: KevinPapst\TablerBundle\Twig\RuntimeExtension
         arguments:
             - '@event_dispatcher'
             - '@tabler_bundle.context_helper'
             - '%tabler_bundle.routes%'
+        tags:
+            - { name: twig.runtime }
+
+    KevinPapst\TablerBundle\Twig\IconExtension:
+        class: KevinPapst\TablerBundle\Twig\IconExtension
+        arguments:
+            - '@.ux_icons.icon_renderer'
             - '%tabler_bundle.icons%'
         tags:
             - { name: twig.runtime }