@extends('layouts.app')

@section('content')
    <div x-data="{ isOpen: false }" class="h-screen flex overflow-hidden">
        <x-main>
            <pre
                id="code"
                class="h-full font-mono text-sm prettyprint linenums selectable" data-line-numbers="true"
            ><code>{{ $paste->code }}</code></pre>
        </x-main>

        <x-nav>
            <x-nav-item label="New" :link="route('home')" icon="heroicon-o-document-plus" />
            <x-nav-item
                label="Copy Code"
                type="button"
                icon="heroicon-o-clipboard"
                class="copy-btn"
                data-clipboard-text="{{ $paste->code }}"

            />
            
            <x-nav-item
                label="Copy Link"
                type="button"
                icon="heroicon-o-link"
                class="copy-btn"
                data-clipboard-text="{{ route('show', $paste->hash) }}"
            
            />
           
            <x-nav-item label="Fork" :link="route('edit', $paste->hash)" icon="heroicon-o-document-duplicate" />
            <x-nav-item label="Raw" :link="route('raw', $paste->hash)" icon="heroicon-o-arrow-top-right-on-square" blank />

            <!-- Show $paste Hash in a h2  -->
             <div class="mt-10">
            <h2 class="text-center text-gray-600 text-2xl font-medium uppercase tracking-wider mt-4">
                ID: {{ $paste->hash }}
            </h2>
            </div>
        </x-nav>
    </div>
@stop