{% extends "layouts/services.html.twig" %}
{% block bodyClass %}tpl-program has-areas-skin{% endblock %}
{% block siteHeader %}
{% include 'organisms/header-examples/services-SNL-header.html.twig' with {
logo: asset('/images/logo-neg.svg')
} %}{% endblock %}
{% block pageHeader %}
<div class="page-header-wrapper">
<div class="container">
{% include 'molecules/page-header-with-menu.html.twig' with {
breadcrumb: [
{ path: path('services-strategy'), title: 'Formación' },
],
title: 'Formación para [PDI/PAS/ESTUDANTES]',
} %}
</div>
</div>
{% endblock %}
{% block pageContent %}
<article class="program-wrapper">
<div class="program-header">
<figure class="at-image">
<img src="https://picsum.photos/1180/280" alt="">
</figure>
<div class="at-lead-text">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec viverra eros quis ex malesuada
pellentesque. Suspendisse mauris mauris, ultricies id egestas ac, consectetur a tortor. </p>
</div>
<div class="program-description">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc mollis efficitur massa, quis
condimentum ex scelerisque sed. Nunc ornare ligula augue, ac egestas dolor semper sit amet.
Nulla lobortis convallis est et ultricies. Nunc id lectus nibh. Donec sodales massa vel
dictum volutpat. Aenean facilisis sollicitudin nibh at commodo. Nullam rutrum condimentum
dolor, et sodales turpis accumsan et. Ut nec eros justo. Aenean sagittis neque tortor, ac
euismod nibh efficitur ac. Suspendisse luctus, felis vel varius tincidunt, felis lorem
malesuada nulla, non porttitor felis arcu vel urna. </p>
</div>
<aside class="program-attachments">
<div class="ml-alert is-attached">
<h3 class="at-title">Aviso</h3>
<div class="at-text">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec viverra eros quis ex.</p>
</div>
</div>
<ul class="ml-buttons-list is-vertical">
<li>
<a href="https://sede.usc.es/sede/publica/index.htm" class="at-button is-tertiary at-icon-external-link">Acceso a procedemento</a>
</li>
<li>
<a href="{{ path('services-procedure') }}" class="at-button is-tertiary at-link-smart-icon">Acceso a trámite</a>
</li>
<li>
<a href="" class="at-button is-tertiary at-icon-paperclip">Adxunto</a>
</li>
</ul>
</aside>
</div>
</article>
<section class="org-tier has-advanced-actions">
<div class="tier-header">
<h2 class="tier-title">Todos os cursos</h2>
<div class="tier-action">
<div class="ml-filters-group">
<usc-dropdown-filter
label="Ano académico"
target-container="#banners-container"
target-items=".ml-banner"
>
<template v-slot:default="slotProps">
<li>
<button type="button" @click="slotProps.filter" data-value="2022-2023">2022-2023</button>
</li>
<li>
<button type="button" @click="slotProps.filter" data-value="tipo2">2021-2022</button>
</li>
<li>
<button type="button" @click="slotProps.filter" data-value="tipo3">2020-2021</button>
</li>
</template>
</usc-dropdown-filter>
<usc-dropdown-filter
label="Localización"
target-container="#banners-container"
target-items=".ml-banner"
>
<template v-slot:default="slotProps">
<li>
<button type="button" @click="slotProps.filter" data-value="scq">Santiago de Compostela</button>
</li>
<li>
<button type="button" @click="slotProps.filter" data-value="lugo">Lugo</button>
</li>
<li>
<button type="button" @click="slotProps.filter" data-value="online">Online</button>
</li>
</template>
</usc-dropdown-filter>
</div>
</div>
</div>
<div class="tier-content">
<div class="org-modules-container has-banners" id="banners-container">
{% include 'molecules/banners/m.html.twig' with {
modifiers: 'is-services is-activity 2022-2023 scq',
title: 'Curso de formación do SNL',
text: 'Do 13 ao 16 de xuño',
link: path('services-activity-auto-snl'),
} %}
{% include 'molecules/banners/m.html.twig' with {
modifiers: 'is-services is-activity 2022-2023 scq',
title: 'Curso de formación do SNL',
text: 'Do 13 ao 16 de xuño',
link: path('services-activity-auto-snl'),
} %}
{% include 'molecules/banners/m.html.twig' with {
modifiers: 'is-services is-activity tipo2 lugo',
title: 'Curso de formación do SNL',
text: 'Do 13 ao 16 de xuño',
link: path('services-activity-auto-snl'),
} %}
{% include 'molecules/banners/m.html.twig' with {
modifiers: 'is-services is-activity tipo3 lugo',
title: 'Curso de formación do SNL',
text: 'Do 13 ao 16 de xuño',
link: path('services-activity-auto-snl'),
} %}
{% include 'molecules/banners/m.html.twig' with {
modifiers: 'is-services is-activity 2022-2023 lugo',
title: 'Curso de formación do SNL',
text: 'Do 13 ao 16 de xuño',
link: path('services-activity-auto-snl'),
} %}
{% include 'molecules/banners/m.html.twig' with {
modifiers: 'is-services is-activity tipo2 scq',
title: 'Curso de formación do SNL',
text: 'Do 13 ao 16 de xuño',
link: path('services-activity-auto-snl'),
} %}
</div>
</div>
</section>
<section class="org-tier has-advanced-actions">
<div class="tier-header">
<h2 class="tier-title">Outro cursos</h2>
</div>
<div class="tier-content">
<div class="org-modules-container has-banners" id="banners-container">
{% include 'molecules/banners/m.html.twig' with {
modifiers: 'is-services is-activity tipo1 lugo',
title: 'Curso de formación do SNL',
text: 'Do 13 ao 16 de xuño',
link: path('services-activity-auto-snl'),
} %}
{% include 'molecules/banners/m.html.twig' with {
modifiers: 'is-services is-activity tipo1 lugo',
title: 'Curso de formación do SNL',
text: 'Do 13 ao 16 de xuño',
link: path('services-activity-auto-snl'),
} %}
{% include 'molecules/banners/m.html.twig' with {
modifiers: 'is-services is-activity tipo1 lugo',
title: 'Curso de formación do SNL',
text: 'Do 13 ao 16 de xuño',
link: path('services-activity-auto-snl'),
} %}
</div>
</div>
</section>
{% endblock %}
{% block siteFooter %}
{% endblock %}