Convert legacy icons

diff --git a/com.woltlab.wcf/templates/__iconFormField.tpl b/com.woltlab.wcf/templates/__iconFormField.tpl
index ad6728ef721d55bfa1a045c1cea01451078f2490..6c47495c41dee18afbe9c4c481ab5d74bdf0f5d1 100644 (file)
--- a/com.woltlab.wcf/templates/__iconFormField.tpl
+++ b/com.woltlab.wcf/templates/__iconFormField.tpl
@@ -19,7 +19,6 @@
                        const input = document.getElementById('{@$field->getPrefixedId()}');
                        
                        const callback = (iconName, forceSolid) => {
-                               icon.className = 'icon icon64 fa-' + iconName;
                                input.value = iconName;
 
                                let icon = iconContainer.querySelector("fa-icon");

diff --git a/com.woltlab.wcf/templates/__suffixFormFieldContainer.tpl b/com.woltlab.wcf/templates/__suffixFormFieldContainer.tpl
index c6ea9e6356eb26dc75c0c37d833a13d7e6eba7eb..a1cc3421d0a39879253479be04149e161ad5b75c 100644 (file)
--- a/com.woltlab.wcf/templates/__suffixFormFieldContainer.tpl
+++ b/com.woltlab.wcf/templates/__suffixFormFieldContainer.tpl
@@ -15,7 +15,7 @@
                                        {/if}
                                {else}
                                        <span class="inputSuffix dropdown" id="{@$element->getSuffixField()->getPrefixedId()}_dropdown">
-                                               <span class="dropdownToggle">{@$element->getSelectedSuffixOption()[label]} <span class="icon icon16 fa-caret-down pointer"></span></span>
+                                               <span class="dropdownToggle">{@$element->getSelectedSuffixOption()[label]} {icon size=16 name='caret-down' type='solid'}</span>
                                                
                                                <ul class="dropdownMenu">
                                                        {foreach from=$element->getSuffixField()->getNestedOptions() item=__fieldNestedOption}

diff --git a/com.woltlab.wcf/templates/__userObjectWatchButton.tpl b/com.woltlab.wcf/templates/__userObjectWatchButton.tpl
index 8a98ab45a8fbf9f9b3ed0683fd504239b66f04a8..c60374a51ac15348ca05efa9a7c08a377c25f801 100644 (file)
--- a/com.woltlab.wcf/templates/__userObjectWatchButton.tpl
+++ b/com.woltlab.wcf/templates/__userObjectWatchButton.tpl
@@ -1,7 +1,11 @@
 {if $__wcf->user->userID}
        <div class="dropdown contentInteractionButton">
                <a class="jsTooltip button small dropdownToggle jsSubscribeButton userObjectWatchDropdownToggle{if $isSubscribed} active{/if}" data-object-type="{$objectType}" data-object-id="{$objectID}" data-is-subscribed="{if $isSubscribed}1{else}0{/if}">
-                       <span class="icon icon16 fa-bookmark{if !$isSubscribed}-o{/if}"></span>
+                       {if $isSubscribed}
+                               {icon size=16 name='bookmark' type='solid'}
+                       {else}
+                               {icon size=16 name='bookmark'}
+                       {/if}
                        <span>{if $isSubscribed}{lang}wcf.user.objectWatch.button.subscribed{/lang}{else}{lang}wcf.user.objectWatch.button.subscribe{/lang}{/if}</span>
                </a>
                <ul class="dropdownMenu userObjectWatchDropdown" data-object-type="{$objectType}" data-object-id="{$objectID}">

diff --git a/com.woltlab.wcf/templates/aclSimple.tpl b/com.woltlab.wcf/templates/aclSimple.tpl
index 57f18f4e3a9ff7f2f3515ecd1b67737494e071c2..8165da1ef1ce54fa59481d1a1df3f74d8d702446 100644 (file)
--- a/com.woltlab.wcf/templates/aclSimple.tpl
+++ b/com.woltlab.wcf/templates/aclSimple.tpl
@@ -57,15 +57,19 @@
                                        <li>
                                                {icon size=16 name='users'}
                                                <span class="aclLabel">{$aclGroup}</span>
-                                               <span class="icon icon16 fa-times pointer jsTooltip" title="{lang}wcf.global.button.delete{/lang}"></span>
+                                               <button class="aclItemDeleteButton jsTooltip" title="{lang}wcf.global.button.delete{/lang}">
+                                                       <fa-icon size="16" name="xmark"></fa-icon>
+                                               </button>
                                                <input type="hidden" name="{@$__aclInputName}[group][]" value="{@$aclGroup->groupID}">
                                        </li>
                                {/foreach}
                                {foreach from=$aclValues[user] item=aclUser}
                                        <li>
-                                               {icon size=16 name='user' type='solid'}
+                                               {icon size=16 name='user'}
                                                <span class="aclLabel">{$aclUser}</span>
-                                               <span class="icon icon16 fa-times pointer jsTooltip" title="{lang}wcf.global.button.delete{/lang}"></span>
+                                               <button class="aclItemDeleteButton jsTooltip" title="{lang}wcf.global.button.delete{/lang}">
+                                                       <fa-icon size="16" name="xmark"></fa-icon>
+                                               </button>
                                                <input type="hidden" name="{@$__aclInputName}[user][]" value="{@$aclUser->userID}">
                                        </li>
                                {/foreach}

diff --git a/com.woltlab.wcf/templates/articleList.tpl b/com.woltlab.wcf/templates/articleList.tpl
index b4b3c3036f936701b9a193ba46a77eaa890661cc..894607174331082264e6243080d8812ae79b3ec7 100644 (file)
--- a/com.woltlab.wcf/templates/articleList.tpl
+++ b/com.woltlab.wcf/templates/articleList.tpl
@@ -63,7 +63,14 @@
 
 {capture assign='contentInteractionButtons'}
        <div class="contentInteractionButton dropdown jsOnly">
-               <a href="#" class="button small dropdownToggle"><span class="icon icon16 fa-sort-amount-{$sortOrder|strtolower}"></span> <span>{lang}wcf.article.button.sort{/lang}</span></a>
+               <a href="#" class="button small dropdownToggle">
+                       {if $sortOrder|strtolower === 'asc'}
+                               {icon size=16 name='arrow-down-short-wide'}
+                       {else}
+                               {icon size=16 name='arrow-down-wide-short'}
+                       {/if}
+                       <span>{lang}wcf.article.button.sort{/lang}</span>
+               </a>
                <ul class="dropdownMenu">
                        <li><a href="{link controller='ArticleList'}pageNo={@$pageNo}{if $user}&userID={@$user->userID}{/if}&sortField=title&sortOrder={if $sortField == 'title' && $sortOrder == 'ASC'}DESC{else}ASC{/if}{/link}">{lang}wcf.global.title{/lang}{if $sortField == 'title'} <span class="icon icon16 fa-caret-{if $sortOrder == 'ASC'}up{else}down{/if}"></span>{/if}</a></li>
                        <li><a href="{link controller='ArticleList'}pageNo={@$pageNo}{if $user}&userID={@$user->userID}{/if}&sortField=time&sortOrder={if $sortField == 'time' && $sortOrder == 'ASC'}DESC{else}ASC{/if}{/link}">{lang}wcf.global.date{/lang}{if $sortField == 'time'} <span class="icon icon16 fa-caret-{if $sortOrder == 'ASC'}up{else}down{/if}"></span>{/if}</a></li>

diff --git a/com.woltlab.wcf/templates/editHistory.tpl b/com.woltlab.wcf/templates/editHistory.tpl
index cbf641e932d1c056a6950acd6c67ff14889b67be..4bc711587e9dce88ced54c2766101657a46eee6f 100644 (file)
--- a/com.woltlab.wcf/templates/editHistory.tpl
+++ b/com.woltlab.wcf/templates/editHistory.tpl
@@ -77,7 +77,9 @@
                        <tbody>
                                <tr>
                                        <td class="columnIcon">
-                                               <span class="icon icon16 fa-undo disabled"></span>
+                                               <span class="disabled">
+                                                       {icon size=16 name='rotate-left'}
+                                               </span>
                                                <input type="radio" name="oldID" value="current"{if $oldID === 'current'} checked{/if}> <input type="radio" name="newID" value="current"{if $newID === 'current'} checked{/if}>
                                                {event name='rowButtons'}
                                        </td>
@@ -91,7 +93,9 @@
                                {foreach from=$objects item=edit name=edit}
                                        <tr class="jsEditRow">
                                                <td class="columnIcon">
-                                                       <span class="icon icon16 fa-undo pointer jsRevertButton jsTooltip" title="{lang}wcf.edit.revert{/lang}" data-object-id="{@$edit->entryID}" data-confirm-message="{lang __encode=true}wcf.edit.revert.sure{/lang}"></span>
+                                                       <button class="jsRevertButton jsTooltip" title="{lang}wcf.edit.revert{/lang}" data-object-id="{@$edit->entryID}" data-confirm-message="{lang __encode=true}wcf.edit.revert.sure{/lang}">
+                                                               {icon size=16 name='rotate-left'}
+                                                       </button>
                                                        <input type="radio" name="oldID" value="{@$edit->entryID}"{if $oldID == $edit->entryID} checked{/if}> <input type="radio" name="newID" value="{@$edit->entryID}"{if $newID == $edit->entryID} checked{/if}>
                                                        {event name='rowButtons'}
                                                </td>

diff --git a/com.woltlab.wcf/templates/lineBreakSeparatedTextOptionType.tpl b/com.woltlab.wcf/templates/lineBreakSeparatedTextOptionType.tpl
index 55ef3f857d6a1b0c292a00414e43facb8fa6c254..a2bbd25552b2f56d02227a2fcf32edaaab61e063 100644 (file)
--- a/com.woltlab.wcf/templates/lineBreakSeparatedTextOptionType.tpl
+++ b/com.woltlab.wcf/templates/lineBreakSeparatedTextOptionType.tpl
@@ -4,7 +4,9 @@
 *}>
     {foreach from=$values item=value}
         <li data-value="{$value}">
