Add system-wide IcoMoon to Font Awesome 7 compatibility layer
Replace the partial 10-icon mapping with a comprehensive layer that covers 80+ Joomla IcoMoon icon-* classes. All icon-* prefixed elements now render using Font Awesome 7 Free glyphs via ::before pseudo-elements with the correct font-family, weight, and smoothing. Covers navigation, actions, objects, status, media, layout, and publishing icons. Also fix back-to-top icon in error.php (icon-arrow-up → fa-solid fa-arrow-up). Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -418,7 +418,7 @@ $wa->useScript('user.js'); // js/user.js
|
||||
|
||||
<?php if ($this->params->get('backTop') == 1) : ?>
|
||||
<a href="#top" id="back-top" class="back-to-top-link" aria-label="<?php echo Text::_('TPL_MOKOCASSIOPEIA_BACKTOTOP'); ?>">
|
||||
<span class="icon-arrow-up icon-fw" aria-hidden="true"></span>
|
||||
<span class="fa-solid fa-arrow-up" aria-hidden="true"></span>
|
||||
</a>
|
||||
<?php endif; ?>
|
||||
|
||||
|
||||
@@ -18636,17 +18636,114 @@ nav[data-toggle=toc] .nav-link.active+ul{
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* Icon mappings */
|
||||
.icon-menu::before { content: "\f0c9"; } /* bars */
|
||||
.icon-search::before { content: "\f002"; }
|
||||
.icon-user::before { content: "\f007"; }
|
||||
.icon-edit::before { content: "\f044"; }
|
||||
.icon-save::before { content: "\f0c7"; }
|
||||
.icon-trash::before { content: "\f1f8"; }
|
||||
.icon-cancel::before { content: "\f00d"; }
|
||||
.icon-check::before { content: "\f00c"; }
|
||||
.icon-plus::before { content: "\f067"; }
|
||||
.icon-minus::before { content: "\f068"; }
|
||||
/* IcoMoon → Font Awesome 7 compatibility layer.
|
||||
Joomla core renders icon-* classes via IcoMoon; this maps them to
|
||||
FA7 Free glyphs so icons render without loading a second icon font. */
|
||||
[class^="icon-"]::before,
|
||||
[class*=" icon-"]::before {
|
||||
font-family: "Font Awesome 7 Free", "Font Awesome 6 Free", sans-serif;
|
||||
font-weight: 900;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.icon-fw { width: 1.25em; text-align: center; }
|
||||
|
||||
/* Navigation & UI */
|
||||
.icon-menu::before { content: "\f0c9"; } /* bars */
|
||||
.icon-search::before { content: "\f002"; }
|
||||
.icon-home::before { content: "\f015"; }
|
||||
.icon-arrow-up::before { content: "\f062"; }
|
||||
.icon-arrow-down::before { content: "\f063"; }
|
||||
.icon-arrow-left::before { content: "\f060"; }
|
||||
.icon-arrow-right::before { content: "\f061"; }
|
||||
.icon-chevron-up::before { content: "\f077"; }
|
||||
.icon-chevron-down::before { content: "\f078"; }
|
||||
.icon-chevron-left::before { content: "\f053"; }
|
||||
.icon-chevron-right::before { content: "\f054"; }
|
||||
.icon-caret-up::before { content: "\f0d8"; }
|
||||
.icon-caret-down::before { content: "\f0d7"; }
|
||||
|
||||
/* Actions */
|
||||
.icon-edit::before { content: "\f044"; }
|
||||
.icon-save::before { content: "\f0c7"; }
|
||||
.icon-trash::before { content: "\f1f8"; }
|
||||
.icon-delete::before { content: "\f1f8"; }
|
||||
.icon-cancel::before { content: "\f00d"; }
|
||||
.icon-remove::before { content: "\f00d"; }
|
||||
.icon-check::before { content: "\f00c"; }
|
||||
.icon-plus::before { content: "\f067"; }
|
||||
.icon-minus::before { content: "\f068"; }
|
||||
.icon-copy::before { content: "\f0c5"; }
|
||||
.icon-refresh::before { content: "\f021"; }
|
||||
.icon-undo::before { content: "\f0e2"; }
|
||||
.icon-download::before { content: "\f019"; }
|
||||
.icon-upload::before { content: "\f093"; }
|
||||
.icon-print::before { content: "\f02f"; }
|
||||
|
||||
/* Objects */
|
||||
.icon-user::before { content: "\f007"; }
|
||||
.icon-users::before { content: "\f0c0"; }
|
||||
.icon-lock::before { content: "\f023"; }
|
||||
.icon-unlock::before { content: "\f09c"; }
|
||||
.icon-key::before { content: "\f084"; }
|
||||
.icon-envelope::before { content: "\f0e0"; }
|
||||
.icon-mail::before { content: "\f0e0"; }
|
||||
.icon-calendar::before { content: "\f073"; }
|
||||
.icon-clock::before { content: "\f017"; }
|
||||
.icon-eye::before { content: "\f06e"; }
|
||||
.icon-eye-close::before { content: "\f070"; }
|
||||
.icon-star::before { content: "\f005"; }
|
||||
.icon-star-empty::before { content: "\f005"; font-weight: 400; }
|
||||
.icon-heart::before { content: "\f004"; }
|
||||
.icon-comment::before { content: "\f075"; }
|
||||
.icon-comments::before { content: "\f086"; }
|
||||
.icon-folder::before { content: "\f07b"; }
|
||||
.icon-folder-open::before { content: "\f07c"; }
|
||||
.icon-file::before { content: "\f15b"; }
|
||||
.icon-image::before { content: "\f03e"; }
|
||||
.icon-camera::before { content: "\f030"; }
|
||||
.icon-tag::before { content: "\f02b"; }
|
||||
.icon-tags::before { content: "\f02c"; }
|
||||
.icon-link::before { content: "\f0c1"; }
|
||||
.icon-globe::before { content: "\f0ac"; }
|
||||
.icon-flag::before { content: "\f024"; }
|
||||
|
||||
/* Status & info */
|
||||
.icon-info::before { content: "\f129"; }
|
||||
.icon-info-circle::before { content: "\f05a"; }
|
||||
.icon-warning::before { content: "\f071"; }
|
||||
.icon-exclamation-triangle::before { content: "\f071"; }
|
||||
.icon-question::before { content: "\f128"; }
|
||||
.icon-question-circle::before { content: "\f059"; }
|
||||
.icon-ban-circle::before { content: "\f05e"; }
|
||||
|
||||
/* Media & layout */
|
||||
.icon-cog::before { content: "\f013"; }
|
||||
.icon-cogs::before { content: "\f085"; }
|
||||
.icon-wrench::before { content: "\f0ad"; }
|
||||
.icon-list::before { content: "\f03a"; }
|
||||
.icon-th::before { content: "\f00a"; }
|
||||
.icon-th-large::before { content: "\f009"; }
|
||||
.icon-grid::before { content: "\f00a"; }
|
||||
.icon-grid-2::before { content: "\f009"; }
|
||||
.icon-bars::before { content: "\f0c9"; }
|
||||
.icon-share::before { content: "\f064"; }
|
||||
.icon-share-alt::before { content: "\f1e0"; }
|
||||
.icon-rss::before { content: "\f09e"; }
|
||||
.icon-feed::before { content: "\f09e"; }
|
||||
.icon-external-link::before { content: "\f35d"; }
|
||||
.icon-signup::before { content: "\f234"; }
|
||||
|
||||
/* Publishing */
|
||||
.icon-publish::before { content: "\f00c"; }
|
||||
.icon-unpublish::before { content: "\f00d"; }
|
||||
.icon-featured::before { content: "\f005"; }
|
||||
.icon-unfeatured::before { content: "\f005"; font-weight: 400; }
|
||||
.icon-archive::before { content: "\f187"; }
|
||||
.icon-unarchive::before { content: "\f187"; }
|
||||
|
||||
/* ===== BOOTSTRAP & JOOMLA BUTTONS ===== */
|
||||
.btn-primary {
|
||||
|
||||
Reference in New Issue
Block a user