Skip to Content
0 Votes

Changes for page Home

Last modified by Alex Cotiugă on 2026/01/13 13:12
From version 7.121
edited by Alex Cotiugă
on 2025/11/14 08:59
Change comment: There is no comment for this version
To version 7.119
edited by Alex Cotiugă
on 2025/11/14 08:47
Change comment: There is no comment for this version

Summary

Details

Page properties
Content
... ... @@ -52,14 +52,12 @@
52 52   <p class="lead">10+ years of XWiki expertise with structured delivery and lasting collaboration</p>
53 53   <div class="row widgets" role="list">
54 54   #foreach ($entry in $whySectionData)
55 - <div class="col-xs-12 col-sm-6 col-md-3">
56 - <div class="widget" role="listitem">
57 - <div class="icon" aria-hidden="true">
58 - <i class="fa fa-$entry.icon"></i>
59 - <h4>$entry.title</h4>
60 - </div>
61 - <p>$entry.content</p>
55 + <div class="widget col-sm-6 col-md-3" role="listitem">
56 + <div class="icon" aria-hidden="true">
57 + <i class="fa fa-$entry.icon"></i>
58 + <h4>$entry.title</h4>
62 62   </div>
60 + <p>$entry.content</p>
63 63   </div>
64 64   #end
65 65   </div>
XWiki.StyleSheetExtension[0]
Code
... ... @@ -162,9 +162,20 @@
162 162   /* === WHY CHOOSE (widgets using flex) === */
163 163   .widgets {
164 164   margin-top: 12px;
165 + display: grid;
166 + grid-template-columns: 1fr;
167 + grid-gap: 16px; // spacing between cards
165 165  
169 + @media (min-width: 768px) {
170 + grid-template-columns: repeat(2, 1fr);
171 + }
172 +
173 + @media (min-width: 992px) {
174 + grid-template-columns: repeat(4, 1fr);
175 + }
176 +
166 166   .widget {
167 - height: 100%;
178 + box-sizing: border-box;
168 168   padding: 18px;
169 169   background: #fff;
170 170   border: 1px solid @line;
... ... @@ -173,6 +173,7 @@
173 173   transition: transform .18s ease, box-shadow .18s ease;
174 174   display: flex;
175 175   flex-direction: column;
187 + height: 100%;
176 176  
177 177   &:hover {
178 178   transform: translateY(-2px);