-            <span class="icon icon16 fa-times jsDeleteItem jsTooltip pointer" title="{lang}wcf.global.button.delete{/lang}"></span>
+            <button type="button" class="jsDeleteItem jsTooltip" title="{lang}wcf.global.button.delete{/lang}">
+                {icon size=16 name='xmark'}
+            </button>
             <span>{$value}</span>
         </li>
     {/foreach}

diff --git a/com.woltlab.wcf/templates/mediaListItems.tpl b/com.woltlab.wcf/templates/mediaListItems.tpl
index 32ca63cf849933927b89e2d76b3bc68c73baf4ce..45dbbb1009c973001538d438f299d08a5f12a9eb 100644 (file)
--- a/com.woltlab.wcf/templates/mediaListItems.tpl
+++ b/com.woltlab.wcf/templates/mediaListItems.tpl
@@ -19,19 +19,27 @@
                                </li>
                                {if $__wcf->session->getPermission('admin.content.cms.canManageMedia')}
                                        <li class="jsMediaEditButton" data-object-id="{@$media->mediaID}">
-                                               <a><span class="icon icon16 fa-pencil jsTooltip" title="{lang}wcf.global.button.edit{/lang}"></span> <span class="invisible">{lang}wcf.global.button.edit{/lang}</span></a>
+                                               <button class="jsTooltip" title="{lang}wcf.global.button.edit{/lang}">
+                                                       {icon size=16 name='pencil'}
+                                               </button>
                                        </li>
                                        <li class="jsObjectAction" data-object-action="delete" data-confirm-message="{lang title=$__mediaTitle __encode=true}wcf.media.delete.confirmMessage{/lang}">
