Use font-awesome full name base fa classes

camptocamp · Oct 4, 2024 · bf6e669 · bf6e669
1 parent e8b4d6e
commit bf6e669
Show file tree

Hide file tree

Showing 48 changed files with 147 additions and 147 deletions.
diff --git a/contribs/gmf/apps/desktop/index.html.ejs b/contribs/gmf/apps/desktop/index.html.ejs
@@ -26,7 +26,7 @@
             <a href
                class="btn btn-block prime dropdown-toggle"
                data-toggle="dropdown">
-              <span class="fa fa-grid"></span>
+              <span class="fa-solid fa-grid"></span>
               <span ng-if="mainCtrl.gmfThemeManager.modeFlush">
                 <span translate>Theme:</span>
                 <b ng-if="mainCtrl.gmfThemeManager.isLoading()" translate>Loading...</b>
@@ -54,15 +54,15 @@
           <div ngeo-btn-group class="btn-group-vertical" ngeo-btn-group-active="mainCtrl.toolsActive">
             <button ngeo-btn class="btn btn-default" ng-model="mainCtrl.loginActive"
               data-toggle="tooltip" data-placement="left" data-original-title="{{'Login'|translate}}">
-              <span class="fa fa-user" ng-class="mainCtrl.gmfUser.username ? 'fa-user-xmark' : 'fa-user'"></span>
+              <span class="fa-solid fa-user" ng-class="mainCtrl.gmfUser.username ? 'fa-user-xmark' : 'fa-user'"></span>
             </button>
             <button ngeo-btn class="btn btn-default" ng-model="mainCtrl.printPanelActive"
               data-toggle="tooltip" data-placement="left" data-original-title="{{'Print'|translate}}">
-              <span class="fa fa-print"></span>
+              <span class="fa-solid fa-print"></span>
             </button>
             <button ngeo-btn class="btn btn-default" ng-model="mainCtrl.drawFeatureActive"
               data-toggle="tooltip" data-placement="left" data-original-title="{{'Draw and Measure'|translate}}">
-              <span class="fa fa-paintbrush"></span>
+              <span class="fa-solid fa-paintbrush"></span>
             </button>
             <button ngeo-btn class="btn btn-default" ng-model="mainCtrl.filterSelectorActive"
               data-toggle="tooltip" data-placement="left" data-original-title="{{'Filter'|translate}}">
@@ -73,29 +73,29 @@
             <button ngeo-btn class="btn btn-default" ng-model="mainCtrl.editFeatureActive"
               data-toggle="tooltip" data-placement="left" data-original-title="{{'Editing'|translate}}"
               ng-show="mainCtrl.hasEditableLayers">
-              <span class="fa fa-pen-to-square"></span>
+              <span class="fa-solid fa-pen-to-square"></span>
             </button>
             <button ngeo-btn class="btn btn-default" ng-model="mainCtrl.drawProfilePanelActive"
               data-toggle="tooltip" data-placement="left" data-original-title="{{'Profile'|translate}}">
-              <span class="fa fa-chart-area"></span>
+              <span class="fa-solid fa-chart-area"></span>
             </button>
             <button ngeo-btn class="btn btn-default" ng-model="mainCtrl.queryPanelActive"
               data-toggle="tooltip" data-placement="left" data-original-title="{{'Selection'|translate}}">
               <span>
-                <i class="fa fa-arrow-pointer"></i>
-                <i class="fa fa-info fa-xs offset-info-icon"></i>
+                <i class="fa-solid fa-arrow-pointer"></i>
+                <i class="fa-solid fa-info fa-xs offset-info-icon"></i>
               </span>
             </button>
             <button ngeo-btn class="btn btn-default" ng-model="mainCtrl.importDataSourceActive"
                     data-toggle="tooltip" data-placement="left" data-original-title="{{'Import Layer'|translate}}">
-              <span class="fa fa-upload"></span>
+              <span class="fa-solid fa-upload"></span>
             </button>
           </div>
           <br/>
           <br/>
           <span data-toggle="tooltip" data-placement="left" data-original-title="{{'Share this map'|translate}}">
             <button ngeo-btn class="btn btn-default" ng-model="mainCtrl.modalShareShown">
-              <span class="fa fa-share-nodes"></span>
+              <span class="fa-solid fa-share-nodes"></span>
             </button>
           </span>
         </div>

diff --git a/contribs/gmf/apps/desktop_alt/index.html.ejs b/contribs/gmf/apps/desktop_alt/index.html.ejs
@@ -28,7 +28,7 @@
           <a href
              class="btn btn-block prime dropdown-toggle"
              data-toggle="dropdown">
