alevel_project/resources/views/userprofile/templates.blade.php

{{--@extends('layouts.app')--}}

{{--@section('content')--}}

{{--<link href="{{ asset('css/item_info_page.css') }}" rel="stylesheet">--}}
{{--<link href="{{ asset('css/bootstrap.4.min.css') }}" rel="stylesheet">--}}
{{--<script src="{{ asset('js/bootstrap.4.min.js') }}"></script>--}}

<style>

    .wraper-top {
        min-height: 50px;
    }

    .item-small-view {
        margin-top: 20px;
        max-width: 600px;
        min-width: 600px;
        height: 175px;
    }

    .item-small-view .description {
        overflow: hidden;
        max-height: 110px;
        text-align: left;
    }
    #item-small-view img {
        width: 100%;
        height: 100%;
    }

    #item-small-view div {
        min-height: 100px;
        max-height: 100px;
        overflow: hidden;

    }

    #item-small-preview {
        padding: 5px;
        background-color: #cccccc;
        max-width: 100px;
        min-width: 100px;
    }

    #item-small-information {
        padding: 5px;
        background-color: lightgoldenrodyellow;
    }

    .card-body .card-text {
        font-size: 15px;
    }

    #item-small-manipulate {
        padding: 5px;
        background-color: #cccccc;
        max-width: 50px;
        min-width: 50px;
    }


    .user-r {
        padding-left: 6px;
    }
    .user-l >img,
    .user-r >img {
        width: 150px;
    }
    .redes >ul li a {
        width: 42px;
        margin-left: 5px;
        margin-right: 5px;
        text-align: center;
        border-radius: 10em;
        border: #EEE 1px solid;
    }
    .redes >ul li span {
        color: #CCC;
        font-size: 18px;
    }
    .footer {
        padding: 16px 0;
    }



</style>

<div class="wraper-top">
</div>

@foreach($itemsList as $item)
    <div class="col-md-12 item-small-view">
        <div class="card">
            <h4 class="card-header text-right bg-dark text-white">{{ $item->caption }}
                <div class="float-left small">
                    <a class="btn btn-raised btn-danger" href="#" data-toggle="tooltip" data-placement="top">
                        <i class="fa fa-user" aria-hidden="true"></i>
                    </a>
                    <a class="btn btn-raised btn-danger" href="#" title="Отправить">
                        <i class="fa fa-envelope" aria-hidden="true"></i>
                    </a>
                    <a class="btn btn-raised btn-danger" href="#" title="Детально">
                        <i class="fa fa-eye" aria-hidden="true"></i>
                    </a>
                </div>
            </h4>
            <div class="card-body">
                <div class="image float-right user-r">
                    <img src="image/{{ $item->picture[0]->path }}" class="img-thumbnail">
                </div>
                {{--<h4 class="card-title">{{ $item->caption }}</h4>--}}
                <div class="description">
                    <p class="card-text">{{ $item->description }}</p>
                </div>
            </div>
        </div>
    </div>
@endforeach
{{--@endsection--}}