-                                               <a><span class="icon icon16 fa-times jsTooltip" title="{lang}wcf.global.button.delete{/lang}"></span> <span class="invisible">{lang}wcf.global.button.delete{/lang}</span></a>
+                                               <button class="jsTooltip" title="{lang}wcf.global.button.delete{/lang}">
+                                                       {icon size=16 name='xmark'}
+                                               </button>
                                        </li>
                                {/if}
                                {if $mode == 'editor'}
                                        <li class="jsMediaInsertButton" data-object-id="{@$media->mediaID}">
-                                               <a><span class="icon icon16 fa-plus jsTooltip" title="{lang}wcf.media.button.insert{/lang}"></span> <span class="invisible">{lang}wcf.media.button.insert{/lang}</span></a>
+                                               <button class="jsTooltip" title="{lang}wcf.media.button.insert{/lang}">
+                                                       {icon size=16 name='plus'}
+                                               </button>
                                        </li>
                                {elseif $mode == 'select'}
                                        <li class="jsMediaSelectButton" data-object-id="{@$media->mediaID}">
-                                               <a><span class="icon icon16 fa-check jsTooltip" title="{lang}wcf.media.button.select{/lang}"></span> <span class="invisible">{lang}wcf.media.button.select{/lang}</span></a>
+                                               <button class="jsTooltip" title="{lang}wcf.media.button.select{/lang}">
+                                                       {icon size=16 name='check'}
+                                               </button>
                                        </li>
                                {/if}
                        </ul>

