Cambio do deseño da paxina de servicios.

site/templates/css/main.css

@@ -635,7 +635,7 @@ div[id^="reixa-"] div.modal figure
     flex-direction: column;
     justify-content: center;
     align-items: center;
-    
+
     height: 100%;
     width: 100%;
     max-height: 100%;
@@ -703,6 +703,72 @@ div[id^="reixa-"] figcaption
     animation-duration: 0.6s;
 }
 
+section[id^="destacados-"],
+div[id^="destacados-"]
+{
+    display: grid;
+    grid-template-columns: 1fr;
+}
+
+section[id^="destacados-"] h2,
+div[id^="destacados-"] h2
+{
+    grid-column: 1 / 4;
+
+    border-bottom: 1px solid rgba(var(--cor_10), 0.3);
+
+    text-align: center;
+}
+
+section[id^="destacados-"] div.elemento,
+div[id^="destacados-"] div.elemento
+{
+    display: grid;
+    grid-template-columns: auto 1fr;
+    grid-template-rows: auto 1fr;
+    gap: var(--separacion);
+
+    padding: var(--separacion);
+}
+
+section[id^="destacados-"] .icona,
+div[id^="destacados-"] .icona
+{
+    grid-column: 1;
+    grid-row: 1 / span 2;
+
+    width: calc((var(--separacion) * 2) + 24px);
+    height: calc((var(--separacion) * 2) + 25px);
+
+    padding: var(--separacion);
+
+    border-radius: 0.5rem;
+
+    color: rgb(var(--cor_60));
+    font-size: 1.5rem;
+
+    background-color: rgb(var(--cor_30));
+}
+
+section[id^="destacados-"] h3,
+div[id^="destacados-"] h3
+{
+    grid-column: 2;
+    grid-row: 1;
+
+    margin: 0;
+}
+
+section[id^="destacados-"] p,
+div[id^="destacados-"] p
+{
+    grid-column: 2;
+    grid-row: 2;
+
+    margin: 0;
+    margin-bottom: var(--separacion);
+}
+
 footer#pe
 {
     padding-block: 1.5rem;
@@ -965,6 +1031,12 @@ footer#pe p#desenrolo span
     {
         grid-template-columns: 1fr 1fr 1fr;
     }
+
+    section[id^="destacados-"],
+    div[id^="destacados-"]
+    {
+        grid-template-columns: repeat(2, 1fr);
+    }
 }
 
 @media (min-width: 1024px)
@@ -1010,6 +1082,12 @@ footer#pe p#desenrolo span
     {
         width: calc(50% - (var(--separacion) * 2));
     }
+
+    section[id^="destacados-"],
+    div[id^="destacados-"]
+    {
+        grid-template-columns: repeat(3, 1fr);
+    }
 }
 
 @keyframes zoom

site/templates/layout/func.php

@@ -441,6 +441,72 @@ function renderLigazonImaxe($seccion)
     return $saida;
 }
 
+/**
+ * @param array|PageArray $seccion
+ * @return string
+ */
+
+ function renderDestacado($seccion)
+ {
+     $saida = '';
+     $icona = '';
+ 
+     if($seccion->titular)
+    {
+        $saida .= '<section id="destacados-' . $seccion->id . '">';
+        $saida .= '<h2>' . $seccion->titular . '</h2>';
+        $saida .= getSeccions($seccion->destacados);
+        $saida .= '</section>';
+    }
+    else
+    {
+        $saida .= '<div id="destacados-' . $seccion->id . '">';
+        $saida .= getSeccions($seccion->destacados);
+        $saida .= '</div>';
+    }
+ 
+     return $saida;
+ }
+
+/**
+ * @param array|PageArray $seccion
+ * @param int $posicion
+ * @return string
+ */
+
+ function renderElemento($seccion , $posicion)
+ {
+     $saida = '';
+ 
+     $saida .= '<div class="elemento">';
+     switch($seccion->destacado_icona_tipo->value)
+     {
+         case 'icona':
+             $saida .= '<i class="icona ' . $seccion->parametro_valor .'"></i>';
+             break;
+         case 'imaxe':
+             $saida .= '<img class="icona" src="' . $seccion->imaxe->url . '" alt="' . $seccion->imaxe->description . '">';
+             break;
+         case 'posicion':
+             $saida .= '<span class="icona">' . $posicion . '</span>';
+             break;
+         default:
+             $saida .= '';
+             break;
+     }
+     $saida .= '<h3>' . $seccion->titular . '</h3>';
+     $saida .= $seccion->artigo;
+     if($seccion->botons && $seccion->botons->isEmpty())
+     {
+         $saida .= '<div>' . "\n";
+         $saida .= getSeccions($seccion->botons) . "\n";
+         $saida .= '</div>' . "\n";
+     }
+     $saida .= '</div>'  . "\n";
+ 
+     return $saida;
+ }
+
 
 
 
