@extends('layouts.work')

@section('title', '活動招生 - 經濟部產業發展署工業安全網站')

@section('styles')
    <link href="{{ asset('css/activities.css') }}" rel="stylesheet">
    <link href="{{ asset('css/sm_tables.css') }}" rel="stylesheet">
    <style type="text/css">
        @media screen and (max-width: 992px) {
            .bg-bulletin {
                padding: 11px;
            }
        }
    </style>
@endsection

@section('content')
<main role='main' class='container-fluid mx-0'>
    
    <div class="link-event">
        <!-- <hr size="8px" align="center" width="100%" color="black"> -->
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb mt-2">
                <li class="breadcrumb-item"><a class="dynamic-link" href="/">首頁</a></li>
                <li class="breadcrumb-item active" aria-current="page">活動招生</li>
            </ol>
        </nav>
        <a href="#C" class='sr-only-main' accesskey="C" name="C" title="主要內容區塊">:::</a>
    </div>

    <div class='row'>
        <!-- user timeline image -->
        <h2>
            <picture>
                <source srcset="{{ asset('img/sm/手機版banner_活動招生點陣化.svg') }}" media="(max-width: 992px)">
                <img src="{{ asset('img/活動招生/經濟部產業發展署元件_banner_活動招生.png') }}" alt="活動招生" title="活動招生" style="width:100%;">
            </picture>
        </h2>
    </div>

    <div class="titlelink">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a class="dynamic-link" href="/">首頁</a></li>
                <li class="breadcrumb-item active" aria-current="page">活動招生</li>
            </ol>
        </nav>
    </div>

    <filter-board :tpage={{ $tpage }}></filter-board>
            
    <noscript>
        <div class='text-center'>
            <p>此網頁需要支援 JavaScript 才能正確運行，請先至你的瀏覽器設定中開啟 JavaScript。</p>
        </div>
    </noscript>
</main>
@endsection

@section('script')
    <script src="{{ asset('js/togglebtn.js')}}"></script>
    <script src="{{ asset('js/modal.js')}}"></script>
@endsection