-            <span class="fa fa-grid"></span>
+            <span class="fa-solid fa-grid"></span>
             <span ng-if="mainCtrl.gmfThemeManager.modeFlush">
               <span translate>Theme:</span>
               <b ng-if="mainCtrl.gmfThemeManager.isLoading()" translate>Loading...</b>
@@ -270,7 +270,7 @@
       <!-- Permalink -->
       <span slot="tool-button-separate">
         <button ngeo-btn class="btn btn-default gmf-app-tools-bar" ng-model="mainCtrl.modalShareShown"  data-toggle="tooltip" data-placement="left" data-original-title="{{'Share this map'|translate}}">
-          <span class="fa fa-share-nodes"></span>
+          <span class="fa-solid fa-share-nodes"></span>
         </button>
       </span>
 

diff --git a/contribs/gmf/apps/mobile/index.html.ejs b/contribs/gmf/apps/mobile/index.html.ejs
@@ -60,7 +60,7 @@
       </gmf-search>
       <button class="gmf-mobile-nav-trigger gmf-mobile-nav-right-trigger"
         ng-click="mainCtrl.toggleRightNavVisibility()">
-        <i class="fa fa-wrench"></i>
+        <i class="fa-solid fa-wrench"></i>
       </button>
       <div class="overlay"
         ng-swipe-disable-mouse
@@ -89,7 +89,7 @@
       <div class="gmf-app-map-messages">
         <gmf-disclaimer gmf-disclaimer-map="::mainCtrl.map"></gmf-disclaimer>
         <div class="alert alert-info alert-dismissible fade show d-none d-md-block" role="alert" ng-if="::mainCtrl.redirectUrl !== ''">
-          <button type="button" class="close" data-dismiss="alert" aria-label="{{'Close' | translate }}"><span aria-hidden="true" class="fa fa-xmark"></span></button>
+          <button type="button" class="close" data-dismiss="alert" aria-label="{{'Close' | translate }}"><span aria-hidden="true" class="fa-solid fa-xmark"></span></button>
           <span translate
             translate-params-url="::mainCtrl.redirectUrl">
             You're using the mobile application. Check out the <a href="{{url}}">standard application</a>.</span>
@@ -153,7 +153,7 @@
               ng-click="mainCtrl.hideNav()"
               class="gmf-mobile-nav-button"
               ng-model="mainCtrl.measurePointActive">
-              <span class="fa fa-fw" ng-class="{'fa-check': mainCtrl.measurePointActive}"></span>
+              <span class="fa-solid fa-fw" ng-class="{'fa-check': mainCtrl.measurePointActive}"></span>
               {{'Coordinate' | translate}}
             </a>
           </li>
@@ -162,7 +162,7 @@
               ng-click="mainCtrl.hideNav()"
               class="gmf-mobile-nav-button"
               ng-model="mainCtrl.measureLengthActive">
-              <span class="fa fa-fw" ng-class="{'fa-check': mainCtrl.measureLengthActive}"></span>
+              <span class="fa-solid fa-fw" ng-class="{'fa-check': mainCtrl.measureLengthActive}"></span>
               {{'Length' | translate}}
             </a>
           </li>
@@ -171,7 +171,7 @@
               ng-click="mainCtrl.hideNav()"
               class="gmf-mobile-nav-button"
               ng-model="mainCtrl.measureAreaActive">
-              <span class="fa fa-fw" ng-class="{'fa-check': mainCtrl.measureAreaActive}"></span>
+              <span class="fa-solid fa-fw" ng-class="{'fa-check': mainCtrl.measureAreaActive}"></span>
               {{'Area' | translate}}
             </a>
           </li>

diff --git a/contribs/gmf/apps/mobile_alt/index.html.ejs b/contribs/gmf/apps/mobile_alt/index.html.ejs
@@ -54,7 +54,7 @@
       </gmf-search>
       <button class="gmf-mobile-nav-trigger gmf-mobile-nav-right-trigger"
         ng-click="mainCtrl.toggleRightNavVisibility()">
-        <i class="fa fa-wrench"></i>
+        <i class="fa-solid fa-wrench"></i>
       </button>
       <div class="overlay"
         ng-swipe-disable-mouse