diff --git a/com.woltlab.wcf/templates/mediaManager.tpl b/com.woltlab.wcf/templates/mediaManager.tpl
index 0def8b4f965c5a2682ba2ab8c40f423e754863e1..6c15152ced8446e356adf1bd11818d82ec261081 100644 (file)
--- a/com.woltlab.wcf/templates/mediaManager.tpl
+++ b/com.woltlab.wcf/templates/mediaManager.tpl
@@ -28,7 +28,9 @@
 <div class="inputAddon mediaManagerSearch">
        <input type="text" class="mediaManagerSearchField" placeholder="{lang}wcf.media.search.placeholder{/lang}">
        <span class="inputSuffix">
-               <span class="icon icon16 fa-times mediaManagerSearchCancelButton pointer jsTooltip" title="{lang}wcf.media.search.cancel{/lang}"></span>
+               <button class="mediaManagerSearchCancelButton jsTooltip" title="{lang}wcf.media.search.cancel{/lang}">
+                       {icon size=16 name='xmark'}
+               </button>
        </span>
 </div>
 

diff --git a/com.woltlab.wcf/templates/membersList.tpl b/com.woltlab.wcf/templates/membersList.tpl
index 128a848a0d3923f375bf0889c9381cfd1b82e298..5b85bff0d60bc665a3f4b1187f80638e2a25a033 100644 (file)
--- a/com.woltlab.wcf/templates/membersList.tpl
+++ b/com.woltlab.wcf/templates/membersList.tpl
@@ -65,7 +65,7 @@
                                <div class="containerListActiveFilters">
                                        <ul class="inlineList">
                                                {content}
-                                                       {if $letter}<li><span class="icon icon16 fa-bold jsTooltip" title="{lang}wcf.user.members.sort.letters{/lang}"></span> {$letter}</li>{/if}
+                                                       {if $letter}<li class="jsTooltip" title="{lang}wcf.user.members.sort.letters{/lang}">{icon size=16 name='bold'} {$letter}</li>{/if}
                                                {/content}
                                        </ul>
                                </div>

diff --git a/com.woltlab.wcf/templates/messageQuoteList.tpl b/com.woltlab.wcf/templates/messageQuoteList.tpl
index cd9f8c14b31ddd7cb1d3679294c6adebe6ef875c..f2e034d2b350956528c6b6bd511da7168146f22b 100644 (file)
--- a/com.woltlab.wcf/templates/messageQuoteList.tpl
+++ b/com.woltlab.wcf/templates/messageQuoteList.tpl
@@ -36,7 +36,11 @@
                                                        <li data-quote-id="{@$quoteID}" data-is-full-quote="{if $message->isFullQuote($quoteID)}true{else}false{/if}">
                                                                <span>
                                                                        <input type="checkbox" value="1" id="quote_{@$quoteID}" class="jsCheckbox">
-                                                                       {if $supportPaste}<span class="icon icon16 fa-plus jsTooltip jsInsertQuote pointer" title="{lang}wcf.message.quote.insertQuote{/lang}"></span>{/if}
+                                                                       {if $supportPaste}
+                                                                               <button class="jsTooltip jsInsertQuote" title="{lang}wcf.message.quote.insertQuote{/lang}">
+                                                                                       {icon size=16 name='plus'}
+                                                                               </button>
+                                                                       {/if}
                                                                </span>
                                                                
                                                                <div class="jsQuote">

diff --git a/com.woltlab.wcf/templates/messageSidebar.tpl b/com.woltlab.wcf/templates/messageSidebar.tpl
index 9cc04c6a7d7afd4930b087c37fdbedf1dd9a55cc..708f7cdcb6871196e1da0fd588136cfd083c3582 100644 (file)
--- a/com.woltlab.wcf/templates/messageSidebar.tpl
+++ b/com.woltlab.wcf/templates/messageSidebar.tpl
@@ -28,7 +28,11 @@
                                        <span{if $enableMicrodata} itemprop="name"{/if}>{@$userProfile->getFormattedUsername()}</span>
                                </a>
                                {if !$isReply}
-                                       {if $userProfile->banned}<span class="icon icon16 fa-lock jsTooltip jsUserBanned" title="{lang user=$userProfile}wcf.user.banned{/lang}"></span>{/if}
+                                       {if $userProfile->banned}
+                                               <span class="jsTooltip jsUserBanned" title="{lang user=$userProfile}wcf.user.banned{/lang}">
+                                                       {icon size=16 name='lock'}
+                                               </span>
+                                       {/if}
                                        
                                        {event name='messageAuthorContainer'}
                                {/if}

