Use an icon element for the breadcrumbs indicator

diff --git a/com.woltlab.wcf/templates/breadcrumbs.tpl b/com.woltlab.wcf/templates/breadcrumbs.tpl
index 22a1b13d6841eafbc700bfe779726c1092610bb0..e34c000dc6c10c59ccb6fa8ec19b692d3831839b 100644 (file)
--- a/com.woltlab.wcf/templates/breadcrumbs.tpl
+++ b/com.woltlab.wcf/templates/breadcrumbs.tpl
@@ -4,11 +4,18 @@
        <nav class="breadcrumbs" aria-label="{lang}wcf.page.breadcrumb{/lang}">
                <ol{if $__microdata} itemprop="breadcrumb" itemscope itemtype="http://schema.org/BreadcrumbList"{/if}>
                        {content}
-                               {foreach from=$__wcf->getBreadcrumbs() item=$breadcrumb}
+                               {foreach name='breadcrumbs' from=$__wcf->getBreadcrumbs() item=$breadcrumb}
                                        {* skip breadcrumbs that do not expose a visible label *}
                                        {if $breadcrumb->getLabel()}
                                                <li title="{$breadcrumb->getLabel()}"{if $__microdata} itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"{/if}>
-                                                       <a href="{$breadcrumb->getURL()}"{if $__microdata} itemprop="item"{/if}><span{if $__microdata} itemprop="name"{/if}>{$breadcrumb->getLabel()}</span></a>
+                                                       <a href="{$breadcrumb->getURL()}"{if $__microdata} itemprop="item"{/if}>
+                                                               {if $tpl.foreach.breadcrumbs.last}
+                                                                       <span class="breadcrumbsParentIndicator">
+                                                                               {icon size=16 name='arrow-left-long'}
+                                                                       </span>
+                                                               {/if}
+                                                               <span{if $__microdata} itemprop="name"{/if}>{$breadcrumb->getLabel()}</span>
+                                                       </a>
                                                        {if $__microdata}
                                                                <meta itemprop="position" content="{@$__breadcrumbPos}">
                                                                {assign var='__breadcrumbPos' value=$__breadcrumbPos+1}

diff --git a/wcfsetup/install/files/style/layout/pageNavigation.scss b/wcfsetup/install/files/style/layout/pageNavigation.scss
index 0efba49156874e28175f39a7adab9abc182e2616..c839fe9f979f76469125e2a21007d2d6109779e6 100644 (file)
--- a/wcfsetup/install/files/style/layout/pageNavigation.scss
+++ b/wcfsetup/install/files/style/layout/pageNavigation.scss
@@ -64,18 +64,12 @@
 
                        @include wcfFontDefault;
 
-                       &::before {
-                               content: $fa-var-long-arrow-left;
-                               flex: 0 auto;
-                               font-family: FontAwesome;
-                       }
-
                        > a {
                                color: $wcfContentDimmedLink;
                                display: block;
                                flex: 1;
                                overflow: hidden;
-                               padding: 5px 0 5px 10px;
+                               padding: 5px 0;
                                text-overflow: ellipsis;
                                white-space: nowrap;
                        }

diff --git a/wcfsetup/install/files/style/ui/breadcrumb.scss b/wcfsetup/install/files/style/ui/breadcrumb.scss
index 6e44ca451eeba3cb844ed894bc76d544fb661dc2..4e1da1fe3470ba0ebbc8ee33ec54fddb35e7227a 100644 (file)
--- a/wcfsetup/install/files/style/ui/breadcrumb.scss
+++ b/wcfsetup/install/files/style/ui/breadcrumb.scss
@@ -36,3 +36,9 @@
                }
        }
 }
+
+@include screen-lg {
+       .breadcrumbsParentIndicator {
+               display: none;
+       }
+}