<commit_before>@extends('components.content-area')

@section('content')
    @include('components.page-title', ['title' => $page['title']])

    <div class="content">
        {!! $page['content']['main'] !!}
    </div>

    @if(!empty($accordion_page))
        @include('components.accordion', ['items' => $accordion_page])
    @endif

    <a href="#accordions" class="button" onclick="document.querySelector('pre.accordions').classList.toggle('hidden');">See accordion code</a>

    <pre id="accordions" class="accordions hidden bg-grey-lightest overflow-scroll">
    {!! htmlspecialchars('
<ul class="accordion">
    <li>
        <a href="#panel1a">Accordion 1</a>
        <div id="panel1a">
            <p>Panel 1. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
        </div>
    </li>
    <li>
        <a href="#panel2a">Accordion 2</a>
        <div id="panel2a">
            <p>Panel 2. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
        </div>
    </li>
    <li>
        <a href="#panel3a">Accordion 3</a>
        <div id="panel3a">
            <p>Panel 3. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
        </div>
    </li>
</ul>
    ') !!}
    </pre>
@endsection
<commit_msg>Update the example accordion code to add the new span tag so the visual indicator of close and open works. Also add the class of content on it since we need to target that with JS to hide it upon the start.<commit_after>@extends('components.content-area')

@section('content')
    @include('components.page-title', ['title' => $page['title']])

    <div class="content">
        {!! $page['content']['main'] !!}
    </div>

    @if(!empty($accordion_page))
        @include('components.accordion', ['items' => $accordion_page])
    @endif

    <a href="#accordions" class="button" onclick="document.querySelector('pre.accordions').classList.toggle('hidden');">See accordion code</a>

    <pre id="accordions" class="accordions hidden bg-grey-lightest overflow-scroll">
    {!! htmlspecialchars('
<ul class="accordion">
    <li>
        <a href="#panel1a"><span aria-hidden="true"></span>Accordion 1</a>
        <div class="content" id="panel1a">
            <p>Panel 1. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
        </div>
    </li>
    <li>
        <a href="#panel2a"><span aria-hidden="true"></span>Accordion 2</a>
        <div class="content" id="panel2a">
            <p>Panel 2. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
        </div>
    </li>
    <li>
        <a href="#panel3a"><span aria-hidden="true"></span>Accordion 3</a>
        <div class="content" id="panel3a">
            <p>Panel 3. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
        </div>
    </li>
</ul>
    ') !!}
    </pre>
@endsection

{'fraction_non_alphanumeric': 0.15696044845842416, 'fraction_numerical': 0.00747430706944877, 'mean_word_length': 3.215223097112861, 'pattern_counts': {'":': 0, '<': 73, '<?xml version=': 0, '>': 77, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 12, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3010526', 'n_tokens_mistral': 1099, 'n_tokens_neox': 1054, 'n_words': 285}