diff --git a/com.woltlab.wcf/templates/moderationList.tpl b/com.woltlab.wcf/templates/moderationList.tpl
index c6d2e7eeefe2ad5980a2cbbdff366756c59dcbcf..f0c50d209d7a8dbcac884a96d903ac8334446428 100644 (file)
--- a/com.woltlab.wcf/templates/moderationList.tpl
+++ b/com.woltlab.wcf/templates/moderationList.tpl
@@ -49,15 +49,15 @@
                                                        <ul class="inlineList">
                                                                {content}
                                                                        {if $definitionID}
-                                                                               <li>
-                                                                                       <span class="icon icon16 fa-tag jsTooltip" title="{lang}wcf.moderation.filterByType{/lang}"></span>
+                                                                               <li class="jsTooltip" title="{lang}wcf.moderation.filterByType{/lang}">
+                                                                                       {icon size=16 name='tag'}
                                                                                        {lang}wcf.moderation.type.{$availableDefinitions[$definitionID]}{/lang}
                                                                                </li>
                                                                        {/if}
                                                                        
                                                                        {if !$assignedUserID || $assignedUserID == $__wcf->getUser()->userID}
-                                                                               <li>
-                                                                                       <span class="icon icon16 fa-user jsTooltip" title="{lang}wcf.moderation.filterByUser{/lang}"></span>
+                                                                               <li class="jsTooltip" title="{lang}wcf.moderation.filterByUser{/lang}">
+                                                                                       {icon size=16 name='user'}
                                                                                        {if !$assignedUserID}
                                                                                                {lang}wcf.moderation.filterByUser.nobody{/lang}
                                                                                        {else}
@@ -67,12 +67,12 @@
                                                                        {/if}
                                                                        
                                                                        {if $status == -1 || $status == 2}
-                                                                               <li>
+                                                                               <li class="jsTooltip" title="{lang}wcf.moderation.status{/lang}">
                                                                                        {if $status == -1}
-                                                                                               <span class="icon icon16 fa-circle-o jsTooltip" title="{lang}wcf.moderation.status{/lang}"></span>
+                                                                                               {icon size=16 name='circle'}
                                                                                                {lang}wcf.moderation.status.outstanding{/lang}
                                                                                        {else}
-                                                                                               <span class="icon icon16 fa-check-circle-o jsTooltip" title="{lang}wcf.moderation.status{/lang}"></span>
+                                                                                               {icon size=16 name='circle-check'}
                                                                                                {lang}wcf.moderation.status.done{/lang}
                                                                                        {/if}
                                                                                </li>
@@ -141,7 +141,7 @@
                                                                <dd>{@$entry->comments|shortUnit}</dd>
                                                        </dl>
                                                        
-                                                       <div class="messageGroupListStatsSimple">{if $entry->comments}<span class="icon icon16 fa-comment-o" aria-label="{lang}wcf.global.comments{/lang}"></span> {@$entry->comments|shortUnit}{/if}</div>
+                                                       <div class="messageGroupListStatsSimple">{if $entry->comments}{icon size=16 name='comment'} {@$entry->comments|shortUnit}{/if}</div>
                                                </li>
                                                <li class="columnLastPost columnDate">
                                                        {if $entry->lastChangeTime}{@$entry->lastChangeTime|time}{/if}

diff --git a/com.woltlab.wcf/templates/optionFieldList.tpl b/com.woltlab.wcf/templates/optionFieldList.tpl
index 871d795dcfac1d56b5764e898672f69c59cb73fe..6e453794cb9a095a50212f99c2636f16769bc906 100644 (file)
--- a/com.woltlab.wcf/templates/optionFieldList.tpl
+++ b/com.woltlab.wcf/templates/optionFieldList.tpl
@@ -7,7 +7,18 @@
                {assign var=error value=''}
        {/if}
        <dl class="{$option->optionName}Input{if $error} formError{/if}">
