Predefinição:CarrousselAvancado: mudanças entre as edições

Predefinição:CarrousselAvancado (editar)

Edição das 16h31min de 24 de novembro de 2024

621 bytes removidos , 24 de novembro de 2024

sem sumário de edição

Isabel Xavier

Administradores da interface, Administradores (Semantic MediaWiki), Editores (Semantic MediaWiki), Administradores

352

edições

@@ Linha 1: / Linha 1: @@
-<div id="photo-slider" class="carousel slide" data-ride="carousel" style="width: 100%;">
+<div id="photo-slider" class="carousel slide" data-ride="carousel" style="width: 100%; max-width: 100%; height: auto;">
    <!-- Indicators -->
    <ol class="carousel-indicators">
@@ Linha 5: / Linha 5: @@
      {{#if: {{{Slide2}}} | <li data-target="#photo-slider" data-slide-to="1"></li> }}
      {{#if: {{{Slide3}}} | <li data-target="#photo-slider" data-slide-to="2"></li> }}
-    {{#if: {{{Slide4}}} | <li data-target="#photo-slider" data-slide-to="3"></li> }}
    </ol>
@@ Linha 13: / Linha 12: @@
      <div class="carousel-item active">
        [[File:{{{Slide1Image}}}|class=img-fluid|alt={{{Slide1Alt}}}|style=width:100%;height:auto;]]
-       <div class="carousel-caption d-md-block" style="background-color: rgba(0, 0, 0, 0.6); padding: 10px; border-radius: 5px;">
+       <div class="carousel-caption d-md-block" style="position: absolute; top: 0; left: 0; width: 100%; background: rgba(0,0,0,0.5); padding: 20px; text-align: left;">
-         <a href="{{{Slide1Link}}}" style="color:white; text-decoration:none; font-size: 1.5rem; font-weight: bold;">{{{Slide1Title}}}</a>
+         <h5 style="color: white; font-size: 1.8rem; font-weight: bold;">{{{Slide1Title}}}</h5>
-         <p style="color:white; font-size:1rem;">{{{Slide1Description}}}</p>
+         <p style="color: white; font-size: 1.2rem;">{{{Slide1Description}}}</p>
+        <a href="{{{Slide1Link}}}" style="color: #ffffff; text-decoration: underline; font-size: 1rem;">Leia mais</a>
        </div>
      </div>
@@ Linha 22: / Linha 22: @@
      <div class="carousel-item">
        [[File:{{{Slide2Image}}}|class=img-fluid|alt={{{Slide2Alt}}}|style=width:100%;height:auto;]]
-       <div class="carousel-caption d-md-block" style="background-color: rgba(0, 0, 0, 0.6); padding: 10px; border-radius: 5px;">
+       <div class="carousel-caption d-md-block" style="position: absolute; top: 0; left: 0; width: 100%; background: rgba(0,0,0,0.5); padding: 20px; text-align: left;">
-         <a href="{{{Slide2Link}}}" style="color:white; text-decoration:none; font-size: 1.5rem; font-weight: bold;">{{{Slide2Title}}}</a>
+         <h5 style="color: white; font-size: 1.8rem; font-weight: bold;">{{{Slide2Title}}}</h5>
-         <p style="color:white; font-size:1rem;">{{{Slide2Description}}}</p>
+         <p style="color: white; font-size: 1.2rem;">{{{Slide2Description}}}</p>
+        <a href="{{{Slide2Link}}}" style="color: #ffffff; text-decoration: underline; font-size: 1rem;">Leia mais</a>
        </div>
      </div>
@@ Linha 31: / Linha 32: @@
      <div class="carousel-item">
        [[File:{{{Slide3Image}}}|class=img-fluid|alt={{{Slide3Alt}}}|style=width:100%;height:auto;]]
-       <div class="carousel-caption d-md-block" style="background-color: rgba(0, 0, 0, 0.6); padding: 10px; border-radius: 5px;">
+       <div class="carousel-caption d-md-block" style="position: absolute; top: 0; left: 0; width: 100%; background: rgba(0,0,0,0.5); padding: 20px; text-align: left;">
-         <a href="{{{Slide3Link}}}" style="color:white; text-decoration:none; font-size: 1.5rem; font-weight: bold;">{{{Slide3Title}}}</a>
+         <h5 style="color: white; font-size: 1.8rem; font-weight: bold;">{{{Slide3Title}}}</h5>
-         <p style="color:white; font-size:1rem;">{{{Slide3Description}}}</p>
+         <p style="color: white; font-size: 1.2rem;">{{{Slide3Description}}}</p>
-      </div>
+         <a href="{{{Slide3Link}}}" style="color: #ffffff; text-decoration: underline; font-size: 1rem;">Leia mais</a>
-    </div>
-    }}
-    {{#if: {{{Slide4}}} |
-    <div class="carousel-item">
-      [[File:{{{Slide4Image}}}|class=img-fluid|alt={{{Slide4Alt}}}|style=width:100%;height:auto;]]
-      <div class="carousel-caption d-md-block" style="background-color: rgba(0, 0, 0, 0.6); padding: 10px; border-radius: 5px;">
-         <a href="{{{Slide4Link}}}" style="color:white; text-decoration:none; font-size: 1.5rem; font-weight: bold;">{{{Slide4Title}}}</a>
-        <p style="color:white; font-size:1rem;">{{{Slide4Description}}}</p>
        </div>
      </div>
@@ Linha 58: / Linha 51: @@
    </a>
 </div>
-<noinclude>
-Esta predefinição exibe um carrossel responsivo com imagens, títulos e textos clicáveis.
-Parâmetros:
-* Slide1, Slide2, Slide3, Slide4: Ative os slides desejados (ex. "sim").
-* SlideXImage: Nome da imagem.
-* SlideXAlt: Texto alternativo para acessibilidade.
-* SlideXLink: Link clicável.
-* SlideXTitle: Título do slide.
-* SlideXDescription: Descrição breve.
-</noinclude>