Aktionen

Test3: Unterschied zwischen den Versionen

Aus exmediawiki

← Zum vorherigen Versionsunterschied
Theo (Diskussion | Beiträge)
515 Bearbeitungen
Keine Bearbeitungszusammenfassung
Theo (Diskussion | Beiträge)
515 Bearbeitungen
Keine Bearbeitungszusammenfassung
 
(40 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 1: Zeile 1:
<!-- 🔲 Grid Layout for Triggers -->
__NOTOC__
<div style="display: flex; flex-wrap: wrap; gap: 1em;">


<!-- Tile 1 -->
<div style="flex: 0 0 calc(20% - 1em); height: 200px;">


  <div class="mw-collapsible mw-collapsed">
<h2 style="border-bottom: 2px solid black; padding-bottom: 0em;">
    <!-- Trigger -->
  Materials
    <div class="mw-collapsible-toggle" style="float: none;">
</h2>
      <span class="down">[[File:Test image1.jpg|300x200px|center]]<br>Gestein</span>
<br>
    </div>
<h3>Natural materials</h3>


    <!-- Empty placeholder to avoid growing tile -->
<div style="display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; margin-bottom: 50px;">
    <div class="mw-collapsible-content" style="display: none;"></div>
  </div>


<!-- First collapsible item -->
<div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 0.1em); position: relative;">
  <div class="mw-collapsible-toggle">
      <span class="down">
<h5 style="border-bottom: padding-bottom: 1em; font-size: 1.5em;">
  Holz
</h5>
[[File:Test image1.jpg|300px|left|link=Smoky Quartz]]
      </span>
  </div>
  <div class="mw-collapsible-content" style="width: 100%; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: flex-start;">
      <div style="width: 100%; height: 15px;">
</div>
</div>
     
<!-- Image Block Start -->


<!-- Repeat more tiles as needed -->
<div>
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
</div>
<div>
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
<div>
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
<div>
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
<div>
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
</div>
</div>
<!-- First collapsible item -->
<div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 0.1em); position: relative;">
  <div class="mw-collapsible-toggle">
      <span class="down">
<h5 style="border-bottom: padding-bottom: 1em; font-size: 1.5em;">
  Holz
</h5>
[[File:Test image1.jpg|300px|left|link=Smoky Quartz]]
      </span>
  </div>
  <div class="mw-collapsible-content" style="width: 100%; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: flex-start;">
      <div style="width: 100%; height: 15px;">
</div>
     
<!-- Image Block Start -->


<!-- 🔻 Expanded Content BELOW Grid -->
<div>
<!-- You can repeat this block for each collapsible item (manually sync them with triggers) -->
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
<div>
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
<div>
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
<div>
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
<div>
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
</div>
</div>


<div class="mw-collapsible mw-collapsed">
<!-- First collapsible item -->
  <!-- Toggle hidden to open via same file/tile click -->
<div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 0.1em); position: relative;">
   <div class="mw-collapsible-toggle" style="display: none;"></div>
  <div class="mw-collapsible-toggle">
      <span class="down">
<h5 style="border-bottom: padding-bottom: 1em; font-size: 1.5em;">
   Holz
</h5>
[[File:Test image1.jpg|300px|left|link=Smoky Quartz]]
      </span>
  </div>
  <div class="mw-collapsible-content" style="width: 100%; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: flex-start;">
      <div style="width: 100%; height: 15px;">
</div>
     
<!-- Image Block Start -->


  <!-- Full-width expandable section -->
<div>
  <div class="mw-collapsible-content" style="margin-top: 2em; display: flex; gap: 1em; justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto;">
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
<div>
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
<div>
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
<div>
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
<div>
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
</div>
</div>


    <div style="flex: 0 0 auto; text-align: center;">
<!-- First collapsible item -->
      [[File:Test image1.jpg|300x200px|link=Smoky Quartz]]
<div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 0.1em); position: relative;">
       <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
  <div class="mw-collapsible-toggle">
    </div>
      <span class="down">
<h5 style="border-bottom: padding-bottom: 1em; font-size: 1.5em;">
  Holz
</h5>
[[File:Test image1.jpg|300px|left|link=Smoky Quartz]]  
       </span>
  </div>
  <div class="mw-collapsible-content" style="width: 100%; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: flex-start;">
      <div style="width: 100%; height: 15px;">
</div>
     
<!-- Image Block Start -->


    <div style="flex: 0 0 auto; text-align: center;">
<div>
      [[File:Test image1.jpg|300x200px|link=Smoky Quartz]]
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
      <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
    </div>
</div>
<div>
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
<div>
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
<div>
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
<div>
  [[File:Test image1.jpg|300px|left|link=Smoky Quartz|style=max-width:100%;]]
  <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
</div>
</div>
</div>


    <div style="flex: 0 0 auto; text-align: center;">
      [[File:Test image1.jpg|300x200px|link=Smoky Quartz]]
      <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
    </div>


    <div style="flex: 0 0 auto; text-align: center;">
      [[File:Test image1.jpg|300x200px|link=Smoky Quartz]]
      <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
    </div>


    <div style="flex: 0 0 auto; text-align: center;">
</div>
      [[File:Test image1.jpg|300x200px|link=Smoky Quartz]]
      <div style="margin-top: 0.5em;">[[Smoky Quartz]]</div>
    </div>


  </div>
<!-- Content that follows the collapsible section -->
<div style="width: 100%;">
</div>
</div>

Aktuelle Version vom 22. Mai 2025, 14:44 Uhr


Materials


Natural materials
Holz


style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
Holz


style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
Holz


style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
Holz


style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;
style=max-width:100%;


Abgerufen von „https://exmediawiki.khm.de/index.php?title=Test3&oldid=10209“