Switch to Material Symbols (CFM-404) (#248)

COmanage · Dec 15, 2024 · 3f58c6f · 3f58c6f
1 parent 835170f
commit 3f58c6f
Show file tree

Hide file tree

Showing 58 changed files with 227 additions and 1,396 deletions.
diff --git a/app/src/Controller/DashboardsController.php b/app/src/Controller/DashboardsController.php
@@ -94,26 +94,31 @@ public function configuration() {
       ],
       __d('controller', 'EnrollmentFlows', [99]) => [
         'icon'          => 'subscriptions',
+        'iconClass'     => 'material-symbols-outlined',
         'controller'    => 'enrollment_flows',
         'action'        => 'index'
       ],
       __d('controller', 'ExternalIdentitySources', [99]) => [
         'icon'          => 'cloud_download',
+        'iconClass'     => 'material-symbols-outlined',
         'controller'    => 'external_identity_sources',
         'action'        => 'index'
       ],
       __d('controller', 'IdentifierAssignments', [99]) => [
         'icon'          => 'badge',
+        'iconClass'     => 'material-symbols-outlined',
         'controller'    => 'identifier_assignments',
         'action'        => 'index'
       ],
       __d('controller', 'MessageTemplates', [99]) => [
         'icon'          => 'email',
+        'iconClass'     => 'material-symbols-outlined',
         'controller'    => 'message_templates',
         'action'        => 'index'
       ],
       __d('controller', 'MostlyStaticPages', [99]) => [
         'icon'          => 'article',
+        'iconClass'     => 'material-symbols-outlined',
         'controller'    => 'mostly_static_pages',
         'action'        => 'index'
       ],
@@ -124,6 +129,7 @@ public function configuration() {
       ],
       __d('controller', 'ProvisioningTargets', [99]) => [
         'icon'          => 'cloud_upload',
+        'iconClass'     => 'material-symbols-outlined',
         'controller'    => 'provisioning_targets',
         'action'        => 'index'
       ],
@@ -180,6 +186,7 @@ public function configuration() {
     $registryMenuItems = [
       __d('controller', 'Groups', [99]) => [
         'icon'          => 'people',
+        'iconClass'     => 'material-symbols-outlined',
         'controller'    => 'groups',
         'action'        => 'index'
       ],
@@ -190,6 +197,7 @@ public function configuration() {
       ],
       __d('controller', 'Servers', [99]) => [
         'icon'          => 'computer',
+        'iconClass'     => 'material-symbols-outlined',
         'controller'    => 'servers',
         'action'        => 'index'
       ]
@@ -202,16 +210,19 @@ public function configuration() {
     $artifactMenuItems = [
       __d('controller', 'ExtIdentitySourceRecords', [99]) => [
         'icon'          => 'badge',
+        'iconClass'     => 'material-symbols-outlined',
         'controller'    => 'ext_identity_source_records',
         'action'        => 'index'
       ],
       __d('controller', 'Jobs', [99]) => [
         'icon'          => 'work_history',
+        'iconClass'     => 'material-symbols-outlined',
         'controller'    => 'jobs',
         'action'        => 'index'
       ],
       __d('controller', 'Petitions', [99]) => [
         'icon'          => 'pending_actions',
+        'iconClass'     => 'material-symbols-outlined',
         'controller'    => 'petitions',
         'action'        => 'index'
       ]

diff --git a/app/templates/Dashboards/configuration.php b/app/templates/Dashboards/configuration.php
@@ -43,7 +43,8 @@
       <?php foreach($vv_platform_menu_items as $label => $cfg): ?>
         <li>
           <?php 
-            $linkContent =  '<em class="material-icons" aria-hidden="true">' . $cfg['icon'] . '</em>'
+            $iconClass = !empty($cfg['iconClass']) ? $cfg['iconClass'] : 'material-symbols';
+            $linkContent =  '<em class="' . $iconClass . '" aria-hidden="true">' . $cfg['icon'] . '</em>'
               . '<span class="menu-title">' . $label . '</span>';
             print $this->Html->link(
               $linkContent,
@@ -63,7 +64,8 @@
     <?php foreach($vv_registries_menu_items as $label => $cfg): ?>
       <li>
         <?php
-          $linkContent =  '<em class="material-icons" aria-hidden="true">' . $cfg['icon'] . '</em>'
+          $iconClass = !empty($cfg['iconClass']) ? $cfg['iconClass'] : 'material-symbols';
+          $linkContent =  '<em class="' . $iconClass . '" aria-hidden="true">' . $cfg['icon'] . '</em>'
             . '<span class="menu-title">' . $label . '</span>';
           print $this->Html->link(
             $linkContent,
@@ -83,7 +85,8 @@
     <?php foreach($vv_artifacts_menu_items as $label => $cfg): ?>
       <li>
         <?php
-          $linkContent =  '<em class="material-icons" aria-hidden="true">' . $cfg['icon'] . '</em>'
+          $iconClass = !empty($cfg['iconClass']) ? $cfg['iconClass'] : 'material-symbols';
+          $linkContent =  '<em class="' . $iconClass . '" aria-hidden="true">' . $cfg['icon'] . '</em>'
             . '<span class="menu-title">' . $label . '</span>';
           print $this->Html->link(
             $linkContent,
@@ -105,8 +108,9 @@
   <ul id="configuration-menu" class="config-menu">
     <?php foreach($vv_configuration_menu_items as $label => $cfg): ?>
       <li>
-        <?php 
-          $linkContent =  '<em class="material-icons" aria-hidden="true">' . $cfg['icon'] . '</em>'
+        <?php
+          $iconClass = !empty($cfg['iconClass']) ? $cfg['iconClass'] : 'material-symbols';
+          $linkContent =  '<em class="' . $iconClass . '" aria-hidden="true">' . $cfg['icon'] . '</em>'
             . '<span class="menu-title">' . $label . '</span>';
           print $this->Html->link(
             $linkContent,

diff --git a/app/templates/ExternalIdentities/fields-nav.inc b/app/templates/ExternalIdentities/fields-nav.inc
@@ -81,13 +81,13 @@ $addMenuLinks = [
     'controller' => 'names',
     'action' => 'add',
     'icon' => 'account_box',
-    'iconClass' => 'material-icons-outlined'
+    'iconClass' => 'material-symbols-outlined'
   ],
   [
     'controller' => 'email_addresses',
     'action' => 'add',
     'icon' => 'email',
-    'iconClass' => 'material-icons-outlined'
+    'iconClass' => 'material-symbols-outlined'
   ],
   [
     'controller' => 'identifiers',
@@ -98,13 +98,13 @@ $addMenuLinks = [
     'controller' => 'ad_hoc_attributes',
     'action' => 'add',
     'icon' => 'check_box',
-    'iconClass' => 'material-icons-outlined'
+    'iconClass' => 'material-symbols-outlined'
   ],
   [
     'controller' => 'addresses',
     'action' => 'add',
     'icon' => 'contact_mail',
-    'iconClass' => 'material-icons-outlined'
+    'iconClass' => 'material-symbols-outlined'
   ],
   [
     'controller' => 'history_records',

diff --git a/app/templates/ExternalIdentityRoles/fields-nav.inc b/app/templates/ExternalIdentityRoles/fields-nav.inc
@@ -43,13 +43,13 @@ $addMenuLinks = [
     'controller' => 'ad_hoc_attributes',
     'action' => 'add',
     'icon' => 'check_box',
-    'iconClass' => 'material-icons-outlined'
+    'iconClass' => 'material-symbols-outlined'
   ],
   [
     'controller' => 'addresses',
     'action' => 'add',
     'icon' => 'contact_mail',
-    'iconClass' => 'material-icons-outlined'
+    'iconClass' => 'material-symbols-outlined'
   ],
   [
     'controller' => 'telephone_numbers',

diff --git a/app/templates/ExternalIdentitySources/retrieve.php b/app/templates/ExternalIdentitySources/retrieve.php
@@ -299,7 +299,7 @@
         <div class="alert alert-info co-alert" role="alert">
           <div class="alert-body d-flex align-items-center">
                 <span class="alert-title d-flex align-items-center">
-                  <span class="material-icons-outlined alert-icon">report_problem</span>
+                  <span class="material-symbols-outlined alert-icon">report_problem</span>
                 </span>
             <span class="alert-message">        
                   <?= __d('field', 'ExternalIdentitySources.source_record.empty') ?>

diff --git a/app/templates/People/fields-nav.inc b/app/templates/People/fields-nav.inc
@@ -71,6 +71,7 @@ $topLinks = [
   ],
   [
     'icon' => 'notifications',
+    'iconClass' => 'material-symbols-outlined',
     'order' => 'Default',
     'label' => __d('controller', 'Notifications', [99]),
     'link' => [
@@ -85,6 +86,7 @@ $topLinks = [
   ],
   [
     'icon' => 'badge',
+    'iconClass' => 'material-symbols-outlined',
     'order' => 'Default',
     'label' => __d('operation', 'identifiers.assign'),
     'link' => [
@@ -109,13 +111,13 @@ $addMenuLinks = [
     'controller' => 'names',
     'action' => 'add',
     'icon' => 'account_box',
-    'iconClass' => 'material-icons-outlined'
+    'iconClass' => 'material-symbols-outlined'
   ],
   [
     'controller' => 'email_addresses',
     'action' => 'add',
     'icon' => 'email',
-    'iconClass' => 'material-icons-outlined'
+    'iconClass' => 'material-symbols-outlined'
   ],
   [
     'controller' => 'identifiers',
@@ -126,13 +128,13 @@ $addMenuLinks = [
     'controller' => 'ad_hoc_attributes',
     'action' => 'add',
     'icon' => 'check_box',
-    'iconClass' => 'material-icons-outlined'
+    'iconClass' => 'material-symbols-outlined'
   ],
   [
     'controller' => 'addresses',
     'action' => 'add',
     'icon' => 'contact_mail',
-    'iconClass' => 'material-icons-outlined'
+    'iconClass' => 'material-symbols-outlined'
   ],
   [
     'controller' => 'pronouns',

diff --git a/app/templates/PersonRoles/fields-nav.inc b/app/templates/PersonRoles/fields-nav.inc
@@ -46,13 +46,13 @@ $addMenuLinks = [
     'controller' => 'ad_hoc_attributes',
     'action' => 'add',
     'icon' => 'check_box',
-    'iconClass' => 'material-icons-outlined'
+    'iconClass' => 'material-symbols-outlined'
   ],
   [
     'controller' => 'addresses',
     'action' => 'add',
     'icon' => 'contact_mail',
-    'iconClass' => 'material-icons-outlined'
+    'iconClass' => 'material-symbols-outlined'
   ],
   [
     'controller' => 'telephone_numbers',

diff --git a/app/templates/Petitions/columns.inc b/app/templates/Petitions/columns.inc
@@ -80,14 +80,14 @@ $rowActions = [
     'action'      => 'view',
     'class'       => '',
     'icon'        => 'visibility',
+    'iconClass'   => 'material-symbols-outlined',
     'label'       => __d('operation', 'view')
   ],
   [
     'controller'  => 'petitions',
     'action'      => 'resume',
     'class'       => '',
-// XXX this icon can be "resume" if we switch to Material Symbols - see: CFM-404
-    'icon'        => 'fast_forward',
+    'icon'        => 'resume',
     'label'       => __d('operation', 'resume'),
     'if'          => 'isResumable'
   ]

diff --git a/app/templates/Petitions/fields-nav.inc b/app/templates/Petitions/fields-nav.inc
@@ -27,7 +27,7 @@
 
 $topLinks = [
   [
-    'icon'  => 'fast_forward',
+    'icon'  => 'resume',
     'order' => 'Default',
     'label' => __d('operation', 'resume'),
     'link'  => [

diff --git a/app/templates/Petitions/resume.php b/app/templates/Petitions/resume.php
@@ -108,8 +108,8 @@
       if(!$seenNextStep && !empty($vv_dispatch_urls[ $step->id ])) {
         print $this->Html->link(
           ($step->id == $vv_next_step_id) ? 
-            __d('operation', 'continue') . ' <span class="material-icons-outlined">arrow_forward</span>' : 
-            __d('operation', 'Petitions.rerun') . ' <span class="material-icons-outlined">restart_alt</span>',
+            __d('operation', 'continue') . ' <span class="material-symbols-outlined">arrow_forward</span>' : 
+            __d('operation', 'Petitions.rerun') . ' <span class="material-symbols-outlined">restart_alt</span>',
           $vv_dispatch_urls[ $step->id ],
           [
             'class' => 'btn btn-sm ' . (($step->id == $vv_next_step_id) ? 'btn-tertiary ef-continue-step' : 'btn-default ef-rerun-step'),

diff --git a/app/templates/Standard/add-edit-view.php b/app/templates/Standard/add-edit-view.php
@@ -158,6 +158,7 @@
       $action_args['vv_actions'][] = [
         'order' => $this->Menu->getMenuOrder('Delete'),
         'icon' =>  $this->Menu->getMenuIcon('Delete'),
+        'iconClass' => 'material-symbols-outlined',
         'url' => ['action' => 'delete', $vv_obj->id],
         'label' => __d('operation', 'delete'),
         'class' => 'deletebutton',

diff --git a/app/templates/Standard/index.php b/app/templates/Standard/index.php
@@ -119,6 +119,7 @@
       $action_configuration = [
         'order' => $this->Menu->getMenuOrder('Add'),
         'icon' => $this->Menu->getMenuIcon('Add'),
+        'iconClass' => 'material-symbols-outlined',
         'url' => [
           'controller' => $modelsName,
           'action' => 'add',
@@ -545,7 +546,7 @@
                           $linkClass .= ' row-link-edit';
                         } elseif ($a == 'view') {
                           $linkClass .= ' row-link-view';
-                          $readOnlyIcon = ' <em class="material-icons-outlined read-only-icon">edit_off</em>';
+                          $readOnlyIcon = ' <em class="material-symbols-outlined read-only-icon">edit_off</em>';
                         } else {
                           $linkClass .= ' row-link-' . $a;
                         }
@@ -595,7 +596,7 @@
                             $linkClass .= ' row-link-edit';
                           } elseif ($a == 'view') {
                             $linkClass .= ' row-link-view';
-                            $readOnlyIcon = ' <em class="material-icons-outlined read-only-icon">edit_off</em>';
+                            $readOnlyIcon = ' <em class="material-symbols-outlined read-only-icon">edit_off</em>';
                           }
                           $args = ['class' => $linkClass];
                           $isFirstLink = false;

diff --git a/app/templates/element/badgeList.php b/app/templates/element/badgeList.php
@@ -27,7 +27,7 @@
  *    'color' => BadgeColorModeEnum::Blue,
  *    'outline' => false,
  *    'pill' => true,
- *    'icon' => 'material-icons-key',
+ *    'icon' => 'material-symbols-key',
  *   ),
  * );
  *
@@ -54,7 +54,7 @@
     $badge_classes[] = "rounded-pill";
   }
   if(!empty($badge['icon'])) {
-    $icon = '<i class="mr-1 material-icons" aria-hidden="true">' . $badge["icon"] .'</i>';
+    $icon = '<i class="mr-1 material-symbols" aria-hidden="true">' . $badge["icon"] .'</i>';
   }
   if(isset($badge['outline']) && $badge['outline']) {
     $badge_classes[] = "bg-outline-" . $badge['color'];

diff --git a/app/templates/element/filter/legend.php b/app/templates/element/filter/legend.php
@@ -40,7 +40,7 @@
 
 
 <legend id="top-filters-toggle">
-  <em class="material-icons top-filters-search-icon" aria-hidden="true">search</em>
+  <em class="material-symbols top-filters-search-icon" aria-hidden="true">search</em>
   <span class="top-filters-title">
         <?= __d('operation', 'filter'); ?>
       </span>
@@ -61,5 +61,5 @@
       <?php endif; ?>
       </span>
   <?php endif; ?>
-  <button class="cm-toggle nospin" aria-expanded="false" aria-controls="top-filters-fields" type="button"><em class="material-icons drop-arrow">arrow_drop_down</em></button>
+  <button class="cm-toggle nospin" aria-expanded="false" aria-controls="top-filters-fields" type="button"><em class="material-symbols drop-arrow">arrow_drop_down</em></button>
 </legend>
diff --git a/app/templates/element/filter/topButtons.php b/app/templates/element/filter/topButtons.php
@@ -74,7 +74,7 @@
         data-identifier="<?= $data_identifier ?>"
         type="button" aria-controls="<?= $aria_controls ?>"
         title="<?= __d('operation', 'clear.filters',[2]) ?>">
-  <em class="material-icons" aria-hidden="true">cancel</em>
+  <em class="material-symbols-outlined" aria-hidden="true">cancel</em>
   <span class="top-filters-active-filter-title"><?= $filter_title ?></span>
   <?php if($vv_searchable_attributes[$key]['type'] != 'boolean'): ?>
   <span class="top-filters-active-filter-value">

diff --git a/app/templates/element/form/infoDiv/autocomplete.php b/app/templates/element/form/infoDiv/autocomplete.php
@@ -54,6 +54,6 @@
   print $this->Form->hidden($fieldName, $vv_field_arguments['fieldOptions']) . $this->element('peopleAutocomplete', $autocompleteArgs);
 ?>
 <div class="field-desc">
-  <span class="material-icons">info</span>
+  <span class="material-symbols">info</span>
   <?= __d('operation','autocomplete.people.desc',['2']) ?>
 </div>