forked from eatvio/eatvio-infra
187 lines
12 KiB
PHP
187 lines
12 KiB
PHP
@extends('layouts/eatvio')
|
|
@php
|
|
$typeToSvgId = ['slim' => '#SlimBig', 'fit' => '#FitBig', 'wellness' => '#WellnessBig', 'behavior' => '#BehaviorBig'];
|
|
@endphp
|
|
@section('main_section')
|
|
<section class="py-5" id="main">
|
|
<form class="container d-block d-sm-flex justify-content-between align-items-end align-items-lg-center mb-4 p-0 --mw-1170" action="" type="">
|
|
<div class="d-block d-lg-flex align-items-center col-12 col-sm-9 me-lg-2 mb-1 mb-sm-0 p-0 pe-sm-2">
|
|
<div class="h4 me-md-3 mb-3 mb-lg-0 --f_grey text-uppercase">Популярные планы</div>
|
|
<div class="d-flex align-items-center -search flex-grow-1">
|
|
<span class="btn --search_icon"><svg width="20" height="20"><use xlink:href="#SearchIcon"></use></svg></span>
|
|
<input class="form-control" name="search" type="search" placeholder="Поиск плана">
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-sm px-0 flex-grow-1">
|
|
<button type="submit" class="btn btn-lg btn-primary btn-block w-100 ps-4 pe-sm-4 --f_bold text-uppercase --no_wrap">Найти план</button>
|
|
</div>
|
|
</form>
|
|
|
|
<div class="container mb-5 --mw-1170">
|
|
<div class="row justify-content-between flex-lg-nowrap flex-column-reverse flex-lg-row">
|
|
<div class="col-lg-9 me-lg-2 mb-4 mb-lg-0 p-0 pe-lg-2">
|
|
<div class="row gx-3">
|
|
@foreach($plans as $plan)
|
|
<div class="col-md-6 mb-3">
|
|
<div class="h-100 --bg_white --shadow --radius --no_wrap overflow-hidden">
|
|
<a href="{{ route("plan.show", $plan) }}">
|
|
<div class="post_img position-relative plan-card-img">
|
|
<img src="/storage/{{ $plan->image }}" class="w-100">
|
|
<div class="post_v_l w-100 d-flex justify-content-center align-items-center position-absolute --f_white bgt-03">
|
|
<svg width="20" height="14" class="me-2"><use xlink:href="#Eye_White"></use></svg>
|
|
<span class="me-3">{{ views($plan)->unique()->count() }}</span>
|
|
<svg width="16" height="14" class="me-2"><use xlink:href="#Heart_White"></use></svg>
|
|
<span class="me-3">{{ $plan->likes_count }}</span>
|
|
<svg width="16" height="14" class="me-2"><use xlink:href="#Comments_White"></use></svg>
|
|
<span>{{ $plan->comments_count }}</span>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
<div class="p-3 pt-2">
|
|
<div class="d-flex justify-content-between align-items-center my-2 p-2 bg_lightest_blue --radius">
|
|
<div class="d-flex align-items-center fs-6">
|
|
<svg width="22" height="22"><use xlink:href="#TimeBlack"></use></svg>
|
|
<span class="mx-2 me-4 --f_bold">{{ $plan->duration }} дней</span>
|
|
|
|
<svg width="24" height="20"><use xlink:href="#UsersBlack"></use></svg>
|
|
<span class="mx-2 --f_bold">132</span>
|
|
</div>
|
|
<a href="#"><svg width="24" height="21"><use xlink:href="#HeartPath"></use></svg></a>
|
|
</div>
|
|
@php
|
|
$author = $plan->author()->first();
|
|
@endphp
|
|
|
|
<a href="{{ route('profile.show', $author) }}" style="color:var(--main_fcolor)">
|
|
<div class="d-flex my-3 align-items-center justify-content-between">
|
|
<div class="d-flex align-items-center">
|
|
<img src="{{ $author->profile_photo_url }}" width="42px" height="42px" class="me-2 --radius_100 w-100 plan-author">
|
|
<small>
|
|
<span class="d-block --f_bold">{{ $author->name }}</span>
|
|
<div class="d-flex align-items-center">
|
|
<svg width="15" height="15" class="me-2"><use xlink:href="#GoldStar"></use></svg>
|
|
<span class="--f_bold --f_light_gold">4.6</span>
|
|
<span class="ms-2">(32)</span>
|
|
</div>
|
|
</small>
|
|
</div>
|
|
<div class="d-flex align-items-center">
|
|
<a href="{{ route('profile.show', $author) }}" class="btn btn-lg btn-primary btn-block px-4">
|
|
<svg width="20" height="20">
|
|
<use xlink:href="#WhiteChat"></use>
|
|
</svg>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
<a href="{{ route('plan.show', $plan) }}" style="color:var(--main_fcolor)">
|
|
<div class="h6 --f_bold --no_wrap_normal">План “{{ $plan->name }}”</div>
|
|
<small class="d-block --no_wrap_normal">{!! $plan->details !!}</small>
|
|
|
|
@if(count($plan->allItems()) > 0)
|
|
<small>
|
|
<ul class="my-3 checks --f_bold">
|
|
@foreach($plan->allItems() as $item)
|
|
<li> {{ $item }} </li>
|
|
@endforeach
|
|
</ul>
|
|
</small>
|
|
@endif
|
|
|
|
<div class="d-flex align-items-center justify-content-between">
|
|
@if(count($plan->types) > 0)
|
|
<div class="d-flex align-items-center">
|
|
@foreach($plan->types as $planType)
|
|
<svg width="36" height="36" class="me-2"><use xlink:href="{{ $typeToSvgId[$planType] }}"></use></svg>
|
|
@endforeach
|
|
</div>
|
|
@endif
|
|
<span class="px-4 py-2 badge rounded-pill bg-success --f_bold">от {{ $plan->minPrice }}₽</span>
|
|
</div>
|
|
</a>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
|
|
<div class="d-sm-flex justify-content-sm-between flex-wrap d-lg-block col mb-4 px-0 flex-grow-1">
|
|
<div class="row gx-sm-3 gx-lg-0 col-sm-6 col-lg-12 mb-3 align-items-center">
|
|
<label class="mb-1 --f_grey --f_bold"><small>Длительность плана</small></label>
|
|
<div class="col pe-0">
|
|
<input type="text" class="form-control fs-4_5 py-3 w-100 text-center" placeholder="от">
|
|
</div>
|
|
<div class="w-auto px-2 --f_grey">-</div>
|
|
<div class="col ps-0">
|
|
<input type="text" class="form-control fs-4_5 py-3 w-100 text-center" placeholder="до">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row gx-sm-3 gx-lg-0 col-sm-6 col-lg-12 mb-3 align-items-center">
|
|
<label class="mb-1 --f_grey --f_bold"><small>Стоимость плана</small></label>
|
|
<div class="col pe-0">
|
|
<input type="text" class="form-control fs-4_5 py-3 w-100 text-center" placeholder="от">
|
|
</div>
|
|
<div class="w-auto px-2 --f_grey">-</div>
|
|
<div class="col ps-0">
|
|
<input type="text" class="form-control fs-4_5 py-3 w-100 text-center" placeholder="до">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row gx-sm-3 gx-lg-0 col-sm-6 col-lg-12 mb-3 align-items-center">
|
|
<label class="mb-1 --f_grey --f_bold"><small>Проходит план</small></label>
|
|
<div class="col pe-0">
|
|
<input type="text" class="form-control fs-4_5 py-3 w-100 text-center" placeholder="от">
|
|
</div>
|
|
<div class="w-auto px-2 --f_grey">-</div>
|
|
<div class="col ps-0">
|
|
<input type="text" class="form-control fs-4_5 py-3 w-100 text-center" placeholder="до">
|
|
</div>
|
|
</div>
|
|
<div class="w-100"></div>
|
|
<div class="row gx-0 mb-3 w-100">
|
|
<div class="col-12 col-sm-6 col-lg-12 d-flex flex-column pe-sm-3 pe-lg-0">
|
|
<div class="btn-group --radio">
|
|
<input type="checkbox" class="btn-check" name="dates" id="dates2" autocomplete="off">
|
|
<label class="btn --f_bold w-50" for="dates2">
|
|
<svg width="40" height="40" class="me-1">
|
|
<use xlink:href="#SlimBig"></use>
|
|
</svg>
|
|
<small class="lh-1">Похудения</small>
|
|
</label>
|
|
<input type="checkbox" class="btn-check" name="dates" id="dates1" autocomplete="off">
|
|
<label class="btn --f_bold w-50" for="dates1">
|
|
<svg width="40" height="40" class="me-1">
|
|
<use xlink:href="#FitBig"></use>
|
|
</svg>
|
|
<small class="lh-1">Спортивное питание</small>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-sm-6 col-lg-12 d-flex flex-column ps-sm-3 ps-lg-0">
|
|
<div class="btn-group --radio">
|
|
<input type="checkbox" class="btn-check" name="status" id="status1" autocomplete="off">
|
|
<label class="btn --f_bold w-50" for="status1">
|
|
<svg width="40" height="40" class="me-1">
|
|
<use xlink:href="#WellnessBig"></use>
|
|
</svg>
|
|
<small class="lh-1">Улучшения состояния</small>
|
|
</label>
|
|
<input type="checkbox" class="btn-check" name="status" id="status2" autocomplete="off">
|
|
<label class="btn --f_bold w-50" for="status2">
|
|
<svg width="40" height="40" class="me-1">
|
|
<use xlink:href="#BehaviorBig"></use>
|
|
</svg>
|
|
<small class="lh-1">Корректировка пищевого поведения</small>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
@endsection
|