Template:GuideCardLayout: Difference between revisions

Revision as of 23:59, 18 January 2025

Guide Title 1

Guide content goes here...

<a href="#">Go to Guide</a>

Guide Title 2

Guide content goes here...

<a href="#">Go to Guide</a>

@@ Line 1: / Line 1: @@
-<div style="display: flex; flex-wrap: wrap; gap: 1em;">
+<div class="guidecardlayout">
-{{#fornum:i|1|{{{count|1}}}}}
+<div class="guidecardlayout-card">
-<div style="border: 1px solid #ccc; padding: 1em; border-radius: 8px; width: 100%; max-width: 300px; box-shadow: 2px 2px 5px rgba(0,0,0,0.1);">
+<div class="guidecardlayout-title">{{{title1|Guide Title 1}}}</div>
-<div style="font-weight: bold; font-size: 1.2em;">{{{title{{i}}|Guide Title}}}</div>
+<div class="guidecardlayout-content">{{{content1|Guide content goes here...}}}</div>
-<div style="margin: 0.5em 0;">{{{content{{i}}|Guide content goes here...}}}</div>
+<div class="guidecardlayout-button">
-<div style="text-align: center;">
+<a href="{{{link1|#}}}">Go to Guide</a>
-<a href="{{{link{{i}}|#}}}" style="background-color: #0073e6; color: white; padding: 0.5em 1em; text-decoration: none; border-radius: 4px;">Go to Guide</a>
 </div>
 </div>
-{{#endfor}}
+<div class="guidecardlayout-card">
+<div class="guidecardlayout-title">{{{title2|Guide Title 2}}}</div>
+<div class="guidecardlayout-content">{{{content2|Guide content goes here...}}}</div>
+<div class="guidecardlayout-button">
+<a href="{{{link2|#}}}">Go to Guide</a>
+</div>
+</div>
+<!-- Add more cards by copying the structure above and incrementing the numbers -->
 </div>