@extends('layouts.work')

@section('title', '最新消息詳細頁 - 經濟部產業發展署工業安全網站')

@section('styles')
    <link href="{{ asset('css/news_detail.css') }}?d=20250402" rel="stylesheet">
    <link href="{{ asset('css/sm_news_detail.css') }}" rel="stylesheet">
@endsection

@section('content')
<main role='main' class='position-relative'>
    <nav class="link-event" aria-label="breadcrumb">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a class="dynamic-link" href="/">首頁</a></li>
            <li class="breadcrumb-item"><a class="dynamic-link" href="/news">最新消息</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 class='container-fluid'>
        <!-- title -->
        {{-- <div class='row mb-lg-3 px-0' style="height: 200px;"> --}}
        <!-- <div class='row mb-lg-3 px-0'>
            <div class='col-12 title'>
                <picture>
                    <source srcset="{{ asset('img/sm/最新消息banner.svg') }}" media="(max-width: 1200px)">
                    <img src="{{ asset('img/經濟部產業發展署元件_最新消息_標題框.svg') }}" alt="最新消息" title="最新消息" id="title" class='d-block user-timeline-image'>
                </picture>
                <h2>最新消息</h2>
            </div>
        </div> -->
        <div class='title mb-lg-3'>
            <div class='h2'>
                <picture>
                    <source srcset="{{ asset('img/sm/最新消息banner.svg') }}" media="(max-width: 1200px)">
                    <img src="{{ asset('img/經濟部產業發展署元件_最新消息_標題框.svg') }}" alt="最新消息" title="最新消息" id="title" style="width:100%;">
                </picture>
                <h2>最新消息</h2>
            </div>
        </div>

        <nav class="titlelink" aria-label="breadcrumb">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a class="dynamic-link" href="/">首頁</a></li>
                <li class="breadcrumb-item"><a class="dynamic-link" href="/news">最新消息</a></li>
                <li class="breadcrumb-item active" aria-current="page">最新消息詳細頁</li>
            </ol>
        </nav>
    

        <!-- <div class='row shadows ml-md-3 mb-2 mx-md-2'> -->
        <div class='shadows mb-2 mx-lg-3'>
            <filter-detail></filter-detail>
        </div>        
    </div>

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