View difference between Paste ID: 8v30ArsX and SWtyBeUp
SHOW: | | - or go back to the newest paste.
1
// Ini view yang home.blade.php
2
@extends('layouts.app')
3
4
@section('title', 'NOMADS')
5
6
@section('content')
7
8
<!-- Header -->
9
<header class="text-center">
10
        <h1>Explore The Beautiful World <br>
11
            As Easy One Click
12
        </h1>
13
        <p class="mt-3">You will see beautiful <br>
14
            moment you never see before
15
        </p>
16
        <a href="#popular" class="btn btn-get-started px-4 mt-4">
17
            Get Started
18
        </a>
19
    </header>
20
21
    <!-- Main -->
22
    <main>
23
        <div class="container">
24
            <section class="section-stats row justify-content-center" id="stats">
25
                <div class="col-3 col-md-2 stats-detail">
26
                    <h2>20k</h2>
27
                    <p>Members</p>
28
                </div>
29
                <div class="col-3 col-md-2 stats-detail">
30
                    <h2>12k</h2>
31
                    <p>Countries</p>
32
                </div>
33
                <div class="col-3 col-md-2 stats-detail">
34
                    <h2>3K</h2>
35
                    <p>Hotel</p>
36
                </div>
37
                <div class="col-3 col-md-2 stats-detail">
38
                    <h2>72</h2>
39
                    <p>Partners</p>
40
                </div>
41
            </section>
42
        </div>
43
        <section class="section-popular" id="popular">
44
            <div class="container">
45
                <div class="row">
46
                    <div class="col text-center section-popular-heading">
47
                        <h2>Wisata Popular</h2>
48
                        <p>
49
                            Something that you never try
50
                            <br>
51
                            before in this world
52
                        </p>
53
                    </div>
54
                </div>
55
            </div>
56
        </section>
57
58
        <section class="section-popular-content" id="popularContent">
59
            <div class="container">
60
                <div class="section-popular-travel row justify-content-center">
61
                @foreach($items as $item)
62
                    <div class="col-sm-6 col-md-4 col-lg-3">
63
                        <div class="card-travel text-center d-flex flex-column" style="background-image: url('{{ $item->gallerries->count() ? url('public/storage/'.$item->gallerries->first()->image) : '' }}');"
64
                        >
65
                            <div class="travel-country">{{ $item->location }}</div>
66
                            <div class="travel-location">{{ $item->title }}</div>
67
                            <div class="travel-button mt-auto">
68
@if(isset($item->slug))
69
                                <a href="{{ route('detail', ['slug' => $item->slug]) }}" class="btn btn-travel-details px-4">
70
                                    View Details
71
                                </a>
72
@else
73
<!-- tidak ada slug?!! -->
74
@endif
75
                            </div>
76
                        </div>
77
                    </div>
78
                @endforeach
79
                    <!-- <div class="col-sm-6 col-md-4 col-lg-3">
80
                        <div class="card-travel text-center d-flex flex-column" style="background-image: url(public/frontend/frontend/images/item_wisata2.jpg);">
81
                            <div class="travel-country">INDONESIA</div>
82
                            <div class="travel-location">BROMO, MALANG</div>
83
                            <div class="travel-button mt-auto">
84
                                <a href="{{ route('detail') }}" class="btn btn-travel-details px-4">
85
                                    View Details
86
                                </a>
87
                            </div>
88
                        </div>
89
                    </div>
90
                    <div class="col-sm-6 col-md-4 col-lg-3">
91
                        <div class="card-travel text-center d-flex flex-column" style="background-image: url(public/frontend/frontend/images/item_wisata3.jpg);">
92
                            <div class="travel-country">INDONESIA</div>
93
                            <div class="travel-location">NUSA PENINDA</div>
94
                            <div class="travel-button mt-auto">
95
                                <a href="{{ route('detail') }}" class="btn btn-travel-details px-4">
96
                                    View Details
97
                                </a>
98
                            </div>
99
                        </div>
100
                    </div>
101
                    <div class="col-sm-6 col-md-4 col-lg-3">
102
                        <div class="card-travel text-center d-flex flex-column" style="background-image: url(public/frontend/frontend/images/item_wisata4.jpg);">
103
                            <div class="travel-country">MIDDLE EAST</div>
104
                            <div class="travel-location">DUBAI</div>
105
                            <div class="travel-button mt-auto">
106
                                <a href="{{ route('detail') }}" class="btn btn-travel-details px-4">
107
                                    View Details
108
                                </a>
109
                            </div>
110
                        </div>
111
                    </div> -->
112
                </div>
113
                
114
            </div>
115
        </section>
116
117
        <section class="section-networks">
118
            <div class="container">
119
                <div class="row">
120
                    <div class="col-md-4">
121
                        <h2>Out Network</h2>
122
                        <p>
123
                            Companies are trusted Us
124
                            <br>
125
                            more than just trip 
126
                        </p>
127
                    </div>
128
                    <div class="col md-8 text-center">
129
                        <img src="public/frontend/frontend/images/logos_partner.png" alt="Logo-Partner" class="img-partner">
130
                    </div>
131
                </div>
132
            </div>
133
        </section>
134
    </main>
135
    
136
137
@endsection