templates/templates/pages/services/services-procedure.html.twig line 1

Open in your IDE?
  1. {% extends "layouts/services.html.twig" %}
  3. {% block bodyClass %}tpl-activity has-services-skin{% endblock %}
  5. {% block siteHeader %}
  6.   {% include 'organisms/services-area-header.html.twig' with {
  7. } %}{% endblock %}
  9. {% block pageHeader %}
  10.     <div class="page-header-wrapper">
  11.         <div class="container">
  12.             {% include 'molecules/page-header.html.twig' with {
  13.                 breadcrumb: [
  14.                     { path: path('services-strategy'), title: 'Estratexia' },
  15.                     { path: path('services-program'), title: 'Programa' },
  16.                     { path: path('services-activity'), title: 'Actividade' }
  17.                 ],
  18.                 title: 'Trámite',
  19.             } %}
  20.         </div>
  21.     </div>
  22. {% endblock %}
  24. {% block pageContent %}
  26.     <article class="activity-wrapper">
  27.         <div class="activity-header">
  28.             <div class="at-lead-text">
  29.                 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec viverra eros quis ex malesuada
  30.                     pellentesque. Suspendisse mauris mauris, ultricies id egestas ac, consectetur a tortor. </p>
  31.             </div>
  33.             <div class="activity-description">
  35.                 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc mollis efficitur massa, quis
  36.                     condimentum ex scelerisque sed. Nunc ornare ligula augue, ac egestas dolor semper sit amet. Nulla
  37.                     lobortis convallis est et ultricies. Nunc id lectus nibh. Donec sodales massa vel dictum volutpat.
  38.                     Aenean facilisis sollicitudin nibh at commodo. Nullam rutrum condimentum dolor, et sodales turpis
  39.                     accumsan et. Ut nec eros justo. Aenean sagittis neque tortor, ac euismod nibh efficitur ac.
  40.                     Suspendisse luctus, felis vel varius tincidunt, felis lorem malesuada nulla, non porttitor felis
  41.                     arcu vel urna. Interdum et malesuada fames ac ante ipsum primis in faucibus. Cras pellentesque est
  42.                     justo, sed blandit justo placerat vel. Nulla ac consequat purus. Curabitur quis ante quis orci
  43.                     mattis viverra. Quisque non risus justo. Quisque vel tincidunt ex.</p>
  44.             </div>
  46.             <aside class="activity-attachments">
  47.                 <div class="ml-alert is-attached">
  48.                     <h3 class="at-title">Aviso</h3>
  49.                     <div class="at-text">
  50.                         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec viverra eros quis ex.</p>
  51.                     </div>
  52.                 </div>
  54.                 <ul class="ml-buttons-list is-vertical">
  55.                     <li>
  56.                       <a href="" class="at-button is-tertiary at-icon-paperclip">Adxunto</a>
  57.                     </li>
  58.                     <li>
  59.                         <a href="" class="at-button is-tertiary at-icon-paperclip">Adxunto</a>
  60.                     </li>
  61.                     <li>
  62.                         <a href="" class="at-button is-tertiary at-icon-external-link">Ligazón</a>
  63.                     </li>
  64.                 </ul>
  65.             </aside>
  66.         </div>
  68.         <usc-tabs id="uscTabs01" name="UscTabList">
  69.             <template v-slot:header>
  70.                 <usc-tabs-header-item :is-active="true" controls="tab01">
  71.                     Máis información
  72.                 </usc-tabs-header-item>
  73.                 <usc-tabs-header-item controls="tab02">
  74.                     Datas e requisitos
  75.                 </usc-tabs-header-item>
  76.                 <usc-tabs-header-item controls="tab03">
  77.                     Localización e contacto
  78.                 </usc-tabs-header-item>
  79.             </template>
  81.             <template v-slot:body>
  82.                 <usc-tabs-body-item :is-active="true" name="tab01">
  83.                     <template v-slot:mobile-header>
  84.                         Máis información
  85.                     </template>
  86.                     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec viverra eros quis ex malesuada
  87.                         pellentesque. Suspendisse mauris mauris, ultricies id egestas ac, consectetur a tortor.
  88.                         Vestibulum ac convallis lectus. Proin in nibh imperdiet, iaculis dui in, aliquet augue. Fusce
  89.                         tincidunt mattis massa et sollicitudin. Proin at lacinia metus. Pellentesque volutpat, ipsum nec
  90.                         consequat consectetur, dui ligula suscipit enim, a pulvinar mi odio ut dui.</p>
  91.                 </usc-tabs-body-item>
  92.                 <usc-tabs-body-item name="tab02">
  93.                     <template v-slot:mobile-header>
  94.                         Datas e requisitos
  95.                     </template>
  96.                     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  97.                     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  99.                     <table class="ml-table">
  100.                         <thead>
  101.                         <tr>
  102.                             <th>Col 1</th>
  103.                             <th>Col 2</th>
  104.                             <th>Col 3</th>
  105.                             <th>Col 4</th>
  106.                             <th>Col 5</th>
  107.                         </tr>
  108.                         </thead>
  109.                         <tbody>
  110.                         <tr>
  111.                             <td>Dato 1</td>
  112.                             <td>Dato 2</td>
  113.                             <td>Dato 3</td>
  114.                             <td>Dato 4</td>
  115.                             <td>Dato 5</td>
  116.                         </tr>
  117.                         <tr>
  118.                             <td>Dato 1</td>
  119.                             <td>Dato 2</td>
  120.                             <td>Dato 3</td>
  121.                             <td>Dato 4</td>
  122.                             <td>Dato 5</td>
  123.                         </tr>
  124.                         <tr>
  125.                             <td>Dato 1</td>
  126.                             <td>Dato 2</td>
  127.                             <td>Dato 3</td>
  128.                             <td>Dato 4</td>
  129.                             <td>Dato 5</td>
  130.                         </tr>
  131.                         </tbody>
  132.                     </table>
  134.                 </usc-tabs-body-item>
  135.                 <usc-tabs-body-item name="tab03">
  136.                     <template v-slot:mobile-header>
  137.                         Localización e contacto
  138.                     </template>
  139.                     <div class="row">
  140.                         <div class="col-lg-6">
  141.                             {% include 'molecules/specs/contact.html.twig'with {
  142.                                 title: 'Unidade relacionada'} %}
  143.                         </div>
  144.                         <div class="col-lg-6">
  145.                             {% include 'molecules/specs/contact.html.twig'with {
  146.                                 title: 'Información de contacto'} %}
  147.                         </div>
  148.                     </div>
  149.                 </usc-tabs-body-item>
  150.             </template>
  151.         </usc-tabs>
  153.         <form class="ml-form has-margin-top">
  154.             <div class="row">
  155.                 <div class="col-lg-6">
  156.                     <header class="form-header">
  157.                         <h3 class="at-title">Formulario</h3>
  158.                         <h4 class="form-header-legend">Formulario de contacto ou inscrición</h4>
  159.                         <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eius a modi, dolorem voluptas itaque impedit iure sunt enim unde consequuntur explicabo delectus, harum dolorum natus reiciendis laboriosam commodi doloribus obcaecati</p>
  160.                     </header>
  161.                 </div>
  162.             </div>
  164.             <div class="form-content">
  165.                 <div class="row">
  166.                     <div class="col-lg-6">
  167.                         <div class="form-group">
  168.                             <label for="form2-example-input" class="is-sr-only">Input xenérico</label>
  169.                             <input type="text" class="form-control" id="form2-example-input" placeholder="Input xenérico">
  170.                         </div>
  171.                     </div>
  173.                     <div class="col-lg-6">
  174.                         <div class="form-group">
  175.                             <label for="form2-example-input" class="is-sr-only">Input xenérico</label>
  176.                             <input type="text" class="form-control" id="form2-example-input" placeholder="Input xenérico">
  177.                         </div>
  178.                     </div>
  179.                 </div>
  181.                 <div class="row">
  182.                     <div class="col-lg-6">
  183.                         <div class="form-group">
  184.                             <label for="form2-example-input" class="is-sr-only">Input xenérico</label>
  185.                             <input type="text" class="form-control" id="form2-example-input" placeholder="Input xenérico">
  186.                         </div>
  187.                     </div>
  189.                     <div class="col-lg-6">
  190.                         <div class="form-group">
  191.                             <label for="form2-example-select" class="is-sr-only">Selecciona unha opción</label>
  192.                             <select class="form-control" id="form2-example-select">
  193.                                 <option>Selecciona unha opción</option>
  194.                                 <option>2</option>
  195.                                 <option>3</option>
  196.                                 <option>4</option>
  197.                             </select>
  198.                         </div>
  199.                     </div>
  200.                 </div>
  202.                 <div class="form-check-group">
  203.                     <div class="form-check form-check-inline">
  204.                         <input type="radio" name="example-radio" id="form2-example-radio-1" value="option1">
  205.                         <label class="form-check-label" for="form2-example-radio-1">Marca esta opción</label>
  206.                     </div>
  208.                     <div class="form-check form-check-inline">
  209.                         <input type="radio" name="example-radio" id="form2-example-radio-2" value="option2">
  210.                         <label class="form-check-label" for="form2-example-radio-2">Marca esta opción</label>
  211.                     </div>
  213.                     <div class="form-check form-check-inline">
  214.                         <input type="radio" name="example-radio" id="form2-example-radio-3" value="option2">
  215.                         <label class="form-check-label" for="form2-example-radio-3">Marca esta opción</label>
  216.                     </div>
  217.                 </div>
  219.                 <div class="form-check">
  220.                     <input type="checkbox" id="form2-example-check-1">
  221.                     <label class="form-check-label" for="form2-example-check-1">Acepta este texto</label>
  222.                 </div>
  224.                 <div class="form-actions">
  225.                     <button type="submit" class="at-button is-primary">Enviar</button>
  226.                 </div>
  227.             </div>
  228.         </form>
  230.     </article>
  235. {% endblock %}
  237. {% block siteFooter %}
  238.     {% include 'organisms/site-footer.html.twig' %}
  239. {% endblock %}