-               <dt{if $optionData[cssClassName]} class="{$optionData[cssClassName]}"{/if}>{if $isSearchMode|empty || !$optionData[hideLabelInSearch]}<label for="{$option->optionName}">{if VISITOR_USE_TINY_BUILD && $isGuestGroup && $option->excludedInTinyBuild}<span class="icon icon16 fa-bolt red jsTooltip" title="{lang}wcf.acp.group.excludedInTinyBuild{/lang}"></span> {/if}{$langPrefix|concat:$option->optionName|phrase}</label>{/if}</dt>
+               <dt{if $optionData[cssClassName]} class="{$optionData[cssClassName]}"{/if}>
+                       {if $isSearchMode|empty || !$optionData[hideLabelInSearch]}
+                               <label for="{$option->optionName}">
+                                       {if VISITOR_USE_TINY_BUILD && $isGuestGroup && $option->excludedInTinyBuild}
+                                               <span class="jsTooltip" title="{lang}wcf.acp.group.excludedInTinyBuild{/lang}">
+                                                       {icon size=16 name='bolt'}
+                                               </span>
+                                       {/if}
+                                       {$langPrefix|concat:$option->optionName|phrase}
+                               </label>
+                       {/if}
+               </dt>
                <dd>{@$optionData[html]}
                        {if $error}
                                <small class="innerError">

diff --git a/com.woltlab.wcf/templates/pageHeaderSearch.tpl b/com.woltlab.wcf/templates/pageHeaderSearch.tpl
index b62588e92585b56dd86c7e25302a89ff4a23a0d2..232db6834ef293b01925ac7a355cc0d90d3964b2 100644 (file)
--- a/com.woltlab.wcf/templates/pageHeaderSearch.tpl
+++ b/com.woltlab.wcf/templates/pageHeaderSearch.tpl
@@ -20,7 +20,7 @@
 {event name='settings'}
 
 <a href="#" id="pageHeaderSearchMobile" class="pageHeaderSearchMobile" role="button" tabindex="0" aria-expanded="false" aria-label="{lang}wcf.global.search{/lang}">
-       <span class="icon icon32 fa-search" aria-hidden="true"></span>
+       {icon size=32 name='magnifying-glass'}
 </a>
 
 <div id="pageHeaderSearch" class="pageHeaderSearch">
@@ -53,8 +53,8 @@
                        
                        <input type="search" name="q" id="pageHeaderSearchInput" class="pageHeaderSearchInput" placeholder="{lang}wcf.global.search.enterSearchTerm{/lang}" autocomplete="off" value="{if $query|isset}{$query}{/if}">
                        
-                       <button class="pageHeaderSearchInputButton button" type="submit">
-                               <span class="icon icon16 fa-search pointer" title="{lang}wcf.global.search{/lang}"></span>
+                       <button class="pageHeaderSearchInputButton button" type="submit" title="{lang}wcf.global.search{/lang}">
+                               {icon size=16 name='magnifying-glass'}
                        </button>
                        
                        <div id="pageHeaderSearchParameters"></div>

diff --git a/com.woltlab.wcf/templates/pageHeaderUser.tpl b/com.woltlab.wcf/templates/pageHeaderUser.tpl
index 0cd2a61ae58b23296590fd36bab6deab95c35882..af5a5e871356cf80cd4f1890318f385d21113d8b 100644 (file)
--- a/com.woltlab.wcf/templates/pageHeaderUser.tpl
+++ b/com.woltlab.wcf/templates/pageHeaderUser.tpl
@@ -3,7 +3,7 @@
                <span class="userPanelAvatar" aria-hidden="true">{@$__wcf->getUserProfileHandler()->getAvatar()->getImageTag(32, false)}</span>
        {else}
                <a href="{link controller='Login' url=$__wcf->getRequestURI()}{/link}" class="userPanelLoginLink jsTooltip" title="{lang}wcf.user.loginOrRegister{/lang}">
-                       <span class="icon icon32 fa-sign-in" aria-hidden="true"></span>
+                       {icon size=32 name='arrow-right-to-bracket'}
                </a>
        {/if}
        

diff --git a/com.woltlab.wcf/templates/styleChooser.tpl b/com.woltlab.wcf/templates/styleChooser.tpl
index e9b0fb0eab2b4c0f81292050078ed9e47c382e46..de3e2ad305fbeff96edcbad45f187ebd0384c023 100644 (file)
--- a/com.woltlab.wcf/templates/styleChooser.tpl
+++ b/com.woltlab.wcf/templates/styleChooser.tpl
@@ -7,7 +7,14 @@
                                </span>
                                <div class="details">
                                        <div class="containerHeadline">
