From 20bd37ecbaa7f10a9bce6214ce7861c5f1b93862 Mon Sep 17 00:00:00 2001 From: Giuseppe Criscione <18699708+giuscris@users.noreply.github.com> Date: Sat, 15 Nov 2025 11:02:02 +0100 Subject: [PATCH] Add icons to panel navigation --- formwork/src/Panel/Navigation/NavigationItem.php | 8 ++++++++ panel/assets/icons/svg/chart-line.svg | 1 + panel/assets/icons/svg/files.svg | 1 + panel/assets/icons/svg/gear.svg | 1 + panel/assets/icons/svg/home.svg | 2 +- panel/assets/icons/svg/page-home.svg | 2 +- panel/assets/icons/svg/pages.svg | 1 + panel/assets/icons/svg/toolbox.svg | 1 + panel/assets/icons/svg/users.svg | 1 + panel/config/navigation.php | 7 +++++++ panel/src/scss/components/_sidebar.scss | 6 +++++- panel/views/dashboard/index.php | 3 ++- panel/views/files/index.php | 1 + panel/views/options/site.php | 1 + panel/views/options/system.php | 1 + panel/views/pages/index.php | 3 ++- panel/views/partials/sidebar.php | 3 +++ panel/views/statistics/index.php | 3 ++- panel/views/tools/backups.php | 3 ++- panel/views/tools/info.php | 3 ++- panel/views/tools/updates.php | 3 ++- panel/views/users/index.php | 3 ++- panel/views/users/profile.php | 3 ++- 23 files changed, 50 insertions(+), 11 deletions(-) create mode 100644 panel/assets/icons/svg/chart-line.svg create mode 100644 panel/assets/icons/svg/files.svg create mode 100644 panel/assets/icons/svg/gear.svg create mode 100644 panel/assets/icons/svg/pages.svg create mode 100644 panel/assets/icons/svg/toolbox.svg create mode 100644 panel/assets/icons/svg/users.svg diff --git a/formwork/src/Panel/Navigation/NavigationItem.php b/formwork/src/Panel/Navigation/NavigationItem.php index d7d1cfae6..5b35e8406 100644 --- a/formwork/src/Panel/Navigation/NavigationItem.php +++ b/formwork/src/Panel/Navigation/NavigationItem.php @@ -56,4 +56,12 @@ public function badge(): ?string { return $this->data['badge'] ?? null; } + + /** + * Get navigation item icon + */ + public function icon(): ?string + { + return $this->data['icon'] ?? null; + } } diff --git a/panel/assets/icons/svg/chart-line.svg b/panel/assets/icons/svg/chart-line.svg new file mode 100644 index 000000000..1b137d57e --- /dev/null +++ b/panel/assets/icons/svg/chart-line.svg @@ -0,0 +1 @@ + diff --git a/panel/assets/icons/svg/files.svg b/panel/assets/icons/svg/files.svg new file mode 100644 index 000000000..e154d8ca4 --- /dev/null +++ b/panel/assets/icons/svg/files.svg @@ -0,0 +1 @@ + diff --git a/panel/assets/icons/svg/gear.svg b/panel/assets/icons/svg/gear.svg new file mode 100644 index 000000000..626a7513b --- /dev/null +++ b/panel/assets/icons/svg/gear.svg @@ -0,0 +1 @@ + diff --git a/panel/assets/icons/svg/home.svg b/panel/assets/icons/svg/home.svg index 51b0250ad..6501a7385 100644 --- a/panel/assets/icons/svg/home.svg +++ b/panel/assets/icons/svg/home.svg @@ -1 +1 @@ - + diff --git a/panel/assets/icons/svg/page-home.svg b/panel/assets/icons/svg/page-home.svg index 17a081a2f..e9261d07a 100644 --- a/panel/assets/icons/svg/page-home.svg +++ b/panel/assets/icons/svg/page-home.svg @@ -1 +1 @@ - + diff --git a/panel/assets/icons/svg/pages.svg b/panel/assets/icons/svg/pages.svg new file mode 100644 index 000000000..24a731d73 --- /dev/null +++ b/panel/assets/icons/svg/pages.svg @@ -0,0 +1 @@ + diff --git a/panel/assets/icons/svg/toolbox.svg b/panel/assets/icons/svg/toolbox.svg new file mode 100644 index 000000000..e15d1e88a --- /dev/null +++ b/panel/assets/icons/svg/toolbox.svg @@ -0,0 +1 @@ + diff --git a/panel/assets/icons/svg/users.svg b/panel/assets/icons/svg/users.svg new file mode 100644 index 000000000..ee8c80a27 --- /dev/null +++ b/panel/assets/icons/svg/users.svg @@ -0,0 +1 @@ + diff --git a/panel/config/navigation.php b/panel/config/navigation.php index b8541ab1f..0bcc07708 100644 --- a/panel/config/navigation.php +++ b/panel/config/navigation.php @@ -9,42 +9,49 @@ 'uri' => '/dashboard/', 'permissions' => 'panel.dashboard', 'badge' => null, + 'icon' => 'home', ], 'pages' => [ 'label' => $translation->translate('panel.pages.pages'), 'uri' => '/pages/', 'permissions' => 'panel.pages', 'badge' => $site->descendants()->count(), + 'icon' => 'pages', ], 'files' => [ 'label' => $translation->translate('panel.files.files'), 'uri' => '/files/', 'permissions' => 'panel.files', 'badge' => null, + 'icon' => 'files', ], 'statistics' => [ 'label' => $translation->translate('panel.statistics.statistics'), 'uri' => '/statistics/', 'permissions' => 'panel.statistics', 'badge' => null, + 'icon' => 'chart-line', ], 'users' => [ 'label' => $translation->translate('panel.users.users'), 'uri' => '/users/', 'permissions' => 'panel.users', 'badge' => $site->users()->count(), + 'icon' => 'users', ], 'options' => [ 'label' => $translation->translate('panel.options.options'), 'uri' => '/options/', 'permissions' => 'panel.options', 'badge' => null, + 'icon' => 'gear', ], 'tools' => [ 'label' => $translation->translate('panel.tools.tools'), 'uri' => '/tools/', 'permissions' => 'panel.tools', 'badge' => null, + 'icon' => 'toolbox', ], 'logout' => [ 'label' => $translation->translate('panel.login.logout'), diff --git a/panel/src/scss/components/_sidebar.scss b/panel/src/scss/components/_sidebar.scss index b35269aab..6e285c07d 100644 --- a/panel/src/scss/components/_sidebar.scss +++ b/panel/src/scss/components/_sidebar.scss @@ -52,7 +52,7 @@ .sidebar-navigation > li { position: relative; padding: 0.25rem 0; - padding-left: 1rem; + padding-left: 0.75rem; margin: 0; margin-bottom: 0.5rem; } @@ -61,6 +61,10 @@ color: var(--color-base-100); } +.sidebar-navigation > li .icon { + margin-right: 0.375rem; +} + .sidebar-navigation > .active { font-weight: 600; } diff --git a/panel/views/dashboard/index.php b/panel/views/dashboard/index.php index 6eb1433b5..6f726db31 100644 --- a/panel/views/dashboard/index.php +++ b/panel/views/dashboard/index.php @@ -2,6 +2,7 @@
+
icon('home') ?>
translate('panel.dashboard.dashboard') ?>
@@ -62,4 +63,4 @@
- + \ No newline at end of file diff --git a/panel/views/files/index.php b/panel/views/files/index.php index f3411e45c..c522cec82 100644 --- a/panel/views/files/index.php +++ b/panel/views/files/index.php @@ -3,6 +3,7 @@
+
icon('files') ?>
translate('panel.files.files') ?>
user()->permissions()->has('panel.files.upload')) : ?> diff --git a/panel/views/options/site.php b/panel/views/options/site.php index 0f0aaefcd..49340e016 100644 --- a/panel/views/options/site.php +++ b/panel/views/options/site.php @@ -4,6 +4,7 @@
+
icon('gear') ?>
translate('panel.options.options') ?>
diff --git a/panel/views/options/system.php b/panel/views/options/system.php index 6cdb6b478..58c72930f 100644 --- a/panel/views/options/system.php +++ b/panel/views/options/system.php @@ -4,6 +4,7 @@
+
icon('gear') ?>
translate('panel.options.options') ?>
diff --git a/panel/views/pages/index.php b/panel/views/pages/index.php index 6d90eef49..6f1dff1ff 100644 --- a/panel/views/pages/index.php +++ b/panel/views/pages/index.php @@ -3,6 +3,7 @@
+
icon('pages') ?>
translate('panel.pages.pages') ?>
ancestors()->reverse()->with($parent) as $page) : ?>
/
@@ -38,4 +39,4 @@
- + \ No newline at end of file diff --git a/panel/views/partials/sidebar.php b/panel/views/partials/sidebar.php index acc12a2e1..4b6587636 100644 --- a/panel/views/partials/sidebar.php +++ b/panel/views/partials/sidebar.php @@ -18,6 +18,9 @@ navigation() as $item) : ?> permissions() === null || $panel->user()->permissions()->has($item->permissions())) : ?>
  • + icon()) : ?> + icon($item->icon()) ?> + escape($item->label()) ?> badge()) : ?> badge() ?> diff --git a/panel/views/statistics/index.php b/panel/views/statistics/index.php index 8cbed1581..b29144300 100644 --- a/panel/views/statistics/index.php +++ b/panel/views/statistics/index.php @@ -1,6 +1,7 @@ layout('panel') ?>
    +
    icon('chart-line') ?>
    translate('panel.statistics.statistics') ?>
    @@ -116,4 +117,4 @@
    • -
    +
    \ No newline at end of file diff --git a/panel/views/tools/backups.php b/panel/views/tools/backups.php index af95f8760..c88bcdf07 100644 --- a/panel/views/tools/backups.php +++ b/panel/views/tools/backups.php @@ -3,6 +3,7 @@ modals()->add('deleteFile') ?>
    +
    icon('toolbox') ?>
    translate('panel.tools.tools') ?>
    @@ -50,4 +51,4 @@ - + \ No newline at end of file diff --git a/panel/views/tools/info.php b/panel/views/tools/info.php index 017271bd8..c1b9ff473 100644 --- a/panel/views/tools/info.php +++ b/panel/views/tools/info.php @@ -1,6 +1,7 @@ layout('panel') ?>
    +
    icon('toolbox') ?>
    translate('panel.tools.tools') ?>
    @@ -43,4 +44,4 @@
    -
    +
    \ No newline at end of file diff --git a/panel/views/tools/updates.php b/panel/views/tools/updates.php index 909436d90..7c4c26729 100644 --- a/panel/views/tools/updates.php +++ b/panel/views/tools/updates.php @@ -1,6 +1,7 @@ layout('panel') ?>
    +
    icon('toolbox') ?>
    translate('panel.tools.tools') ?>
    @@ -24,4 +25,4 @@

    Formwork translate('panel.updates.latestVersionAvailable') ?>

    - + \ No newline at end of file diff --git a/panel/views/users/index.php b/panel/views/users/index.php index adfea87ae..b0bbf735d 100644 --- a/panel/views/users/index.php +++ b/panel/views/users/index.php @@ -3,6 +3,7 @@ modals()->addMultiple(['newUser', 'deleteUser']) ?>
    +
    icon('users') ?>
    translate('panel.users.users') ?> count() ?>
    @@ -33,4 +34,4 @@
    - + \ No newline at end of file diff --git a/panel/views/users/profile.php b/panel/views/users/profile.php index c63ababab..2fc04af6f 100644 --- a/panel/views/users/profile.php +++ b/panel/views/users/profile.php @@ -4,6 +4,7 @@
    +
    icon('user') ?>
    translate('user.user') ?>
    user()->canChangeOptionsOf($user)) : ?>
    @@ -38,4 +39,4 @@ insert('fields', ['fields' => $fields]) ?> - + \ No newline at end of file