@extends('layouts.medium')

@section('header')
    @include('inc.banner_top')
@endsection

@section('content')

<div class="alert border border-blue bg-light-blue text-center text-dark-blue fs-small rounded-pill">
    <strong>Atentie!</strong> Aceasta este o pagină destinată exclusiv proiectului ROSE. <br>
    Dacă nu ești implicat în proiectul ROSE și dorești să completezi testele, te rugăm sa dai click <a href="/" class='text-dark-blue fw-bold'>AICI</a>.
</div>

<div class="rounded-more border p-4">
    <div class="text-center">
    <h2>ROSE</h2>
    <h5 class="text-blue">ROMANIA SECONDARY EDUCATION PROJECT</h5>

    <p class="text-secondary"><i>Proiectul privind învățământul secundar</i><br>  
        organizat de Unitatea de Management al Proiectelor cu Finanțare Externă<p>

    <hr>
    <p  class="text-secondary">Tu decizi ordinea completării testelor – introdu codul de acces și dă click pe "Începe"!</p>
</div>
    <div class="bg-light border rounded p-4">
        <div class="row" >

            <!-- IST form -->
            <div class="col-md-3">
                <x-test-form 
                    test="IST"
                    motto="CE POȚI SĂ FACI?" 
                    title="Testul de inteligenta <br>(IST)" 
                    image="../images/pm1_small.png"
                    wrapper-class="border-bottom border-md-bottom-0"
                    title-class="text-blue mb-3"
                    input-class="col-sm-6 col-md-12"
                ></x-test-form>
            </div>

            <!-- BFQ form -->
            <div class="col-md-3">
                <x-test-form 
                    test="BFQ"
                    motto="CUM ÎȚI PLACE SĂ FACI?" 
                    title="Testul de personalitate <br>(BFQ)" 
                    image="../images/pm2_small.png"
                    wrapper-class="border-bottom border-md-bottom-0"
                    title-class="text-blue mb-3"
                    input-class="col-sm-6 col-md-12 border-md-bottom-0"
                ></x-test-form>
            </div>
            
            <!-- SDS form -->
            <div class="col-md-3">
                <x-test-form 
                    test="SDS"
                    motto="CE ÎȚI PLACE SĂ FACI?" 
                    title="Testul de interese <br>(SDS)" 
                    image="../images/pm3_small.png"
                    wrapper-class="border-bottom border-md-bottom-0"
                    title-class="text-blue mb-3"
                    input-class="col-sm-6 col-md-12"
                ></x-test-form>
            </div>

            <!-- LSI form -->
            <div class="col-md-3">
                <x-test-form 
                    test="LSI"
                    motto="CUM ÎȚI PLACE SĂ ÎNVEȚI?" 
                    title="Learning Styles Inventory <br>(LSI)" 
                    image="../images/pm4_small.png"
                    input-class="col-sm-6 col-md-12"
                ></x-test-form>
            </div>
        </div>
    </div>
</div>

@endsection