Skip to content

Commit 855bc8e

Browse files
Change some FontAwesome icons to Tabler icons (#19642)
* fix: change some icons fas to ti * marketplace spinner * remove stack in kanban --------- Co-authored-by: Alexandre Delaunay <adelaunay@teclib.com>
1 parent 7ec75b0 commit 855bc8e

File tree

88 files changed

+165
-152
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

88 files changed

+165
-152
lines changed

ajax/comments.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -145,7 +145,7 @@
145145
) {
146146
echo Html::scriptBlock(
147147
sprintf(
148-
'$("#%s").html("href", "&nbsp;<a class=\'fas fa-crosshairs\' href=\'%s\'></a>");',
148+
'$("#%s").html("href", "&nbsp;<a class=\'ti ti-crosshairs\' href=\'%s\'></a>");',
149149
htmlescape($_POST['with_dc_position']),
150150
htmlescape($rack->getLinkURL())
151151
)

ajax/uemailUpdate.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,7 @@
7878
$switch_name = $_POST['field'] . '[use_notification][]';
7979
echo "<div class='my-1 d-flex align-items-center'>
8080
<label for='email_fup_check'>
81-
<i class='far fa-envelope me-1'></i>
81+
<i class='ti ti-mail me-1'></i>
8282
" . __s('Email followup') . "
8383
</label>
8484
<div class='ms-2'>

css/standalone/marketplace.scss

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -159,8 +159,7 @@ $break_s_screen: 1400px;
159159
backdrop-filter: blur(2px);
160160
background-color: rgba(0, 0, 0, 50%);
161161

162-
i.fas,
163-
i.fa-solid {
162+
.spinner-border {
164163
position: absolute;
165164
top: 50%;
166165
left: calc(50% - 1.5rem);

js/common.js

Lines changed: 23 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -922,46 +922,46 @@ var templateItilStatus = function(option) {
922922
var classes = "";
923923
switch (parseInt(status)) {
924924
case 1 :
925-
classes = 'new fas fa-circle';
925+
classes = 'new ti ti-circle-filled';
926926
break;
927927
case 2 :
928-
classes = 'assigned far fa-circle';
928+
classes = 'assigned ti ti-circle';
929929
break;
930930
case 3 :
931-
classes = 'planned far fa-calendar';
931+
classes = 'planned ti ti-calendar';
932932
break;
933933
case 4 :
934-
classes = 'waiting fas fa-circle';
934+
classes = 'waiting ti ti-circle-filled';
935935
break;
936936
case 5 :
937-
classes = 'solved far fa-circle';
937+
classes = 'solved ti ti-circle';
938938
break;
939939
case 6 :
940-
classes = 'closed fas fa-circle';
940+
classes = 'closed ti ti-circle-filled';
941941
break;
942942
case 7:
943-
classes = 'accepted fas fa-check-circle';
943+
classes = 'accepted ti ti-circle-check-filled';
944944
break;
945945
case 8 :
946-
classes = 'observe fas fa-eye';
946+
classes = 'observe ti ti-eye';
947947
break;
948948
case 9 :
949-
classes = 'eval far fa-circle';
949+
classes = 'eval ti ti-circle';
950950
break;
951951
case 10 :
952-
classes = 'approval fas fa-question-circle';
952+
classes = 'approval ti ti-help-circle';
953953
break;
954954
case 11 :
955-
classes = 'test fas fa-question-circle';
955+
classes = 'test ti ti-help-circle';
956956
break;
957957
case 12 :
958-
classes = 'qualif far fa-circle';
958+
classes = 'qualif ti ti-circle';
959959
break;
960960
case 13 :
961-
classes = 'refused far fa-times-circle';
961+
classes = 'refused ti ti-circle-x';
962962
break;
963963
case 14 :
964-
classes = 'canceled fas fa-ban';
964+
classes = 'canceled ti ti-ban';
965965
break;
966966
}
967967

@@ -979,13 +979,13 @@ var templateValidation = function(option) {
979979
var classes = "";
980980
switch (parseInt(status)) {
981981
case 2 : // WAITING
982-
classes = 'waiting far fa-clock';
982+
classes = 'waiting ti ti-clock';
983983
break;
984984
case 3 : // ACCEPTED
985-
classes = 'accepted fas fa-check';
985+
classes = 'accepted ti ti-circle-check-filled';
986986
break;
987987
case 4 : // REFUSED
988-
classes = 'refused fas fa-times';
988+
classes = 'refused ti ti-circle-x';
989989
break;
990990
}
991991

@@ -1003,7 +1003,7 @@ var templateItilPriority = function(option) {
10031003
var color_badge = "";
10041004

10051005
if (priority_color.length > 0) {
1006-
color_badge += `<i class='fas fa-circle' style='color: ${priority_color}'></i>`;
1006+
color_badge += `<i class='ti ti-circle-filled' style='color: ${priority_color}'></i>`;
10071007
}
10081008

10091009
return $(`<span>${color_badge}&nbsp;${option.text}</span>`);
@@ -1596,19 +1596,19 @@ function initSortableTable(element_id) {
15961596
const current_sort = element.data('sort');
15971597
element.data('sort', column_index);
15981598
const current_order = element.data('order');
1599-
const new_order = current_sort === column_index && current_order === 'asc' ? 'desc' : 'asc';
1599+
const new_order = current_sort === column_index && current_order === 'up' ? 'down' : 'up';
16001600
element.data('order', new_order);
16011601
const sortable_header = element.find('thead').first();
16021602
const col = sortable_header.find('th').eq(column_index);
16031603
// Remove all sort icon classes
1604-
sortable_header.find('th i[class*="fa-sort"]').removeClass('fa-sort fa-sort-asc fa-sort-desc');
1604+
sortable_header.find('th i[class*="ti ti-caret"]').removeClass('ti-caret-down-filled ti-caret-up-filled');
16051605

16061606
const sort_icon = col.find('i');
16071607
if (sort_icon.length === 0) {
16081608
// Add sort icon
1609-
col.eq(0).append(`<i class="fas fa-sort-${new_order}"></i>`);
1609+
col.eq(0).append(`<i class="ti ti-caret-${new_order}-filled"></i>`);
16101610
} else {
1611-
sort_icon.addClass(new_order === 'asc' ? 'fa-sort-asc' : 'fa-sort-desc');
1611+
sort_icon.addClass(new_order === 'up' ? 'ti-caret-up-filled' : 'ti-caret-down-filled');
16121612
}
16131613

16141614
const rows = element.find('tbody tr');
@@ -1633,7 +1633,7 @@ function initSortableTable(element_id) {
16331633
if (a_value === b_value) {
16341634
return 0;
16351635
}
1636-
if (new_order === 'asc') {
1636+
if (new_order === 'up') {
16371637
return a_value < b_value ? -1 : 1;
16381638
}
16391639
return a_value > b_value ? -1 : 1;

js/impact.js

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1371,45 +1371,45 @@ var GLPIImpact = {
13711371
return [
13721372
{
13731373
id : 'goTo',
1374-
content : '<i class="fas fa-link me-2"></i>' + __("Go to"),
1374+
content : '<i class="ti ti-external-link me-2"></i>' + __("Go to"),
13751375
tooltipText : _.unescape(__("Open this element in a new tab")),
13761376
selector : 'node[link]',
13771377
onClickFunction: this.menuOnGoTo
13781378
},
13791379
{
13801380
id : 'showOngoing',
1381-
content : '<i class="fas fa-list me-2"></i>' + __("Show ongoing tickets"),
1381+
content : '<i class="ti ti-alert-circle me-2"></i>' + __("Show ongoing tickets"),
13821382
tooltipText : _.unescape(__("Show ongoing tickets for this item")),
13831383
selector : 'node[hasITILObjects=1]',
13841384
onClickFunction: this.menuOnShowOngoing
13851385
},
13861386
{
13871387
id : 'editEdge',
1388-
content : '<i class="fas fa-edit me-2"></i>' + __("Edge properties..."),
1388+
content : '<i class="ti ti-edit me-2"></i>' + __("Edge properties..."),
13891389
tooltipText : _.unescape(__("Set name for this edge")),
13901390
selector : 'edge',
13911391
onClickFunction: this.menuOnEditEdge,
13921392
show : !this.readonly,
13931393
},
13941394
{
13951395
id : 'editCompound',
1396-
content : '<i class="fas fa-edit me-2"></i>' + __("Group properties..."),
1396+
content : '<i class="ti ti-edit me-2"></i>' + __("Group properties..."),
13971397
tooltipText : _.unescape(__("Set name and/or color for this group")),
13981398
selector : 'node:parent',
13991399
onClickFunction: this.menuOnEditCompound,
14001400
show : !this.readonly,
14011401
},
14021402
{
14031403
id : 'removeFromCompound',
1404-
content : '<i class="fas fa-external-link-alt me-2"></i>' + __("Remove from group"),
1404+
content : '<i class="ti ti-home-move me-2"></i>' + __("Remove from group"),
14051405
tooltipText : _.unescape(__("Remove this asset from the group")),
14061406
selector : 'node:child',
14071407
onClickFunction: this.menuOnRemoveFromCompound,
14081408
show : !this.readonly,
14091409
},
14101410
{
14111411
id : 'delete',
1412-
content : '<i class="fas fa-trash me-2"></i>' + __("Delete"),
1412+
content : '<i class="ti ti-trash me-2"></i>' + __("Delete"),
14131413
tooltipText : _.unescape(__("Delete element")),
14141414
selector : 'node, edge',
14151415
onClickFunction: this.menuOnDelete,
@@ -3678,7 +3678,7 @@ var GLPIImpact = {
36783678
str += value["name"];
36793679

36803680
if (isHidden) {
3681-
str += '<i class="fas fa-eye-slash impact-res-hidden"></i>';
3681+
str += '<i class="ti ti-eye-off impact-res-hidden"></i>';
36823682
}
36833683

36843684
str += "</p>";

js/marketplace.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@ $(document).ready(function() {
5454

5555
icon
5656
.removeClass()
57-
.addClass('fas fa-spinner fa-spin');
57+
.addClass('spinner-border');
5858

5959
const executeAction = function () {
6060
if (action === 'download_plugin'
@@ -155,7 +155,7 @@ var filterPluginList = function(page, force) {
155155
}
156156

157157
plugins_list
158-
.append("<div class='loading-plugins'><i class='fas fa-spinner fa-pulse'></i></div>");
158+
.append("<div class='loading-plugins'><div class='spinner-border'></div></div>");
159159
pagination.find('li.current').removeClass('current');
160160

161161
var jqxhr = $.get(ajax_url, {
@@ -192,13 +192,13 @@ var refreshPlugins = function(page, force) {
192192
var icon = $('.marketplace:visible .refresh-plugin-list');
193193

194194
icon
195-
.removeClass('fa-sync-alt')
196-
.addClass('fa-spinner fa-spin');
195+
.removeClass('ti ti-refresh')
196+
.addClass('spinner-border spinner-border-sm');
197197

198198
$.when(filterPluginList(page, force)).then(function() {
199199
icon
200-
.removeClass('fa-spinner fa-spin')
201-
.addClass('fa-sync-alt');
200+
.removeClass('spinner-border spinner-border-sm')
201+
.addClass('ti ti-refresh');
202202
current_page = page;
203203

204204
addTooltips();

js/modules/Dashboard/Dashboard.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1109,7 +1109,7 @@ class GLPIDashboard {
11091109
this.fitNumbers(card);
11101110
this.animateNumbers(card);
11111111
}, () => {
1112-
card.html("<div class='empty-card card-error'><i class='fas fa-exclamation-triangle'></i></div>");
1112+
card.html("<div class='empty-card card-error'><i class='ti ti-alert-triangle'></i></div>");
11131113
}));
11141114
});
11151115

@@ -1149,13 +1149,13 @@ class GLPIDashboard {
11491149
}
11501150
});
11511151
if (!has_result) {
1152-
card.html("<div class='empty-card card-error'><i class='fas fa-exclamation-triangle'></i></div>");
1152+
card.html("<div class='empty-card card-error'><i class='ti ti-alert-triangle'></i></div>");
11531153
}
11541154
});
11551155
}, () => {
11561156
$.each(requested_cards, (i2, crd) => {
11571157
const card = crd.card_el;
1158-
card.html("<div class='empty-card card-error'><i class='fas fa-exclamation-triangle'></i></div>");
1158+
card.html("<div class='empty-card card-error'><i class='ti ti-alert-triangle'></i></div>");
11591159
});
11601160
});
11611161
}

js/planning.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -158,7 +158,7 @@ var GLPIPlanning = {
158158
}
159159
$(info.el)
160160
.find('.fc-cell-text')
161-
.prepend(`<i class="fas fa-${icon}"></i>&nbsp;`);
161+
.prepend(`<i class="ti ti-${icon}"></i>&nbsp;`);
162162

163163
if (info.resource._resource.extendedProps.itemtype == 'Group_User') {
164164
info.el.style.backgroundColor = 'lightgray';
@@ -278,10 +278,10 @@ var GLPIPlanning = {
278278
// create new one
279279
var actions = '';
280280
if (options.can_create) {
281-
actions += `<li class="clone-event"><i class="far fa-clone"></i>${__("Clone")}</li>`;
281+
actions += `<li class="clone-event"><i class="ti ti-copy"></i>${__("Clone")}</li>`;
282282
}
283283
if (options.can_delete) {
284-
actions += `<li class="delete-event"><i class="fas fa-trash"></i>${__("Delete")}</li>`;
284+
actions += `<li class="delete-event"><i class="ti ti-trash"></i>${__("Delete")}</li>`;
285285
}
286286
if (actions == '') {
287287
return;
@@ -360,7 +360,7 @@ var GLPIPlanning = {
360360
} else {
361361
glpi_html_dialog({
362362
title: __("Make a choice"),
363-
body: `${__("Delete the whole serie of the recurrent event")}<br>${
363+
body: `${__("Delete the whole serie of the recurrent event")}<br>${
364364
__("or just add an exception by deleting this instance?")}`,
365365
buttons: [{
366366
label: __("Serie"),
@@ -392,9 +392,9 @@ var GLPIPlanning = {
392392
// attach button (planning and refresh) in planning header
393393
$(`#${GLPIPlanning.dom_id} .fc-toolbar .fc-center h2`)
394394
.after(
395-
$('<i id="refresh_planning" class="fa fa-sync pointer"></i>')
395+
$('<i id="refresh_planning" class="ti ti-refresh pointer"></i>')
396396
).after(
397-
$('<div id="planning_datepicker"><a data-toggle><i class="far fa-calendar-alt fa-lg pointer"></i></a>')
397+
$('<div id="planning_datepicker"><a data-toggle><i class="ti ti-calendar pointer"></i></a>')
398398
);
399399

400400
// specific process for full list

js/src/vue/FuzzySearch/Modal.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -107,7 +107,7 @@
107107
</div>
108108
<div class="modal-body">
109109
<div class="alert alert-info d-flex" role="alert">
110-
<i class="fas fa-exclamation-circle fa-2x me-2"></i>
110+
<i class="ti ti-alert-circle-filled fa-2x me-2"></i>
111111
<p v-html="shortcut_message"></p>
112112
</div>
113113
<input type="text" class="form-control" :placeholder="placeholder" v-model="input_text">

js/src/vue/Kanban/TeamBadgeProvider.js

Lines changed: 7 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ export class TeamBadgeProvider {
4646
* The size in pixels for the team badges
4747
* @type {number}
4848
*/
49-
this.team_image_size = 22;
49+
this.team_image_size = 26;
5050
this.max_team_images = max_team_images;
5151
this.display_initials = display_initials;
5252

@@ -97,16 +97,16 @@ export class TeamBadgeProvider {
9797
// Pictures from groups, supplier, contact
9898
switch (itemtype) {
9999
case 'Group':
100-
this.badges[itemtype][items_id] = this.generateOtherBadge(team_member, 'fa-users');
100+
this.badges[itemtype][items_id] = this.generateOtherBadge(team_member, 'ti ti-users-group');
101101
break;
102102
case 'Supplier':
103-
this.badges[itemtype][items_id] = this.generateOtherBadge(team_member, 'fa-briefcase');
103+
this.badges[itemtype][items_id] = this.generateOtherBadge(team_member, 'ti ti-truck-loading');
104104
break;
105105
case 'Contact':
106-
this.badges[itemtype][items_id] = this.generateOtherBadge(team_member, 'fa-user');
106+
this.badges[itemtype][items_id] = this.generateOtherBadge(team_member, 'ti ti-user');
107107
break;
108108
default:
109-
this.badges[itemtype][items_id] = this.generateOtherBadge(team_member, 'fa-user');
109+
this.badges[itemtype][items_id] = this.generateOtherBadge(team_member, 'ti ti-user');
110110
}
111111
return this.badges[itemtype][items_id];
112112
}
@@ -232,9 +232,8 @@ export class TeamBadgeProvider {
232232
const name = team_member['name'].replace(/"/g, '&quot;').replace(/'/g, '&#39;');
233233

234234
return `
235-
<span class='fa-stack fa-lg' style='font-size: ${(this.team_image_size / 2)}px'>
236-
<i class='fas fa-circle fa-stack-2x' style="color: ${bg_color}" title="${team_member['name']}"></i>
237-
<i class='fas ${icon} fa-stack-1x' title="${name}" data-bs-toggle='tooltip' data-bs-placement='top'></i>
235+
<span class="badge badge-pill" style="background-color: ${bg_color}; font-size: ${(this.team_image_size / 2)}px; height: 26px">
236+
<i class='${icon}' title="${name}" data-bs-toggle='tooltip' data-bs-placement='top'></i>
238237
</span>
239238
`;
240239
}

0 commit comments

Comments
 (0)