@extends('core::layouts.master')

@section('title', '| General Translations')

@section('content')
<div class="d-sm-flex align-items-center justify-content-between mb-4">
    <h1 class="h3 mb-0 text-gray-800">General Translations</h1>
    <div class="btn-group">
        <a href="{{ route('administration.landing_page') }}" class="btn btn-sm btn-default shadow-sm"><i class="fas fa-list fa-sm"></i> Back to Administration</a>
    </div>
</div>

<div class="row">
    <div class="col-md-12">
        <div class="card shadow mb-4">
            <div class="card-header py-3">
                <h6 class="m-0 font-weight-bold text-primary">General Translations</h6>
            </div>
            <div class="card-body">
                <div class="table-responsive">
                    <table class="table table-hover" id="general-translations-dataTable" width="100%" cellspacing="0">
                        <thead>
                            <tr>
                                <th>Name</th>
                                <th>Location</th>
                                <th>Default Text</th>
                                <th class="text-center" style="width: 135px;">Actions</th>
                            </tr>
                        </thead>
                        <tbody>
                            @if(count($language_translations) > 0)
                            @foreach($language_translations as $translation)
                            <tr>
                                <td>{{$translation['name']}} </td>
                                <td>{{$translation['location']}}</td>
                                <td>{{$translation['text']}}</td>
                                <td class="text-center">
                                    <a href="{{ route('admin.languages.general.translations.show', $translation['code']) }}" class="btn btn-sm btn-primary"><i class="fas fa-edit"></i></a>
                                </td>
                            </tr>
                            @endforeach
                            @endif
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script type="text/javascript">
$(document).ready(function(){
    $("#general-translations-dataTable").DataTable();
});
</script>
@endpush