@@ -83,7 +83,7 @@
       <div class="gmf-app-map-messages">
         <gmf-disclaimer gmf-disclaimer-map="::mainCtrl.map"></gmf-disclaimer>
         <div class="alert alert-info alert-dismissible fade show d-none d-md-block" role="alert" ng-if="::mainCtrl.redirectUrl !== ''">
-          <button type="button" class="close" data-dismiss="alert" aria-label="{{'Close' | translate }}"><span aria-hidden="true" class="fa fa-xmark"></span></button>
+          <button type="button" class="close" data-dismiss="alert" aria-label="{{'Close' | translate }}"><span aria-hidden="true" class="fa-solid fa-xmark"></span></button>
           <span translate
             translate-params-url="::mainCtrl.redirectUrl">
             You're using the mobile application. Check out the <a href="{{url}}">standard application</a>.</span>
@@ -147,7 +147,7 @@
               ng-click="mainCtrl.hideNav()"
               class="gmf-mobile-nav-button"
               ng-model="mainCtrl.measurePointActive">
-              <span class="fa fa-fw" ng-class="{'fa-check': mainCtrl.measurePointActive}"></span>
+              <span class="fa-solid fa-fw" ng-class="{'fa-check': mainCtrl.measurePointActive}"></span>
               {{'Coordinate' | translate}}
             </a>
           </li>
@@ -156,7 +156,7 @@
               ng-click="mainCtrl.hideNav()"
               class="gmf-mobile-nav-button"
               ng-model="mainCtrl.measureLengthActive">
-              <span class="fa fa-fw" ng-class="{'fa-check': mainCtrl.measureLengthActive}"></span>
+              <span class="fa-solid fa-fw" ng-class="{'fa-check': mainCtrl.measureLengthActive}"></span>
               {{'Length' | translate}}
             </a>
           </li>

diff --git a/contribs/gmf/apps/oeedit/index.html.ejs b/contribs/gmf/apps/oeedit/index.html.ejs
@@ -20,7 +20,7 @@
             <a href
                class="btn btn-block prime dropdown-toggle"
                data-toggle="dropdown">
-              <span class="fa fa-grid"></span>
+              <span class="fa-solid fa-grid"></span>
               <span ng-if="mainCtrl.gmfThemeManager.modeFlush">
                 <span translate>Theme:</span>
                 <b ng-if="mainCtrl.gmfThemeManager.isLoading()" translate>Loading...</b>
@@ -48,11 +48,11 @@
           <div ngeo-btn-group class="btn-group-vertical" ngeo-btn-group-active="mainCtrl.queryActive">
             <button ngeo-btn class="btn btn-default" ng-model="mainCtrl.queryActive"
               data-toggle="tooltip" data-placement="left" data-original-title="{{'Query'|translate}}">
-              <span class="fa fa-info"></span>
+              <span class="fa-solid fa-info"></span>
             </button>
             <button ngeo-btn class="btn btn-default" ng-model="mainCtrl.oeEditActive"
               data-toggle="tooltip" data-placement="left" data-original-title="{{'Object Editing'|translate}}">
-              <span class="fa fa-pen-to-square"></span>
+              <span class="fa-solid fa-pen-to-square"></span>
             </button>
           </div>
         </div>

diff --git a/contribs/gmf/examples/elevation.html b/contribs/gmf/examples/elevation.html
@@ -31,7 +31,7 @@
         <li ng-repeat="elevationItem in ::ctrl.elevationLayers">
           <a href ng-click="ctrl.selectedElevationLayer = elevationItem">
             <span
-              class="fa fa-fw"
+              class="fa-solid fa-fw"
               ng-class="{'fa-check': ctrl.selectedElevationLayer === elevationItem}"
             ></span>
             {{::elevationItem}}

diff --git a/contribs/gmf/examples/share.html b/contribs/gmf/examples/share.html
@@ -14,13 +14,13 @@
     <div class="share">
       <strong> Share the permalink </strong>
       <button class="btn btn-default" ng-click="ctrl.modalShareShown = true">
-        <span class="fa fa-share-alt"></span>
+        <span class="fa-solid fa-share-alt"></span>
       </button>
     </div>
     <div class="share">
       <strong> Share with emailing capability </strong>
       <button class="btn btn-default" ng-click="ctrl.modalShareWithEmailShown = true">
-        <span class="fa fa-share-alt"></span>
+        <span class="fa-solid fa-share-alt"></span>
       </button>
     </div>
 

