Aktionen

Materialarchiv: Unterschied zwischen den Versionen

Aus exmediawiki

Theo (Diskussion | Beiträge)
Theo (Diskussion | Beiträge)
Keine Bearbeitungszusammenfassung
Zeile 5: Zeile 5:
</h2>
</h2>
<br>
<br>
=== Natural materials ===
<div style="display: flex; flex-wrap: wrap; gap: 1em; justify-content: flex-start;">
<div style="display: flex; flex-wrap: wrap; gap: 1em; justify-content: flex-start;">


<!-- Collapsible Block 1 -->
<!-- Image Block Start -->
<div style="flex: 0 0 calc(20% - 1em);">
<div style="flex: 0 0 calc(20% - 1em);">
   <div class="collapsible-box">
   [[File:Test image1.jpg|300x200px|link=Gestein]]
    <input type="checkbox" id="toggle1" style="display: none;">
  <div style="margin-top: 0.5em;">[[:Category:Gestein|Gestein]]</div>
    <label for="toggle1" class="collapsible-label">Gestein</label>
    <div class="collapsible-content">
      This is content for Gestein.
    </div>
  </div>
</div>
</div>


<!-- Collapsible Block 2 -->
<div style="flex: 0 0 calc(20% - 1em);">
<div style="flex: 0 0 calc(20% - 1em);">
   <div class="collapsible-box">
   [[File:Test image1.jpg|300x200px|link=Holz]]
    <input type="checkbox" id="toggle2" style="display: none;">
  <div style="margin-top: 0.5em;">[[:Category:Holz|Holz]]</div>
    <label for="toggle2" class="collapsible-label">Holz</label>
    <div class="collapsible-content">
      This is content for Holz.
    </div>
  </div>
</div>
</div>


<!-- Collapsible Block 3 -->
<div style="flex: 0 0 calc(20% - 1em);">
<div style="flex: 0 0 calc(20% - 1em);">
   <div class="collapsible-box">
   [[File:Test image1.jpg|300x200px|link=Tierische Werkstoffe]]
    <input type="checkbox" id="toggle3" style="display: none;">
  <div style="margin-top: 0.5em;">[[:Category:Tierische Werkstoffe|Tierische Werkstoffe]]</div>
    <label for="toggle3" class="collapsible-label">Tierische Werkstoffe</label>
    <div class="collapsible-content">
      This is content for Tierische Werkstoffe.
    </div>
  </div>
</div>
</div>


</div>
</div>
 
</div>
<!-- STYLES -->
<br>
<style>
<br>
  .collapsible-box {
    border: 2px solid #000;
    border-radius: 12px;
    padding: 0;
    background-color: #111;
    color: white;
    font-family: sans-serif;
    overflow: hidden;
  }
 
  .collapsible-label {
    display: block;
    padding: 0.75em 1em;
    background-color: #222;
    cursor: pointer;
    font-weight: bold;
    border-radius: 12px 12px 0 0;
    transition: background-color 0.3s;
  }
 
  .collapsible-label:hover {
    background-color: #333;
  }
 
  .collapsible-content {
    display: none;
    padding: 1em;
    background-color: #1a1a1a;
    border-top: 1px solid #333;
    border-radius: 0 0 12px 12px;
  }
 
  input[type="checkbox"]:checked + .collapsible-label + .collapsible-content {
    display: block;
  }
</style>


=== Synthetic materials ===
=== Synthetic materials ===

Version vom 14. Mai 2025, 14:49 Uhr