@extends('blog.layout')

@section('content')

    <style>
        .uper {
            margin-top: 40px;
        }

        .addbutton {
            margin-top: 40px;
        }
        input{
            width: 250px;
            height: 100px;
            margin: 15px;
        }
        .card{
            border: solid black 2px;
            padding: 10px;
        }

    </style>
    <div class="addbutton">
        <form method="get" action="/blog/create">
            <button class="btn btn-success" type="submit">Add Post</button>
        </form>
    </div>
    <div class="uper">
        @if(session()->get('success'))
            <div class="alert alert-success">
                {{ session()->get('success') }}
            </div><br/>
        @endif

        <table class="table table-striped">

            <tbody>
            @foreach($blog as $objBlog)
                @foreach($user as $users)
                    {{--@foreach($comment as $comments)--}}
                    <div class="card">
                        <h1>{{$objBlog->titel}}</h1>
                        <p>{{$objBlog->inhoud}}</p>
                        <p>-{{$users->name}}</p>
                        <a href="{{ action('BlogController@edit',$objBlog->id)}}" class="btn btn-primary">Edit</a>
                        <form action="{{ action('BlogController@destroy', $objBlog->id)}}" method="post">
                            @csrf
                            @method('DELETE')
                            <button class="btn btn-danger" type="submit">Delete</button>
                        </form>
                    </div>
                    <br>
                    <h2>comments:</h2>
                    <p></p>

                    <form method="post" action="/comment">
                        <input type="text" id="fname" name="comment">
                        <button class="btn btn-danger" type="submit">Send</button>
                    </form>

                        {{--@endforeach--}}

                @endforeach

            @endforeach
            </tbody>
        </table>
    </div>
@endsection