<xf:macro id="depth1" arg-node="!" arg-extras="!" arg-children="!" arg-childExtras="!" arg-depth="1">
    <div class="block block--category block--category{$node.node_id}">
        <span class="u-anchorTarget" id="{$node.Data.getCategoryAnchor()}"></span>
        <div class="block-container">
            <h2 class="block-header sport-block-header">
                <div class="block-header--left">
                    <span class="sport-node-category-left-icon">
                        <xf:if is="{$node.node_id} == 1">
                            <xf:fa icon="fal fa-bullhorn" />
                        <xf:elseif is="{$node.node_id} == 2" />
                            <xf:fa icon="fal fa-star" />
                        <xf:elseif is="{$node.node_id} == 3" />
                            <xf:fa icon="fal fa-gift" />
                        <xf:elseif is="{$node.node_id} == 4" />
                            <xf:fa icon="fal fa-info-circle" />
                        <xf:else />
                            <xf:fa icon="fal fa-folder" />
                        </xf:if>    
                    </span>
                    <a href="{{ link('categories', $node) }}">{$node.title}</a>
                </div>
                <div class="sport-xgt-streak1" role="bg"></div>
                <div class="sport-xgt-streak-bg" role="bg"></div>
            </h2>
            <div class="sports-category-desc">
                <div class="sports-category-desc-icon" role="bg">
                    <xf:if is="{$node.node_id} == 1">
                        <xf:fa icon="fal fa-bullhorn" />
                    <xf:elseif is="{$node.node_id} == 2" />
                        <xf:fa icon="fal fa-star" />
                    <xf:elseif is="{$node.node_id} == 3" />
                        <xf:fa icon="fal fa-gift" />
                    <xf:elseif is="{$node.node_id} == 4" />
                        <xf:fa icon="fal fa-info-circle" />
                    <xf:else />
                        <xf:fa icon="fal fa-folder" />
                    </xf:if>
                </div>
                <span class="block-desc">
                    <xf:if is="{$node.node_id} == 1">
                        Duyuru alanı.
                    <xf:elseif is="{$node.node_id} == 2" />
                        Özel etkinlikler burada duyurulmaktadır.
                    <xf:elseif is="{$node.node_id} == 3" />
                        Hediyeler hakkında bilgi alabilirsiniz.
                    <xf:elseif is="{$node.node_id} == 4" />
                        Genel bilgiler ve duyurular bu alanda yer alır.
                    <xf:else />
                        Diğer kategoriler için açıklama metni.
                    </xf:if>
                </span>
            </div>
            <div class="block-body">
                <xf:macro id="forum_list::node_list"
                    arg-children="{$children}"
                    arg-extras="{$childExtras}"
                    arg-depth="{{ $depth + 1 }}" />
            </div>
        </div>
    </div>
</xf:macro>