templates/templates/pages/services/simple-facility.html.twig line 1

Open in your IDE?
  1. {% extends "layouts/services.html.twig" %}
  3. {% block bodyClass %}tpl-service tpl-simple-facility has-areas-skin{% endblock %}
  5. {% block siteHeader %}
  6.     {% include 'organisms/services-area-header.html.twig' with {
  7.         logo: asset('/images/logo-neg.svg')
  8.     } %}
  9. {% endblock %}
  11. {% block pageHeader %}
  12.     <div class="page-header-wrapper">
  13.         <div class="container">
  14.             {% include 'molecules/page-header.html.twig' with {
  15.               breadcrumb: [
  16.                   { path: path('services-strategy'), title: 'Estratexia' },
  17.                   { path: path('services-program'), title: 'Programa' }
  18.               ],
  19.                 title: 'Equipamento',
  20.             } %}
  21.         </div>
  22.     </div>
  23. {% endblock %}
  25. {% block pageContent %}
  27. <article class="service-wrapper">
  28.     <div class="service-header">
  29.         <div class="service-contact-info">
  30.             {% include 'molecules/specs/contact.html.twig' with {
  31.               title: 'Localización [edificio]',
  32.             } %}
  33.             <ul class="ml-tags-list">
  34.                     <li>
  35.                         <span class="at-tag is-primary">Equipamento operativo</span>
  36.                     </li>
  37.             </ul>
  38.         </div>
  40.         <div class="service-description">
  41.             <div class="at-lead-text">
  42.                 <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. Vestibulum ac convallis lectus. Proin in nibh imperdiet, iaculis dui in, aliquet augue. Suspendisse mauris mauris, ultricies id egestas ac, consectetur a tortor. Vestibulum ac convallis lectus. Proin in nibh imperdiet, iaculis dui in, aliquet augue. Fusce tincidunt mattis massa et sollicitudin.</p>
  43.             </div>
  44.         </div>
  46.         <aside class="service-attachments">
  47.           <ul class="ml-buttons-list is-vertical">
  48.               <li>
  49.                   <a href="" class="at-button is-tertiary at-icon-external-link">Ligazón externo</a>
  50.               </li>
  51.               <li>
  52.                 <a href="" class="at-button is-tertiary at-icon-external-link">Ligazón externo</a>
  53.               </li>
  54.               <li>
  55.                   <a href="" class="at-button is-tertiary at-icon-paperclip">Documento</a>
  56.               </li>
  57.             </ul>
  58.         </aside>
  59.     </div>
  61. <usc-tabs id="uscTabs01" name="UscTabList">
  62.     <template v-slot:header>
  63.         <usc-tabs-header-item :is-active="true" controls="tab01">
  64.           Máis información
  65.         </usc-tabs-header-item>
  66.         <usc-tabs-header-item controls="tab02">
  67.           Lapela personalizada
  68.         </usc-tabs-header-item>
  69.         <usc-tabs-header-item controls="tab03">
  70.           Unidades ou instalacións relacionadas
  71.         </usc-tabs-header-item>
  73.     </template>
  75.     <template v-slot:body>
  76.         <usc-tabs-body-item :is-active="true" name="tab01">
  77.             <template v-slot:mobile-header>
  78.               Máis información
  79.             </template>
  80.             <usc-carousel>
  81.                 <template slot-scope="carouselSlotProps">
  82.                     <usc-carousel-item v-on:enlarge-carousel="carouselSlotProps.enlarge">
  83.                         <template slot-scope="itemSlotProps">
  84.                             <figure class="at-image">
  85.                                 <a href="https://picsum.photos/800/507" @click.prevent="itemSlotProps.enlargeCarousel">
  86.                                     <img src="https://picsum.photos/800/507" alt="">
  87.                                 </a>
  88.                                 <figcaption class="image-caption">Descrición da imaxe</figcaption>
  89.                             </figure>
  90.                         </template>
  91.                     </usc-carousel-item>
  92.                     <usc-carousel-item v-on:enlarge-carousel="carouselSlotProps.enlarge">
  93.                         <template slot-scope="itemSlotProps">
  94.                             <figure class="at-image">
  95.                                 <a href="https://picsum.photos/800/507" @click.prevent="itemSlotProps.enlargeCarousel">
  96.                                     <img src="https://picsum.photos/800/507" alt="">
  97.                                 </a>
  98.                                 <figcaption class="image-caption">Descrición da imaxe</figcaption>
  99.                             </figure>
  100.                         </template>
  101.                     </usc-carousel-item>
  102.                     <usc-carousel-item v-on:enlarge-carousel="carouselSlotProps.enlarge">
  103.                         <template slot-scope="itemSlotProps">
  104.                             <figure class="at-image">
  105.                                 <a href="https://picsum.photos/800/507" @click.prevent="itemSlotProps.enlargeCarousel">
  106.                                     <img src="https://picsum.photos/800/507" alt="">
  107.                                 </a>
  108.                                 <figcaption class="image-caption">Descrición da imaxe</figcaption>
  109.                             </figure>
  110.                         </template>
  111.                     </usc-carousel-item>
  112.                 </template>
  113.             </usc-carousel>
  114.             <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. Vestibulum ac convallis lectus. Proin in nibh imperdiet, iaculis dui in, aliquet augue. Fusce tincidunt mattis massa et sollicitudin. Proin at lacinia metus. Pellentesque volutpat, ipsum nec consequat consectetur, dui ligula suscipit enim, a pulvinar mi odio ut dui.</p>
  115.             <h3 class="at-title is-subhead">Título</h3>
  116.             <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. Vestibulum ac convallis lectus. Proin in nibh imperdiet, iaculis dui in, aliquet augue. Fusce tincidunt mattis massa et sollicitudin. Proin at lacinia metus. Pellentesque volutpat, ipsum nec consequat consectetur, dui ligula suscipit enim, a pulvinar mi odio ut dui.</p>
  117.         </usc-tabs-body-item>
  119.         <usc-tabs-body-item name="tab02">
  120.             <template v-slot:mobile-header>
  121.               Lapela personalizada
  122.             </template>
  123.             <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. Vestibulum ac convallis lectus.</p>
  124.             <h3 class="at-title is-subhead">Título</h3>
  125.             <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. Vestibulum ac convallis lectus. Proin in nibh imperdiet, iaculis dui in, aliquet augue. Fusce tincidunt mattis massa et sollicitudin. Proin at lacinia metus. Pellentesque volutpat, ipsum nec consequat consectetur, dui ligula suscipit enim, a pulvinar mi odio ut dui.</p>
  126.             <table class="ml-table">
  127.                 <thead>
  128.                 <tr>
  129.                     <th>Col 1</th>
  130.                     <th>Col 2</th>
  131.                     <th>Col 3</th>
  132.                     <th>Col 4</th>
  133.                     <th>Col 5</th>
  134.                 </tr>
  135.                 </thead>
  136.                 <tbody>
  137.                 <tr>
  138.                     <td>Dato 1</td>
  139.                     <td>Dato 2</td>
  140.                     <td>Dato 3</td>
  141.                     <td>Dato 4</td>
  142.                     <td>Dato 5</td>
  143.                 </tr>
  144.                 <tr>
  145.                     <td>Dato 1</td>
  146.                     <td>Dato 2</td>
  147.                     <td>Dato 3</td>
  148.                     <td>Dato 4</td>
  149.                     <td>Dato 5</td>
  150.                 </tr>
  151.                 <tr>
  152.                     <td>Dato 1</td>
  153.                     <td>Dato 2</td>
  154.                     <td>Dato 3</td>
  155.                     <td>Dato 4</td>
  156.                     <td>Dato 5</td>
  157.                 </tr>
  158.                 </tbody>
  159.             </table>
  160.             <p>Proin in nibh imperdiet, iaculis dui in, aliquet augue. Fusce tincidunt mattis massa et sollicitudin. Proin at lacinia metus. Pellentesque volutpat, ipsum nec consequat consectetur, dui ligula suscipit enim, a pulvinar mi odio ut dui.</p>
  161.         </usc-tabs-body-item>
  164.         <usc-tabs-body-item name="tab03">
  165.             <template v-slot:mobile-header>
  166.               Unidades relacionadas
  167.             </template>
  168.             <div class="row">
  169.               <div class="col-lg-6">
  170.                 {% include 'molecules/specs/contact.html.twig'with {
  171.                  title: 'Unidade relacionada'} %}
  172.               </div>
  173.               <div class="col-lg-6">
  174.                 {% include 'molecules/specs/contact.html.twig'with {
  175.                  title: 'Unidade relacionada'} %}
  176.               </div>
  177.               <div class="col-lg-6">
  178.                 {% include 'molecules/specs/contact.html.twig'with {
  179.                  title: 'Instalación'} %}
  180.               </div>
  181.               <div class="col-lg-6">
  182.                 {% include 'molecules/specs/contact.html.twig'with {
  183.                   title: 'Instalación singular'} %}
  184.               </div>
  185.             </div>
  186.         </usc-tabs-body-item>
  188.     </template>
  189. </usc-tabs>
  191. </article>
  195. {% endblock %}
  197. {% block siteFooter %}
  198.     {% include 'organisms/site-footer.html.twig' %}
  199. {% endblock %}