@if($freeNodeLayout['intro'])<div class="fn-extra-intro">{!! nl2br(\App\Services\Seo::body($freeNodeLayout['intro'])) !!}</div>@endif
<section class="fn-subscriptions" id="node-subscriptions" aria-labelledby="node-subscriptions-title">
    <div class="fn-section-heading"><div><h2 id="node-subscriptions-title">获取免费订阅</h2></div></div>
    @if($freeNodeLayout['count'] === 0)
    <p class="fn-empty-note">这篇更新记录的可用节点为 0，导入前可先<a href="/">查看最新更新</a>。</p>
    @endif
    <div class="fn-subscription-list">
    @foreach($freeNodeLayout['subscriptions'] as $subscription)
    <div class="fn-subscription fn-subscription--{{ $subscription['key'] }}">
        <div class="fn-subscription__top"><div class="fn-subscription__name"><h3>适用于：{{ $subscription['title'] }}</h3></div></div>
        <div class="fn-subscription__address"><code title="{{ $subscription['url'] }}">{{ $subscription['url'] }}</code><button type="button" class="fn-copy copy-permalink" data-clipboard-text="{{ $subscription['url'] }}" aria-label="复制 {{ $subscription['title'] }} 订阅"><svg width="15" height="15" viewBox="0 0 16 16" fill="none" aria-hidden="true"><rect x="5" y="5" width="8" height="9" rx="1" stroke="currentColor"/><path d="M3 11H2V2h8v1" stroke="currentColor"/></svg><span>复制订阅</span></button></div>
    </div>
    @endforeach
    </div>
    @if($freeNodeLayout['notes'])<div class="fn-subscription-note">{!! nl2br(\App\Services\Seo::body($freeNodeLayout['notes'])) !!}</div>@endif
</section>
<section class="fn-usage" id="node-usage" aria-labelledby="node-usage-title">
    <div class="fn-section-heading"><div><h2 id="node-usage-title">使用方法</h2></div></div>
    <div class="fn-usage__body">
        <ol class="fn-steps">
            <li><span class="fn-steps__number" aria-hidden="true">1</span><div><strong>复制订阅</strong><p>复制对应格式的订阅地址。</p></div></li>
            <li><span class="fn-steps__number" aria-hidden="true">2</span><div><strong>导入客户端</strong><p>粘贴到订阅管理并更新。</p></div></li>
            <li><span class="fn-steps__number" aria-hidden="true">3</span><div><strong>选择节点</strong><p>开启连接并检查访问结果。</p></div></li>
        </ol>
        <nav class="fn-tutorial-links" aria-label="客户端使用教程">
            <span class="fn-tutorial-links__label">需要详细教程？</span>
            <div class="fn-tutorial-links__items"><a href="/a/clash-verge-rev-windows.html" aria-label="Windows 入门教程">Windows</a><a href="/a/m169.html" aria-label="Android 入门教程">Android</a><a href="/client">全部教程 <span aria-hidden="true">→</span></a></div>
        </nav>
    </div>
</section>
@if($recommendations['enabled'])
    @include('components.airport-recommendations')
@endif
@if($freeNodeLayout['community'])
<div class="fn-community"><span>收藏更新，不必反复寻找</span><div>@foreach($freeNodeLayout['community'] as $link)<a href="{{ $link['url'] }}" target="_blank" rel="noopener noreferrer">{{ $link['label'] }} ↗</a>@endforeach</div></div>
@endif