-                                               <h3>{$style->styleName}{if $style->styleID == $__wcf->getStyleHandler()->getStyle()->styleID} <span class="icon icon16 fa-check-circle" title="{lang}wcf.style.currentStyle{/lang}"></span>{/if}</h3>
+                                               <h3>
+                                                       {$style->styleName}
+                                                       {if $style->styleID == $__wcf->getStyleHandler()->getStyle()->styleID}
+                                                               <span class="jsTooltip" title="{lang}wcf.style.currentStyle{/lang}">
+                                                                       {icon size=16 name='check-circle'}
+                                                               </span>
+                                                       {/if}
+                                               </h3>
                                        </div>
                                        {if $style->styleDescription}<small>{lang}{@$style->styleDescription}{/lang}</small>{/if}
                                </div>

diff --git a/ts/WoltLabSuite/Core/Ui/Acl/Simple.ts b/ts/WoltLabSuite/Core/Ui/Acl/Simple.ts
index 72d970695a81a7ce17eca36d0e0bfbf3a48d196e..5f61a2647e3cddd921a99e08d40a1075b173576a 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/Acl/Simple.ts
+++ b/ts/WoltLabSuite/Core/Ui/Acl/Simple.ts
@@ -87,10 +87,10 @@ class UiAclSimple {
     const objectId = listItem.dataset.objectId!;
 
     const iconName = type === "group" ? "users" : "user";
-    const html = `<fa-icon size="16" name="${iconName}" solid></fa-icon>
+    const html = `<fa-icon size="16" name="${iconName}"></fa-icon>
       <span class="aclLabel">${StringUtil.escapeHTML(label)}</span>
       <button class="aclItemDeleteButton jsTooltip" title="${Language.get("wcf.global.button.delete")}">
-        <fa-icon size="16" name="xmark" solid></fa-icon>
+        <fa-icon size="16" name="xmark"></fa-icon>
       </button>
       <input type="hidden" name="${this.inputName}[${type}][]" value="${objectId}">`;
 

diff --git a/wcfsetup/install/files/acp/templates/__iconFormField.tpl b/wcfsetup/install/files/acp/templates/__iconFormField.tpl
index ad6728ef721d55bfa1a045c1cea01451078f2490..6c47495c41dee18afbe9c4c481ab5d74bdf0f5d1 100644 (file)
--- a/wcfsetup/install/files/acp/templates/__iconFormField.tpl
+++ b/wcfsetup/install/files/acp/templates/__iconFormField.tpl
@@ -19,7 +19,6 @@
                        const input = document.getElementById('{@$field->getPrefixedId()}');
                        
                        const callback = (iconName, forceSolid) => {
-                               icon.className = 'icon icon64 fa-' + iconName;
                                input.value = iconName;
 
                                let icon = iconContainer.querySelector("fa-icon");

diff --git a/wcfsetup/install/files/acp/templates/aclSimple.tpl b/wcfsetup/install/files/acp/templates/aclSimple.tpl
index 57f18f4e3a9ff7f2f3515ecd1b67737494e071c2..8165da1ef1ce54fa59481d1a1df3f74d8d702446 100644 (file)
--- a/wcfsetup/install/files/acp/templates/aclSimple.tpl
+++ b/wcfsetup/install/files/acp/templates/aclSimple.tpl
@@ -57,15 +57,19 @@
                                        <li>
                                                {icon size=16 name='users'}
                                                <span class="aclLabel">{$aclGroup}</span>
-                                               <span class="icon icon16 fa-times pointer jsTooltip" title="{lang}wcf.global.button.delete{/lang}"></span>
+                                               <button class="aclItemDeleteButton jsTooltip" title="{lang}wcf.global.button.delete{/lang}">
+                                                       <fa-icon size="16" name="xmark"></fa-icon>
+                                               </button>
                                                <input type="hidden" name="{@$__aclInputName}[group][]" value="{@$aclGroup->groupID}">
                                        </li>
                                {/foreach}
                                {foreach from=$aclValues[user] item=aclUser}
                                        <li>
-                                               {icon size=16 name='user' type='solid'}
+                                               {icon size=16 name='user'}
                                                <span class="aclLabel">{$aclUser}</span>
-                                               <span class="icon icon16 fa-times pointer jsTooltip" title="{lang}wcf.global.button.delete{/lang}"></span>
+                                               <button class="aclItemDeleteButton jsTooltip" title="{lang}wcf.global.button.delete{/lang}">
+                                                       <fa-icon size="16" name="xmark"></fa-icon>
+                                               </button>
                                                <input type="hidden" name="{@$__aclInputName}[user][]" value="{@$aclUser->userID}">
                                        </li>
                                {/foreach}

diff --git a/wcfsetup/install/files/acp/templates/mediaListItems.tpl b/wcfsetup/install/files/acp/templates/mediaListItems.tpl
index 99eae0c50eef1691a3413d0749176a93d0dff283..45dbbb1009c973001538d438f299d08a5f12a9eb 100644 (file)
--- a/wcfsetup/install/files/acp/templates/mediaListItems.tpl
+++ b/wcfsetup/install/files/acp/templates/mediaListItems.tpl
@@ -3,7 +3,7 @@
                <div class="mediaThumbnail">
                        {@$media->getElementTag(144)}
                </div>
-               
+
                {assign var='__mediaTitle' value=$media->filename}
                {if $media->title}
                        {assign var='__mediaTitle' value=$media->title}
@@ -11,7 +11,7 @@
                <div class="mediaInformation">
                        <p class="mediaTitle" title="{$__mediaTitle}">{$__mediaTitle}</p>
                </div>
-               
+
                <nav class="jsMobileNavigation buttonGroupNavigation">
                        <ul class="buttonList iconList">
                                <li class="mediaCheckbox">
@@ -19,19 +19,27 @@
                                </li>
                                {if $__wcf->session->getPermission('admin.content.cms.canManageMedia')}
                                        <li class="jsMediaEditButton" data-object-id="{@$media->mediaID}">
-                                               <a><span class="icon icon16 fa-pencil jsTooltip" title="{lang}wcf.global.button.edit{/lang}"></span> <span class="invisible">{lang}wcf.global.button.edit{/lang}</span></a>
+                                               <button class="jsTooltip" title="{lang}wcf.global.button.edit{/lang}">
+                                                       {icon size=16 name='pencil'}
+                                               </button>
                                        </li>
                                        <li class="jsObjectAction" data-object-action="delete" data-confirm-message="{lang title=$__mediaTitle __encode=true}wcf.media.delete.confirmMessage{/lang}">
-                                               <a><span class="icon icon16 fa-times jsTooltip" title="{lang}wcf.global.button.delete{/lang}"></span> <span class="invisible">{lang}wcf.global.button.delete{/lang}</span></a>
+                                               <button class="jsTooltip" title="{lang}wcf.global.button.delete{/lang}">
+                                                       {icon size=16 name='xmark'}
+                                               </button>
                                        </li>
                                {/if}
                                {if $mode == 'editor'}
                                        <li class="jsMediaInsertButton" data-object-id="{@$media->mediaID}">
-                                               <a><span class="icon icon16 fa-plus jsTooltip" title="{lang}wcf.media.button.insert{/lang}"></span> <span class="invisible">{lang}wcf.media.button.insert{/lang}</span></a>
+                                               <button class="jsTooltip" title="{lang}wcf.media.button.insert{/lang}">
+                                                       {icon size=16 name='plus'}
+                                               </button>
                                        </li>
                                {elseif $mode == 'select'}
                                        <li class="jsMediaSelectButton" data-object-id="{@$media->mediaID}">
-                                               <a><span class="icon icon16 fa-check jsTooltip" title="{lang}wcf.media.button.select{/lang}"></span> <span class="invisible">{lang}wcf.media.button.select{/lang}</span></a>
+                                               <button class="jsTooltip" title="{lang}wcf.media.button.select{/lang}">
+                                                       {icon size=16 name='check'}
+                                               </button>
                                        </li>
                                {/if}
                        </ul>

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Acl/Simple.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Acl/Simple.js
index 48f9d063ff1a7d4470999717228433ab91de6236..da4b9a6bf327517a4130ea598b9e8bf84013694b 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Acl/Simple.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Acl/Simple.js
@@ -64,10 +64,10 @@ define(["require", "exports", "tslib", "../../Core", "../../Language", "../../St
             const label = listItem.dataset.label;
             const objectId = listItem.dataset.objectId;
             const iconName = type === "group" ? "users" : "user";
-            const html = `<fa-icon size="16" name="${iconName}" solid></fa-icon>
+            const html = `<fa-icon size="16" name="${iconName}"></fa-icon>
       <span class="aclLabel">${StringUtil.escapeHTML(label)}</span>
       <button class="aclItemDeleteButton jsTooltip" title="${Language.get("wcf.global.button.delete")}">
-        <fa-icon size="16" name="xmark" solid></fa-icon>
+        <fa-icon size="16" name="xmark"></fa-icon>
       </button>
       <input type="hidden" name="${this.inputName}[${type}][]" value="${objectId}">`;
             const item = document.createElement("li");