nineskeletor/misc/images/hydra-dispatcher/templates/login.html.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 %}