diff --git a/src/auth/ButtonElement.ts b/src/auth/ButtonElement.ts
@@ -54,7 +54,7 @@ export class ToolButtonAuth extends ToolButtonElement {
         data-placement="left"
         data-original-title="${i18next.t('Login')}"
       >
-        <span class="fa fa-user ${this.login_ ? 'fa-user-xmark' : 'fa-user'}"></span>
+        <span class="fa-solid fa-user ${this.login_ ? 'fa-user-xmark' : 'fa-user'}"></span>
       </button>
     `;
   }

diff --git a/src/auth/FormElement.ts b/src/auth/FormElement.ts
@@ -249,7 +249,7 @@ export default class GmfAuthForm extends GmfBaseElement {
                   ${this.isLoading
                     ? html`
                         <div class="login-spinner">
-                          <i class="fa fa-spin">${svgSpinner()}</i>
+                          <i class="fa-solid fa-spin">${svgSpinner()}</i>
                         </div>
                       `
                     : ''}

diff --git a/src/auth/PanelElement.ts b/src/auth/PanelElement.ts
@@ -61,7 +61,7 @@ export default class GmfAuthPanel extends ToolPanelElement {
     const spinnerTemplate = this.postLoading
       ? html`
           <div>
-            <i class="fa fa-spin svg-spinner">${svgSpinner()}</i>
+            <i class="fa-solid fa-spin svg-spinner">${svgSpinner()}</i>
             ${i18next.t('Loading themes, please wait...')}
           </div>
         `

diff --git a/src/canvas/Desktop.stories.ts b/src/canvas/Desktop.stories.ts
@@ -91,13 +91,13 @@ function Template(args: Args): string {
     '<p slot="map">map 2</p>',
     '<gmf-tool-button slot="tool-button" panelName="1">',
     '  <span>',
-    '    <i class="fa fa-arrow-pointer"></i>',
+    '    <i class="fa-solid fa-arrow-pointer"></i>',
     '  </span>',
     '</gmf-tool-button>',
     '<gmf-tool-panel slot="tool-panel-1" panelName="Title 1"><div>content 1</div></gmf-tool-panel>',
-    '<gmf-tool-button slot="tool-button" iconClasses="fa fa-print" panelName="2"></gmf-tool-button>',
+    '<gmf-tool-button slot="tool-button" iconClasses="fa-solid fa-print" panelName="2"></gmf-tool-button>',
     '<gmf-tool-panel slot="tool-panel-2" panelName="Title 2"><div>content 2</div></gmf-tool-panel>',
-    '<gmf-button-3 slot="tool-button-separate" iconClasses="fa fa-paintbrush" panelName="3"></gmf-button-3>',
+    '<gmf-button-3 slot="tool-button-separate" iconClasses="fa-solid fa-paintbrush" panelName="3"></gmf-button-3>',
     '<gmf-tool-panel slot="tool-panel-3" panelName="Title 3"><div>content 3</div></gmf-tool-panel>',
     '<p slot="footer-3">panel 3</p>',
     '<span slot="infobar-left">left</span>',

diff --git a/src/canvas/DesktopElement.ts b/src/canvas/DesktopElement.ts
@@ -660,8 +660,8 @@ export default class GmfDesktopCanvas extends BaseElement {
             >
               <span
                 class="${this.showDatapanel_
-                  ? 'fa fa-angles-left gmf-app-data-panel-collapse-btn'
-                  : 'fa fa-angles-right gmf-app-data-panel-expand-btn'}"
+                  ? 'fa-solid fa-angles-left gmf-app-data-panel-collapse-btn'
+                  : 'fa-solid fa-angles-right gmf-app-data-panel-expand-btn'}"
               ></span>
             </div>
             <div id="gmf-app-data-panel-separator" class="ui-resizable-e"></div>
@@ -718,7 +718,7 @@ export default class GmfDesktopCanvas extends BaseElement {
                 class="gmf-app-tools-content-toggle-btn btn prime btn-sm"
                 @click=${() => panels.closeToolPanel()}
               >
-                <span class="fa fa-angles-right gmf-app-tools-content-collapse-btn"> </span>
+                <span class="fa-solid fa-angles-right gmf-app-tools-content-collapse-btn"> </span>
               </div>
             </div>
 

diff --git a/src/canvas/ToolButtonsImplElements.ts b/src/canvas/ToolButtonsImplElements.ts
@@ -42,7 +42,7 @@ export class ToolButtonPrint extends ToolButtonElement {
         data-placement="left"
         data-original-title="${i18next.t('Print')}"
       >
-        <span class="fa fa-print"></span>
+        <span class="fa-solid fa-print"></span>
       </button>
     `;
   }
