Vorlage:Inventory: Unterschied zwischen den Versionen

Aus Meddlerde
(Die Seite wurde neu angelegt: „== Inventory == <div style="border: 2px solid #4CAF50; padding: 10px; background-color: #f9f9f9; border-radius: 10px; font-family: 'Roboto', sans-serif; width: 45%; float: left; margin-right: 20px; position: sticky; top: 0;"> <h2 style="color: #4CAF50; text-align: center; margin-top: 5px; margin-bottom: 5px;">Inventory</h2> <table id="inventoryTable" style="width: 100%; border-collapse: collapse; margin-bottom: 5px; font-size: 11px;"> <the…“)
 
Keine Bearbeitungszusammenfassung
 
(4 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 1: Zeile 1:
== Inventory ==
<div style="
<div style="border: 2px solid #4CAF50; padding: 10px; background-color: #f9f9f9; border-radius: 10px; font-family: 'Roboto', sans-serif; width: 45%; float: left; margin-right: 20px; position: sticky; top: 0;">
    background: #fdf8e4 url('https://i.ibb.co/NtjpWMS/parchment-texture.jpg') repeat;
     <h2 style="color: #4CAF50; text-align: center; margin-top: 5px; margin-bottom: 5px;">Inventory</h2>
    border: 3px solid #5c3b1e;
     <table id="inventoryTable" style="width: 100%; border-collapse: collapse; margin-bottom: 5px; font-size: 11px;">
    border-radius: 12px;
    padding: 12px;
    font-family: 'Garamond', 'Times New Roman', serif;
    width: 50%;
    float: left;
    margin-right: 20px;
    box-shadow: 4px 4px 8px rgba(0,0,0,0.4);
    position: sticky;
    top: 0;
">
     <h2 style="
        color: #3b2416;
        text-align: center;
        font-variant: small-caps;
        margin: 5px 0 10px;
        font-size: 20px;
        text-shadow: 1px 1px #f9f0d9;
    ">
        🪙 Inventory
    </h2>
 
     <table style="
        width: 100%;
        border-collapse: collapse;
        font-size: 12px;
        background-color: rgba(255,255,255,0.85);
    ">
         <thead>
         <thead>
             <tr>
             <tr style="background-color: #d7c295; color: #3b2416; font-weight: bold;">
                 <th style="border: 1px solid #4CAF50; padding: 5px;" onclick="sortTable(0)">Item Name</th>
                 <th style="border: 1px solid #5c3b1e; padding: 5px;">Item</th>
                 <th style="border: 1px solid #4CAF50; padding: 5px;" onclick="sortTable(1)">Quantity</th>
                 <th style="border: 1px solid #5c3b1e; padding: 5px;">Qty</th>
                 <th style="border: 1px solid #4CAF50; padding: 5px;" onclick="sortTable(2)">Weight</th>
                 <th style="border: 1px solid #5c3b1e; padding: 5px;">Weight</th>
                 <th style="border: 1px solid #4CAF50; padding: 5px;" onclick="sortTable(3)">Description</th>
                 <th style="border: 1px solid #5c3b1e; padding: 5px;">Description</th>
                 <th style="border: 1px solid #4CAF50; padding: 5px;" onclick="sortTable(4)">Category</th>
                 <th style="border: 1px solid #5c3b1e; padding: 5px;">Category</th>
             </tr>
             </tr>
         </thead>
         </thead>
         <tbody>
         <tbody>
             <tr>
             <tr>
                 <td style="border: 1px solid #4CAF50; padding: 5px;">Longsword</td>
                 <td style="border: 1px solid #5c3b1e; padding: 5px;">{{Item|{{{itemName1}}}}}</td>
                 <td style="border: 1px solid #4CAF50; padding: 5px;">1</td>
                 <td style="border: 1px solid #5c3b1e; padding: 5px; text-align:center;">{{{quantity1}}}</td>
                 <td style="border: 1px solid #4CAF50; padding: 5px;">3 lbs</td>
                 <td style="border: 1px solid #5c3b1e; padding: 5px; text-align:center;">{{{weight1}}}</td>
                 <td style="border: 1px solid #4CAF50; padding: 5px;">A versatile weapon</td>
                 <td style="border: 1px solid #5c3b1e; padding: 5px;">{{{description1}}}</td>
                 <td style="border: 1px solid #4CAF50; padding: 5px;">Weapon</td>
                 <td style="border: 1px solid #5c3b1e; padding: 5px;">{{{category1}}}</td>
             </tr>
             </tr>
             <tr>
             <tr>
                 <td style="border: 1px solid #4CAF50; padding: 5px;">Backpack</td>
                 <td style="border: 1px solid #5c3b1e; padding: 5px;">{{Item|{{{itemName2}}}}}</td>
                 <td style="border: 1px solid #4CAF50; padding: 5px;">1</td>
                 <td style="border: 1px solid #5c3b1e; padding: 5px; text-align:center;">{{{quantity2}}}</td>
                 <td style="border: 1px solid #4CAF50; padding: 5px;">5 lbs</td>
                 <td style="border: 1px solid #5c3b1e; padding: 5px; text-align:center;">{{{weight2}}}</td>
                 <td style="border: 1px solid #4CAF50; padding: 5px;">A sturdy backpack</td>
                 <td style="border: 1px solid #5c3b1e; padding: 5px;">{{{description2}}}</td>
                 <td style="border: 1px solid #4CAF50; padding: 5px;">Gear</td>
                 <td style="border: 1px solid #5c3b1e; padding: 5px;">{{{category2}}}</td>
             </tr>
             </tr>
            <!-- Weitere Gegenstände hier hinzufügen -->
         </tbody>
         </tbody>
     </table>
     </table>
</div>
</div>
<script>
function sortTable(n) {
    var table, rows, switching, i, x, y, shouldSwitch, dir, switchcount = 0;
    table = document.getElementById("inventoryTable");
    switching = true;
    dir = "asc";
    while (switching) {
        switching = false;
        rows = table.rows;
        for (i = 1; i < (rows.length - 1); i++) {
            shouldSwitch = false;
            x = rows[i].getElementsByTagName("TD")[n];
            y = rows[i + 1].getElementsByTagName("TD")[n];
            if (dir == "asc") {
                if (x.innerHTML.toLowerCase() > y.innerHTML.toLowerCase()) {
                    shouldSwitch = true;
                    break;
                }
            } else if (dir == "desc") {
                if (x.innerHTML.toLowerCase() < y.innerHTML.toLowerCase()) {
                    shouldSwitch = true;
                    break;
                }
            }
        }
        if (shouldSwitch) {
            rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);
            switching = true;
            switchcount++;
        } else {
            if (switchcount == 0 && dir == "asc") {
                dir = "desc";
                switching = true;
            }
        }
    }
}
</script>

Aktuelle Version vom 23. August 2025, 15:13 Uhr

🪙 Inventory

<thead> </thead> <tbody> </tbody>
Item Qty Weight Description Category
Vorlage:Item {{{quantity1}}} {{{weight1}}} {{{description1}}} {{{category1}}}
Vorlage:Item {{{quantity2}}} {{{weight2}}} {{{description2}}} {{{category2}}}