@extends('layout.app')

@section('page-title', 'Press')

@section('breadcrumb')
    <div class="tf-breadcrumb">
        <div class="container">
            <div class="tf-breadcrumb-wrap d-flex justify-content-between flex-wrap align-items-center">
                <div class="tf-breadcrumb-list">
                    <a href="{{ url('new-design/home.php') }}" class="text">Home</a>
                    <i class="icon icon-arrow-right"></i>
                    <a href="{{ url('new-design/home.php') }}" class="text">About</a>
                    <i class="icon icon-arrow-right"></i>
                    <span class="text">Press</span>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('content')
    <div id="press" class="wt-pages">

        <section class="flat-spacing-wt">
            <div class="container wsj gray-background">
                <div class="tf-grid-layout md-col-1-2">
                    <div class="tf-content-wrap wow fadeInUp" data-wow-delay="0s">
                        <img class="lazyload img-wsj"
                            src="/new-design/images/pages/press/wsj.png"
                            alt="wsj-image"
                        >
                    </div>
                    <div class="tf-content-wrap wow fadeInUp" data-wow-delay="0s">
                        <div class="press-wsj-date">May 24, 2002</div>
                        <div class="heading">Full Steam Ahead</div>
                        <div class="press-wsj-subtitle">
                            Quality Rated “Best Overall” by<br>
                        </div>
                        <div class="press-wsj-subtitle-bold">THE WALL STREET JOURNAL</div>
                        <div class="press-wsj-author">By June Fletcher</div>
                        <div class="description">
                            Who needs to take a cruise? This summer, instead of dressing up for the captain's table, we're dressing up our backyards with steamer chairs.<br>
                            These fold-up loungers, with their curving lines and elegant hardware, are a neat twist on the standard chaise and very much in keeping with today's traditional chic transatlantic crossings, lap robes, dry martinis. 
                        </div>
                        <a href="{{ $vv_wsj_link }}" target="_blank">
                            <button id="wsj-btn" class="wsj-btn tf-btn-loading tf-loading-default tf-loading animate-hover-btn">
                                <span class="text text-uppercase">Continue ></span>
                            </button>
                        </a>
                    </div>
                </div>
            </div>
        </section>

        <section class="flat-spacing-wt">
            <div class="container">
                <div class="tf-grid-layout md-col-3">
                    @foreach($notes as $note)
                        <div class="tf-content-wrap wow fadeInUp gray-background press-note" data-wow-delay="0s">
                            <a href="{{ $note->link }}">
                                <div class="text-center">
                                    <img class="lazyload press-note-img"
                                        src="{{ $note->image }}"
                                        alt="{{ $note->alt_image }}"
                                    >
                                </div>
                                <div class="press-note-text">
                                    <div class="press-note-date">{{ $note->date }}</div>
                                    <div class="heading">{{ $note->title }}</div>
                                    <div class="description">{{ $note->text }}</div>
                                    <div class="press-note-author">{{ $note->author }}</div>
                                </div>
                            </a>
                        </div>
                    @endforeach
                </div>
            </div>
        </section>

    </div>
@endsection