@extends('web.layout')

@section('title', 'Dosen Detail')

@section('content')
    <section class="container my-3 my-md-5">
        <div class="row">
            <div class="col-12 col-md-3 mb-3">
                <img src="{{ asset("storage/{$dosen->foto}") }}" alt="Dosen" class="rounded-4 w-100">
            </div>
            <div class="col-12 col-md-9 mb-3">
                <h1 class="fw-bold">{{ $dosen->nama }}</h1>
                <h5 class="text-muted mb-3">
                    {{ $dosen->jabatan }}
                </h5>
                <div class="d-flex align-items-center gap-3">
                    <small class="badge bg-success">
                        <i class="bi bi-person-vcard-fill"></i> {{ $dosen->nip }}
                    </small>
                    <small class="badge bg-warning text-dark">
                        <i class="bi bi-envelope-at-fill"></i> {{ $dosen->email }}
                    </small>
                </div>
                <div class="mt-3">
                    {!! $dosen->deskripsi !!}
                </div>
            </div>
        </div>
    </section>
@endsection