neo/roi24
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Solution: 3-column grid, 80px icons with 32px SVG

Browse Source
This commit is contained in:
neo committed 2026-06-25 19:11:21 +05:00
1 parent fd0d49a79e
commit 45f20c192f
1 file changed
+8 -6
Download Patch File Download Diff File Expand all files Collapse all files
index_ibm.html
+8 -6
View File
@@ -496,6 +496,7 @@ h1 .accent { color: var(--accent); }
/* ── SOLUTION ── */ /* ── SOLUTION ── */
.solution-section { border-bottom: 1px solid var(--border); } .solution-section { border-bottom: 1px solid var(--border); }
.solution-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; }
.sol-card { .sol-card {
padding: 48px 32px; border-right: 1px solid var(--border); padding: 48px 32px; border-right: 1px solid var(--border);
border-bottom: 1px solid var(--border); border-bottom: 1px solid var(--border);
@@ -511,10 +512,11 @@ h1 .accent { color: var(--accent); }
box-shadow: var(--shadow-card-hover); box-shadow: var(--shadow-card-hover);
} }
.sol-icon { .sol-icon {
width: 72px; height: 72px; border: 1px solid var(--accent); width: 80px; height: 80px; border: 2px solid var(--accent);
border-radius: 14px; display: flex; align-items: center; border-radius: 16px; display: flex; align-items: center;
justify-content: center; margin-bottom: 24px; justify-content: center; margin-bottom: 28px;
transition: all 0.3s var(--ease-out); transition: all 0.3s var(--ease-out);
background: var(--accent-dim);
} }
.sol-card:hover .sol-icon { .sol-card:hover .sol-icon {
transform: scale(1.05); transform: scale(1.05);
@@ -930,7 +932,7 @@ h1 .accent { color: var(--accent); }
<div class="solution-grid"> <div class="solution-grid">
<div class="sol-card reveal reveal-delay-1"> <div class="sol-card reveal reveal-delay-1">
<div class="sol-icon"> <div class="sol-icon">
<svg width="28" height="28" viewBox="0 0 16 16" fill="none" stroke="var(--accent)" stroke-width="1.5"> <svg width="32" height="32" viewBox="0 0 16 16" fill="none" stroke="var(--accent)" stroke-width="1.5">
<path d="M9 2L4 8.5h4l-1 5.5L12 7.5H8L9 2z"/> <path d="M9 2L4 8.5h4l-1 5.5L12 7.5H8L9 2z"/>
</svg> </svg>
</div> </div>
@@ -939,7 +941,7 @@ h1 .accent { color: var(--accent); }
</div> </div>
<div class="sol-card reveal reveal-delay-2"> <div class="sol-card reveal reveal-delay-2">
<div class="sol-icon"> <div class="sol-icon">
<svg width="28" height="28" viewBox="0 0 16 16" fill="none" stroke="var(--accent)" stroke-width="1.5"> <svg width="32" height="32" viewBox="0 0 16 16" fill="none" stroke="var(--accent)" stroke-width="1.5">
<path d="M1 8s2.5-4 7-4 7 4 7 4-2.5 4-7 4-7-4-7-4z"/> <path d="M1 8s2.5-4 7-4 7 4 7 4-2.5 4-7 4-7-4-7-4z"/>
<circle cx="8" cy="8" r="2"/> <circle cx="8" cy="8" r="2"/>
</svg> </svg>
@@ -949,7 +951,7 @@ h1 .accent { color: var(--accent); }
</div> </div>
<div class="sol-card reveal reveal-delay-3"> <div class="sol-card reveal reveal-delay-3">
<div class="sol-icon"> <div class="sol-icon">
<svg width="28" height="28" viewBox="0 0 16 16" fill="none" stroke="var(--accent)" stroke-width="1.5"> <svg width="32" height="32" viewBox="0 0 16 16" fill="none" stroke="var(--accent)" stroke-width="1.5">
<rect x="4" y="2" width="8" height="12" rx="1.5"/> <rect x="4" y="2" width="8" height="12" rx="1.5"/>
<line x1="7" y1="11.5" x2="9" y2="11.5"/> <line x1="7" y1="11.5" x2="9" y2="11.5"/>
</svg> </svg>