@@ -63,7 +63,7 @@ export class ToolButtonDraw extends ToolButtonElement {
         data-placement="left"
         data-original-title="${i18next.t('Draw and Measure')}"
       >
-        <span class="fa fa-paintbrush"></span>
+        <span class="fa-solid fa-paintbrush"></span>
       </button>
     `;
   }
@@ -118,7 +118,7 @@ export class ToolButtonEditing extends ToolButtonElement {
         data-placement="left"
         data-original-title="${i18next.t('Editing')}"
       >
-        <span class="fa fa-pen-to-square"></span>
+        <span class="fa-solid fa-pen-to-square"></span>
       </button>
     `;
   }
@@ -139,7 +139,7 @@ export class ToolButtonProfile extends ToolButtonElement {
         data-placement="left"
         data-original-title="${i18next.t('Elevation profile')}"
       >
-        <span class="fa fa-chart-area"></span>
+        <span class="fa-solid fa-chart-area"></span>
       </button>
     `;
   }
@@ -160,7 +160,7 @@ export class ToolButtonGooglestreetview extends ToolButtonElement {
         data-placement="left"
         data-original-title="${i18next.t('Google Street View')}"
       >
-        <span class="fa fa-street-view"></span>
+        <span class="fa-solid fa-street-view"></span>
       </button>
     `;
   }
@@ -181,7 +181,7 @@ export class ToolButtonMapillary extends ToolButtonElement {
         data-placement="left"
         data-original-title="${i18next.t('Mapillary')}"
       >
-        <span class="fa fa-street-view"></span>
+        <span class="fa-solid fa-street-view"></span>
       </button>
     `;
   }
@@ -203,8 +203,8 @@ export class ToolButtonSelect extends ToolButtonElement {
         data-original-title="${i18next.t('Selection')}"
       >
         <span>
-          <i class="fa fa-arrow-pointer"></i>
-          <i class="fa fa-info fa-xs offset-info-icon"></i>
+          <i class="fa-solid fa-arrow-pointer"></i>
+          <i class="fa-solid fa-info fa-xs offset-info-icon"></i>
         </span>
       </button>
     `;
@@ -226,7 +226,7 @@ export class ToolButtonImport extends ToolButtonElement {
         data-placement="left"
         data-original-title="${i18next.t('Import Layer')}"
       >
-        <span class="fa fa-upload"></span>
+        <span class="fa-solid fa-upload"></span>
       </button>
     `;
   }
@@ -247,7 +247,7 @@ export class ToolButtonRouting extends ToolButtonElement {
         data-placement="left"
         data-original-title="${i18next.t('Routing')}"
       >
-        <span class="fa fa-signs-post"></span>
+        <span class="fa-solid fa-signs-post"></span>
       </button>
     `;
   }

diff --git a/src/controllers/AbstractAppController.js b/src/controllers/AbstractAppController.js
@@ -777,7 +777,7 @@ AbstractAppController.prototype.setDefaultBackground_ = function (theme) {
  */
 export function getLocationIcon() {
   const arrow = document.createElement('span');
-  arrow.className = 'fa fa-location-crosshairs-arrow';
+  arrow.className = 'fa-solid fa-location-crosshairs-arrow';
   arrow.style.transform = 'rotate(-0.82rad)';
   const arrowWrapper = document.createElement('span');
   arrowWrapper.appendChild(arrow);

diff --git a/src/controllers/AbstractDesktopController.js b/src/controllers/AbstractDesktopController.js
@@ -405,12 +405,12 @@ export class AbstractDesktopController extends AbstractAPIController {
       .appendTo($resizableEastHandle)
       .append(
         $('<span>', {
-          'class': `fa fa-angles-left ${dataPanelCls}-collapse-btn`,
+          'class': `fa-solid fa-angles-left ${dataPanelCls}-collapse-btn`,
         }),
       )
       .append(
         $('<span>', {
-          'class': `fa fa-angles-right ${dataPanelCls}-expand-btn`,
+          'class': `fa-solid fa-angles-right ${dataPanelCls}-expand-btn`,
         }),
       );
     $scope.$watch(
@@ -499,7 +499,7 @@ export class AbstractDesktopController extends AbstractAPIController {
       .appendTo($resizableToolsHandle)
       .append(
         $('<span>', {
-          'class': `fa fa-angles-right ${toolsPanelCls}-collapse-btn`,
+          'class': `fa-solid fa-angles-right ${toolsPanelCls}-collapse-btn`,
         }),
       );