Changes for page Home
Last modified by Alex Cotiugă on 2026/01/13 13:12
From version 7.92
edited by Alex Cotiugă
on 2025/11/13 21:34
on 2025/11/13 21:34
Change comment:
There is no comment for this version
To version 7.94
edited by Alex Cotiugă
on 2025/11/13 21:49
on 2025/11/13 21:49
Change comment:
There is no comment for this version
Summary
-
Page properties (1 modified, 0 added, 0 removed)
-
Objects (1 modified, 0 added, 0 removed)
Details
- Page properties
-
- Content
-
... ... @@ -117,9 +117,16 @@ 117 117 All the XWiki services you need, delivered with precision and care 118 118 </p> 119 119 120 + #set ($servicesSize = $servicesSectionData.size()) 120 120 <div class="row services-grid" role="list"> 121 121 #foreach ($entry in $servicesSectionData) 122 - <div class="service col-sm-6" role="listitem"> 123 + #set ($classes = "service col-xs-12 col-sm-6") 124 + ## If this is the last item and the number of services is odd, 125 + ## center it on its own row on small+ screens 126 + #if ($foreach.count == $servicesSize && ($servicesSize % 2) == 1) 127 + #set ($classes = "$classes col-sm-offset-3") 128 + #end 129 + <div class="$classes" role="listitem"> 123 123 <div class="service-icon"> 124 124 <i class="fa fa-$entry.icon" aria-hidden="true"></i> 125 125 </div>
- XWiki.StyleSheetExtension[0]
-
- Code
-
... ... @@ -188,16 +188,15 @@ 188 188 } 189 189 } 190 190 191 - /* SERVICES */ 191 + /* SERVICES */ 192 192 .services { 193 193 .services-grid { 194 194 margin-top: 12px; 195 195 196 196 .service { 197 - /* Bootstrap grid (col-sm-6) handles width & wrapping */ 198 198 margin-bottom: 24px; 199 199 200 - /* Icon + textonarow*/199 + /* icon + text side by side */ 201 201 display: flex; 202 202 align-items: flex-start; 203 203 gap: 16px; ... ... @@ -242,11 +242,19 @@ 242 242 } 243 243 } 244 244 } 244 + } 245 245 246 - @media (max-width: 767px) { 246 + @media (max-width: 767px) { 247 + .services-grid { 247 247 .service { 248 248 margin-bottom: 20px; 249 249 } 251 + 252 + .service-icon { 253 + width: 36px; 254 + height: 36px; 255 + font-size: 16px; 256 + } 250 250 } 251 251 } 252 252 }