89 lines
4.5 KiB
Twig
89 lines
4.5 KiB
Twig
|
{% extends 'base.html.twig' %}
|
||
|
|
|
||
|
|
{% form_theme form 'form/error_theme.html.twig' %}
|
||
|
|
|
||
|
|
{% block stylesheets %}
|
||
|
|
{{ parent() }}
|
||
|
|
{% endblock %}
|
||
|
|
|
||
|
|
{% block title %}{{ 'view.login.title'|trans({}, 'view', app.request.session.get('_locale')) }}{% endblock %}
|
||
|
|
|
||
|
|
{% block body_content %}
|
||
|
|
{% set lang = app.request.session.get('_locale') is defined and app.request.session.get('_locale') is not null ? app.request.session.get('_locale') : app.request.server.get('DEFAULT_LOCALE') %}
|
||
|
|
|
||
|
|
<div class="container mx-auto">
|
||
|
|
<div id="headercontainer">
|
||
|
|
<div id="langcontainer" class="flex justify-around">
|
||
|
|
{% for locale in locales %}
|
||
|
|
<a href="{{ asset(path('locale_change', {'locale':locale })) }}" title="{{locale}}" aria-label="{{locale}}"><img class="w-10" src="{{ asset('flags/'~ locale ~'.svg') }}"/></a>
|
||
|
|
{% endfor %}
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div id="titlecontainer" class="text-center p-5">
|
||
|
|
{% if loginRequestInfo.client.logo_uri is not empty %}
|
||
|
|
<img class="mx-auto" style="width:150px" src="{{ loginRequestInfo.client.logo_uri }}" alt="user image" />
|
||
|
|
{% endif %}
|
||
|
|
<h1 class="font-medium leading-tight text-5xl">{{ loginRequestInfo.client.client_name }}</h1>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div id="subtitlecontainer">
|
||
|
|
<h2 class="font-medium leading-tight text-3xl mt-0 mb-5 text-center">{{ 'view.login.call_to_action'|trans({}, 'view', app.request.session.get('_locale')) }}</h2>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div id="flashcontainer">
|
||
|
|
{% block flash %}
|
||
|
|
{% for type, alert in {error: 'bg-red-400', danger: 'bg-red-400', warning: 'bg-yellow-400', info: 'bg-blue-400', success: 'bg-green-400'} %}
|
||
|
|
{% for message in app.session.flashBag.get(type) %}
|
||
|
|
<div class="rounded mb-5 p-5 {{alert}}">
|
||
|
|
<p role="{{ alert is same as('success') ? 'status' : (alert is same as('danger') or alert is same as ('warning'))? 'alert' : '' }}">
|
||
|
|
{{ message|raw }}
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
{% endfor %}
|
||
|
|
{% endfor %}
|
||
|
|
{% endblock %}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div id="maincontainer">
|
||
|
|
{{ form_start(form) }}
|
||
|
|
|
||
|
|
<div id="formerrorcontainer">
|
||
|
|
{{ form_errors(form.app) }}
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div id="choicecontainer">
|
||
|
|
{% for choice in form.app.vars.choices %}
|
||
|
|
{% set choice_id = form.app.vars.full_name ~ '[' ~ choice.value ~ ']' %}
|
||
|
|
{% set label_id = form.app.vars.full_name ~ '-label-' ~ choice.value %}
|
||
|
|
<div class="choicelogin last:mb-0 mb-5">
|
||
|
|
<input aria-labelledby="{{label_id}}" type="submit" class="hidden" id="{{ choice_id }}" value="{{ choice.value }}" name="{{form.app.vars.full_name}}" />
|
||
|
|
|
||
|
|
<label for="{{ choice_id }}" class="app-item flex flex-row w-full cursor-pointer rounded-lg bg-white shadow-lg">
|
||
|
|
{% if choice.data.iconUrl %}
|
||
|
|
<div class="choiceloginlogo w-full h-auto object-cover w-24 rounded-t-lg rounded-r-none rounded-l-lg bg-contain bg-no-repeat bg-center ml-5 mr-2" style="background-image:url('{{ choice.data.iconUrl }}')"></div>
|
||
|
|
{% endif %}
|
||
|
|
|
||
|
|
<div class="choicelogintitle p-6 flex flex-col justify-start w-full">
|
||
|
|
<h5 class="text-gray-900 text-xl font-medium mb-2">{{ choice.label }}</h5>
|
||
|
|
<p class="text-gray-700 text-base mb-4">
|
||
|
|
{{ choice.data.description(lang) }}
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
{% endfor %}
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{% do form.app.setRendered %}
|
||
|
|
|
||
|
|
<div id="submitcontainer">
|
||
|
|
{{form_row(form.submit, {'attr' : {'class' : 'btnlogin w-full px-7 py-5 mt-5 bg-sky-500 text-white font-medium text-sm cursor-pointer leading-snug uppercase rounded shadow-md hover:bg-sky-700 hover:shadow-lg focus:bg-sky-900 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-sky-900 active:shadow-lg transition duration-150 ease-in-out'}})}}
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{{ form_rest(form) }}
|
||
|
|
{{ form_end(form) }}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{% endblock %}
|