https://iefponline.iefp.pt/IEFP/lib/font-awesome-custom/font-awesome-custom.js

1/**
2 *
3 */
4const FONT_AWESOME_INVERT_COLOR_CLASS = 'fa-inverse';
5const COLOR_CLASS_PATTERN = /\btext-[a-zA-Z0-9_-]+\b/g;
6const SKIP_INVERT_COLOR_CLASS = 'skip';
7
8let getColorClass = ($element) => {
9    let classes = $element.attr('class').split(/\s+/);
10
11    for (let cls of classes) {
12        if (COLOR_CLASS_PATTERN.test(cls) || cls === FONT_AWESOME_INVERT_COLOR_CLASS) {
13            return cls;
14        }
15    }
16
17    return '';
18};
19
20let storeOriginalColors = ($el) => {
21    let $faStacks = $el.find('.fa-stack').not(`.${SKIP_INVERT_COLOR_CLASS}`);
22
23    $faStacks.each(function(i, faStackElement) {
24        let $faIcons = $(faStackElement).find('.fa');
25
26        if ($faIcons.length === 2) {
27            let $faStack = $(faStackElement);
28            let $faIcon1 = $($faIcons.get(0));
29            let $faIcon2 = $($faIcons.get(1));
30
31            $faStack.data('original-color-1', getColorClass($faIcon1));
32            $faStack.data('original-color-2', getColorClass($faIcon2));
33        }
34    });
35};
36
37let invertColorClasses = ($el) => {
38
39    let $faStacks = $el.find('.fa-stack').not(`.${SKIP_INVERT_COLOR_CLASS}`);
40
41    $faStacks.each(function(i, faStackElement) {
42        let $faIcons = $(faStackElement).find('.fa');
43
44        if ($faIcons.length !== 2) {
45            console.error('Expected exactly 2 .fa elements inside .fa-stack, found', $faIcons.length, " to invert colors, it must be exactly 2.");
46            return;
47        }
48
49        let $faStack = $(faStackElement);
50        let $faIcon1 = $($faIcons.get(0));
51        let $faIcon2 = $($faIcons.get(1));
52
53        let originalColor1 = $faStack.data('original-color-1');
54        let originalColor2 = $faStack.data('original-color-2');
55
56        // Invert colors
57        $faIcon1.removeClass(originalColor1).addClass(originalColor2);
58        $faIcon2.removeClass(originalColor2).addClass(originalColor1);
59    });
60};
61
62let restoreColorClasses = ($el) => {
63
64    let $faStacks = $el.find('.fa-stack');
65
66    $faStacks.each(function(i, faStackElement) {
67        let $faIcons = $(faStackElement).find('.fa');
68
69        if ($faIcons.length !== 2) {
70            return;
71        }
72
73        let $faStack = $(faStackElement);
74        let $faIcon1 = $($faIcons.get(0));
75        let $faIcon2 = $($faIcons.get(1));
76
77        let originalColor1 = $faStack.data('original-color-1');
78        let originalColor2 = $faStack.data('original-color-2');
79
80        // Restore original colors
81        $faIcon1.removeClass(originalColor2).addClass(originalColor1);
82        $faIcon2.removeClass(originalColor1).addClass(originalColor2);
83    });
84};
85
86$(() => {
87    let $invertElements = $('.fa-stack-invert-colors-hover');
88
89    // Store original colors on page load
90    storeOriginalColors($invertElements);
91
92    // Attach event handlers with explicit invert/restore actions
93    $invertElements.on('mouseenter focus', function() { invertColorClasses($(this)); });
94    $invertElements.on('mouseleave blur', function() { restoreColorClasses($(this)); });
95});