138 lines
9.4 KiB
PHP
138 lines
9.4 KiB
PHP
<x-layout>
|
|
<div class="py-10 bg-white ">
|
|
<div class="bg-[#EBFEA1] poppins-extrabold m-auto flex items-center justify-center p-2">
|
|
<p>Halaman ini berisi tentang kursus di Pare! </p>
|
|
</div>
|
|
</div>
|
|
<div class="container">
|
|
<div class="flex justify-end py-4">
|
|
<div class="flex space-x-2">
|
|
|
|
|
|
<form class="max-w-lg mx-auto">
|
|
<div class="flex">
|
|
<label for="search-dropdown" class="mb-2 text-sm font-medium text-gray-900 sr-only ">Your
|
|
Email</label>
|
|
<button id="dropdown-button" data-dropdown-toggle="dropdown"
|
|
class="flex-shrink-0 z-10 inline-flex items-center py-2.5 px-4 text-sm font-medium text-center text-gray-900 bg-gray-100 border border-gray-300 rounded-s-lg hover:bg-gray-200 focus:ring-4 focus:outline-none focus:ring-gray-100 "
|
|
type="button">All categories <svg class="w-2.5 h-2.5 ms-2.5" aria-hidden="true"
|
|
xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 10 6">
|
|
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
|
|
stroke-width="2" d="m1 1 4 4 4-4" />
|
|
</svg></button>
|
|
<div id="dropdown"
|
|
class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow w-44 ">
|
|
<ul class="py-2 text-sm text-gray-700 " aria-labelledby="dropdown-button">
|
|
<li>
|
|
<button type="button"
|
|
class="inline-flex w-full px-4 py-2 hover:bg-gray-100 ">Mockups</button>
|
|
</li>
|
|
<li>
|
|
<button type="button"
|
|
class="inline-flex w-full px-4 py-2 hover:bg-gray-100 ">Templates</button>
|
|
</li>
|
|
<li>
|
|
<button type="button"
|
|
class="inline-flex w-full px-4 py-2 hover:bg-gray-100 ">Design</button>
|
|
</li>
|
|
<li>
|
|
<button type="button"
|
|
class="inline-flex w-full px-4 py-2 hover:bg-gray-100 ">Logos</button>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="relative w-full">
|
|
<input type="search" id="search-dropdown"
|
|
class="block pr-12 p-2.5 w-full z-20 text-sm text-gray-900 bg-gray-50 rounded-e-lg border-s-gray-50 border-s-2 border border-gray-300 focus:ring-blue-500 focus:border-blue-500"
|
|
placeholder="Search Mockups, Logos, Design Templates..." required />
|
|
<button type="submit"
|
|
class="absolute top-0 end-0 p-2.5 text-sm font-medium h-full text-white bg-[#4F7F81] rounded-e-lg border border-[#4F7F81] hover:bg-[#4F7F81] focus:ring-4 focus:outline-none focus:ring-[#4F7F81]">
|
|
<svg class="w-4 h-4" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
|
|
fill="none" viewBox="0 0 20 20">
|
|
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
|
|
stroke-width="2" d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z" />
|
|
</svg>
|
|
<span class="sr-only">Search</span>
|
|
</button>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</form>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
<div class="pb-20 grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-8 m-auto justify-center items-center">
|
|
@foreach ($data_kursus as $data_kursus)
|
|
<div class="max-w-max shadow-xl bg-white border border-gray-300 rounded-lg ">
|
|
<a href="#">
|
|
<img class="rounded-lg m-auto flex justify-center items-center w-full max-h-64 object-cover"
|
|
src="{{ asset('storage/'.$data_kursus->img ) }}" alt="" />
|
|
{{-- src="{{ asset($data_kursus->img) }}" alt="{{ $data_kursus->nama_kursus }}" /> --}}
|
|
</a>
|
|
<div class="p-5">
|
|
<a href="#">
|
|
<h5 class="mb-2 text-2xl poppins-regular font-extrabold tracking-tight text-gray-900">
|
|
{{ $data_kursus->nama_kursus }}
|
|
</h5>
|
|
</a>
|
|
<p class="mb-3 font-normal poppins-regular text-gray-700 ">
|
|
{{ $data_kursus->deskripsi }}
|
|
</p>
|
|
|
|
|
|
<div class="flex items-center">
|
|
<svg class="w-4 h-4 text-yellow-300 me-1" aria-hidden="true"
|
|
xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 22 20">
|
|
<path
|
|
d="M20.924 7.625a1.523 1.523 0 0 0-1.238-1.044l-5.051-.734-2.259-4.577a1.534 1.534 0 0 0-2.752 0L7.365 5.847l-5.051.734A1.535 1.535 0 0 0 1.463 9.2l3.656 3.563-.863 5.031a1.532 1.532 0 0 0 2.226 1.616L11 17.033l4.518 2.375a1.534 1.534 0 0 0 2.226-1.617l-.863-5.03L20.537 9.2a1.523 1.523 0 0 0 .387-1.575Z" />
|
|
</svg>
|
|
<svg class="w-4 h-4 text-yellow-300 me-1" aria-hidden="true"
|
|
xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 22 20">
|
|
<path
|
|
d="M20.924 7.625a1.523 1.523 0 0 0-1.238-1.044l-5.051-.734-2.259-4.577a1.534 1.534 0 0 0-2.752 0L7.365 5.847l-5.051.734A1.535 1.535 0 0 0 1.463 9.2l3.656 3.563-.863 5.031a1.532 1.532 0 0 0 2.226 1.616L11 17.033l4.518 2.375a1.534 1.534 0 0 0 2.226-1.617l-.863-5.03L20.537 9.2a1.523 1.523 0 0 0 .387-1.575Z" />
|
|
</svg>
|
|
<svg class="w-4 h-4 text-yellow-300 me-1" aria-hidden="true"
|
|
xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 22 20">
|
|
<path
|
|
d="M20.924 7.625a1.523 1.523 0 0 0-1.238-1.044l-5.051-.734-2.259-4.577a1.534 1.534 0 0 0-2.752 0L7.365 5.847l-5.051.734A1.535 1.535 0 0 0 1.463 9.2l3.656 3.563-.863 5.031a1.532 1.532 0 0 0 2.226 1.616L11 17.033l4.518 2.375a1.534 1.534 0 0 0 2.226-1.617l-.863-5.03L20.537 9.2a1.523 1.523 0 0 0 .387-1.575Z" />
|
|
</svg>
|
|
<svg class="w-4 h-4 text-yellow-300 me-1" aria-hidden="true"
|
|
xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 22 20">
|
|
<path
|
|
d="M20.924 7.625a1.523 1.523 0 0 0-1.238-1.044l-5.051-.734-2.259-4.577a1.534 1.534 0 0 0-2.752 0L7.365 5.847l-5.051.734A1.535 1.535 0 0 0 1.463 9.2l3.656 3.563-.863 5.031a1.532 1.532 0 0 0 2.226 1.616L11 17.033l4.518 2.375a1.534 1.534 0 0 0 2.226-1.617l-.863-5.03L20.537 9.2a1.523 1.523 0 0 0 .387-1.575Z" />
|
|
</svg>
|
|
<svg class="w-4 h-4 text-gray-300 me-1 " aria-hidden="true"
|
|
xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 22 20">
|
|
<path
|
|
d="M20.924 7.625a1.523 1.523 0 0 0-1.238-1.044l-5.051-.734-2.259-4.577a1.534 1.534 0 0 0-2.752 0L7.365 5.847l-5.051.734A1.535 1.535 0 0 0 1.463 9.2l3.656 3.563-.863 5.031a1.532 1.532 0 0 0 2.226 1.616L11 17.033l4.518 2.375a1.534 1.534 0 0 0 2.226-1.617l-.863-5.03L20.537 9.2a1.523 1.523 0 0 0 .387-1.575Z" />
|
|
</svg>
|
|
<p class="ms-1 text-sm text-gray-500 ">4.95</p>
|
|
<p class="ms-1 text-sm text-gray-500 ">out of</p>
|
|
<p class="ms-1 text-sm text-gray-500 ">5</p>
|
|
</div>
|
|
<div class="flex justify-end">
|
|
<a href="/kursus/{{ $data_kursus->id }}/detail"
|
|
class="inline-flex items-center px-6 font-extrabold py-2 text-sm text-center ring-2 text-black ring-black hover:text-white hover:bg-[#4F7F81] hover:ring-[#4F7F81] rounded-full focus:ring-4 focus:outline-none focus:ring-blue-300 -700 ue-800">
|
|
Lihat
|
|
<svg class="rtl:rotate-180 w-3.5 h-3.5 ms-2" aria-hidden="true"
|
|
xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
|
|
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
|
|
stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9" />
|
|
</svg>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</x-layout>
|