Predloga:DIY: Razlika med redakcijama

← Starejše urejanje

VizualnoVikibesedilo

Trenutna redakcija s časom 15:03, 20. marec 2026

Primer naslova 1

@@ Vrstica 1: / Vrstica 1: @@
-{| class="wikitable" style="margin-left:auto; margin-right:auto; width:100%; background-color:#FFFF; table-layout:fixed; border-collapse:separate; border-spacing:15px; border:none;"
+<includeonly>
-|-
+<div style="display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.2rem; margin: 0.5rem 0;">
-| style="width:25%; padding:0.5em; vertical-align:top; border:1px solid #ccc;" | <div style="text-align:center; font-size:110%;">[[{{{title1|Primer naslova 1}}}]]</div>
-<hr/>
-[[Slika:{{{image1|Example.jpg}}}|sredina|brezokvirja|200px|link={{{title1|Primer naslova 1}}}]]
-| style="width:25%; padding:0.5em; vertical-align:top; border:1px solid #ccc;" | <div style="text-align:center; font-size:110%;">[[{{{title2|Primer naslova 2}}}]]</div>
+<!-- Projekt 1 -->
-<hr/>
+<div style="background: #DBDBAB; border-radius: 10px; overflow: hidden; box-shadow: 0 4px 5px rgba(0,0,0,0.1); transition: all 0.3s ease; display: flex; flex-direction: column; height: 280px;" onmouseover="this.style.transform='translateY(-4px)'; this.style.boxShadow='0 8px 5px rgba(0,0,0,0.15)'" onmouseout="this.style.transform='translateY(0)'; this.style.boxShadow='0 4px 5px rgba(0,0,0,0.1)'">
-[[Slika:{{{image2|Example.jpg}}}|sredina|brezokvirja|200px|link={{{title2|Primer naslova 2}}}]]
+  <div style="padding: 1rem; text-align: center; flex-shrink: 0;">
+    <div style="font-size: 1.1em; font-weight: bold; color: #2c3e50;">[[{{{title1|Primer naslova 1}}}]]</div>
+  </div>
+  <div style="flex: 1; position: relative; overflow: hidden; background: white;">
+    <div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;">
+      <div style="width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; overflow: hidden;">
+        <div style="width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;">
+          [[Slika:{{{image1|Example.jpg}}}|sredina|link={{{title1|Primer naslova 1}}}|frameless|300px]]
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
-| style="width:25%; padding:0.5em; vertical-align:top; border:1px solid #ccc;" | <div style="text-align:center; font-size:110%;">[[{{{title3|Primer naslova 3}}}]]</div>
+<!-- Projekt 2 -->
-<hr/>
+<div style="background: #DBDBAB; border-radius: 10px; overflow: hidden; box-shadow: 0 4px 5px rgba(0,0,0,0.1); transition: all 0.3s ease; display: flex; flex-direction: column; height: 280px;" onmouseover="this.style.transform='translateY(-4px)'; this.style.boxShadow='0 8px 5px rgba(0,0,0,0.15)'" onmouseout="this.style.transform='translateY(0)'; this.style.boxShadow='0 4px 5px rgba(0,0,0,0.1)'">
-[[Slika:{{{image3|Example.jpg}}}|sredina|brezokvirja|200px|link={{{title3|Primer naslova 3}}}]]
+  <div style="padding: 1rem; text-align: center; flex-shrink: 0;">
+    <div style="font-size: 1.1em; font-weight: bold; color: #2c3e50;">[[{{{title2|Primer naslova 2}}}]]</div>
+  </div>
+  <div style="flex: 1; position: relative; overflow: hidden; background: white;">
+    <div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;">
+      <div style="width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; overflow: hidden;">
+        <div style="width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;">
+          [[Slika:{{{image2|Example.jpg}}}|sredina|link={{{title2|Primer naslova 2}}}|frameless|300px]]
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
-| style="width:25%; padding:0.5em; vertical-align:top; border:1px solid #ccc;" | <div style="text-align:center; font-size:110%;">[[{{{title4|Primer naslova 4}}}]]</div>
+<!-- Projekt 3 -->
-<hr/>
+<div style="background: #DBDBAB; border-radius: 10px; overflow: hidden; box-shadow: 0 4px 5px rgba(0,0,0,0.1); transition: all 0.3s ease; display: flex; flex-direction: column; height: 280px;" onmouseover="this.style.transform='translateY(-4px)'; this.style.boxShadow='0 8px 5px rgba(0,0,0,0.15)'" onmouseout="this.style.transform='translateY(0)'; this.style.boxShadow='0 4px 5px rgba(0,0,0,0.1)'">
-[[Slika:{{{image4|Example.jpg}}}|sredina|brezokvirja|200px|link={{{title4|Primer naslova 4}}}]]
+  <div style="padding: 1rem; text-align: center; flex-shrink: 0;">
-|}
+    <div style="font-size: 1.1em; font-weight: bold; color: #2c3e50;">[[{{{title3|Primer naslova 3}}}]]</div>
+  </div>
+  <div style="flex: 1; position: relative; overflow: hidden; background: white;">
+    <div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;">
+      <div style="width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; overflow: hidden;">
+        <div style="width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;">
+          [[Slika:{{{image3|Example.jpg}}}|sredina|link={{{title3|Primer naslova 3}}}|frameless|300px]]
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+<!-- Projekt 4 -->
+<div style="background: #DBDBAB; border-radius: 10px; overflow: hidden; box-shadow: 0 4px 5px rgba(0,0,0,0.1); transition: all 0.3s ease; display: flex; flex-direction: column; height: 280px;" onmouseover="this.style.transform='translateY(-4px)'; this.style.boxShadow='0 8px 5px rgba(0,0,0,0.15)'" onmouseout="this.style.transform='translateY(0)'; this.style.boxShadow='0 4px 5px rgba(0,0,0,0.1)'">
+  <div style="padding: 1rem; text-align: center; flex-shrink: 0;">
+    <div style="font-size: 1.1em; font-weight: bold; color: #2c3e50;">[[{{{title4|Primer naslova 4}}}]]</div>
+  </div>
+  <div style="flex: 1; position: relative; overflow: hidden; background: white;">
+    <div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;">
+      <div style="width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; overflow: hidden;">
+        <div style="width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;">
+          [[Slika:{{{image4|Example.jpg}}}|sredina|link={{{title4|Primer naslova 4}}}|frameless|300px]]
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+</div>
+</includeonly>
+<noinclude>
+{{DIY}}
+</noinclude>