@@ -521,68 +587,6 @@ function renderBoton($seccion)
 
 
 
-/**
- * @param array|PageArray $seccion
- * @return string
- */
-
- function renderDestacado($seccion)
- {
-     $saida = '';
-     $icona = '';
- 
-     $saida .= '<section class="container mb-5 text-center">' . "\n";
-     $saida .= '<h2 class="border-bottom my-3">' . $seccion->titular . '</h2>' . "\n";
-     $saida .= '<div class="row row-cols-1 row-cols-lg-3 g-4">'  . "\n";
-     $saida .= getSeccions($seccion->destacados);
-     $saida .= '</div>'  . "\n";
-     $saida .= '</section>' . "\n";
- 
-     return $saida;
- }
-
-/**
- * @param array|PageArray $seccion
- * @param int $posicion
- * @return string
- */
-
-function renderElemento($seccion, $posicion = 0)
-{
-    $saida = '';
-
-    $saida .= '<div class="col flex-grow-1 d-flex align-items-start">'  . "\n";
-    switch($seccion->destacado_icona_tipo->value)
-    {
-        case 'icona':
-            $saida .= '<div class="feature-icon d-inline-flex align-items-center justify-content-center flex-shrink-0 text-bg-primary bg-gradient fs-4 rounded-3 me-3"><i class="' . $seccion->parametro_valor .' bi"></i></div>';
-            break;
-        case 'imaxe':
-            $saida .= '<div class="feature-icon d-inline-flex align-items-center justify-content-center flex-shrink-0 text-bg-primary bg-gradient fs-4 rounded-3 me-3"><img src="' . $seccion->imaxe->url . '" alt="' . $seccion->imaxe->description . '"></div>';
-            break;
-        case 'posicion':
-            $saida .= '<div class="d-inline-flex align-items-center justify-content-center fs-4 flex-shrink-0 me-3"><span class="display-2 fw-bold text-secondary">' . $posicion . '</span></div>';
-            break;
-        default:
-            $saida .= '';
-            break;
-    }
-    $saida .= '<div class="row mb-lg-5">'  . "\n";
-    $saida .= '<div class="col mx-auto text-start">' . "\n";
-    $saida .= renderTexto($seccion);
-    if($seccion->botons && $seccion->botons->isEmpty())
-    {
-        $saida .= '<div class="row text-center">' . "\n";
-        $saida .= getSeccions($seccion->botons) . "\n";
-        $saida .= '</div>' . "\n";
-    }
-    $saida .= '</div>'  . "\n";
-    $saida .= '</div>'  . "\n";
-    $saida .= '</div>'  . "\n";
-
-    return $saida;
-}
-
 /**
  * @param array|PageArray $seccion
  * @return string

site/templates/paxina.php

@@ -12,11 +12,16 @@ if($configuracion['mantemento']['activo'] && !$user->isLoggedin())
 else
 {
     
-    $menu = renderMenu($inicio->children);
+    $menu = renderMenu($inicio->and($inicio->children));
-
+?>
-    $contido .= renderMigasPan($page) . "\n";
+    <main id="contido" class="completo">
-    $contido .= '<article id="' . $page->name .'" class="container">' . "\n";
+        <nav id="migas" aria-label="<?=_x("Breadcrumb", "Breadcrumb");?>">
-    $contido .= '<h2 class="visually-hidden">' . ucfirst($page->title) . '</h2>' . "\n";
+            <?=renderMigasPan($page);?>
-    $contido .= getSeccions($page->seccions) . "\n";
+        </nav>
-    $contido .= '</article>' . "\n";
+        <article id="servicios">
+            <h1 class="visually-hidden"><?=ucfirst($page->title);?></h1>
+            <?=getSeccions($page->seccions);?>
+        </article>
+    </main>
+<?php
 }