Changes for page Home
Last modified by Alex Cotiugă on 2026/01/13 13:12
From version 7.63
edited by Alex Cotiugă
on 2025/11/13 13:00
on 2025/11/13 13:00
Change comment:
There is no comment for this version
To version 7.70
edited by Alex Cotiugă
on 2025/11/13 20:23
on 2025/11/13 20:23
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
-
... ... @@ -6,21 +6,28 @@ 6 6 <!-- ================= HERO ================= --> 7 7 <section class="hero hero-centered" aria-labelledby="hero-title"> 8 8 <div class="container"> 9 - <div class="hero-inner"> 10 - <h1 id="hero-title">Professional XWiki solutions, from setup to long-term stability</h1> 11 - <p class="lead">Need your XWiki upgraded, secured, or improved? Let’s make it happen</p> 12 - <div class="hero-cta"> 13 - <a class="btn btn-primary" href="#contact" aria-label="Schedule a call with Agnease">Request a consultation</a> 9 + <div class="row"> 10 + <div class="col-sm-12"> 11 + <div class="hero-inner"> 12 + <h1 id="hero-title">Professional XWiki solutions, from setup to long-term stability</h1> 13 + <p class="lead">Need your XWiki upgraded, secured, or improved? Let’s make it happen</p> 14 + <div class="hero-cta"> 15 + <a class="btn btn-primary" href="#contact" aria-label="Schedule a call with Agnease"> 16 + Request a consultation 17 + </a> 18 + </div> 19 + <ul class="benefits"> 20 + <li>Smooth upgrades</li> 21 + <li>Reliable support plans</li> 22 + <li>Custom integrations</li> 23 + <li>Secure, optimized platforms</li> 24 + </ul> 25 + </div> 14 14 </div> 15 - <ul class="benefits"> 16 - <li>Smooth upgrades</li> 17 - <li>Reliable support plans</li> 18 - <li>Custom integrations</li> 19 - <li>Secure, optimized platforms</li> 20 - </ul> 21 21 </div> 22 22 </div> 23 23 </section> 30 + 24 24 <!-- ========= WHY CHOOSE AGNEASE (widgets) ========= --> 25 25 #set ($whySectionData = [{ 26 26 'title': 'Stability & security',
- XWiki.StyleSheetExtension[0]
-
- Code
-
... ... @@ -179,10 +179,10 @@ 179 179 } 180 180 181 181 /* SERVICES */ 182 - .services { 182 + /* SERVICES */ 183 + .services { 183 183 h2 { 184 184 margin: 0 0 .3rem; 185 - /* rely on global heading sizing */ 186 186 } 187 187 188 188 .services-sub { ... ... @@ -190,11 +190,11 @@ 190 190 color: @muted; 191 191 } 192 192 193 - /* Grid: two columns,lastitemspansboth*/193 + /* Flex layout: 2 per row on desktop */ 194 194 .services-grid { 195 - display: grid;196 - grid-template-columns:repeat(2,1fr);197 - gap: 32px 36px; 195 + display: flex; 196 + flex-wrap: wrap; 197 + gap: 32px 36px; // row gap, column gap 198 198 } 199 199 200 200 .service { ... ... @@ -204,12 +204,15 @@ 204 204 padding: 18px 0; 205 205 border-top: 1px solid @line; 206 206 207 + /* two per row */ 208 + flex: 1 1 calc(50% - 18px); 209 + max-width: calc(50% - 18px); 210 + 207 207 /* first row: no top border */ 208 208 &:nth-of-type(-n + 2) { 209 209 border-top: none; 210 210 } 211 211 212 - /* icon badge */ 213 213 > i { 214 214 width: 42px; 215 215 height: 42px; ... ... @@ -224,7 +224,7 @@ 224 224 } 225 225 226 226 .body { 227 - h 3{230 + h4 { 228 228 margin: 0 0 4px; 229 229 font-size: 1.125rem; 230 230 font-weight: 800; ... ... @@ -248,33 +248,30 @@ 248 248 line-height: 1.45; 249 249 } 250 250 } 251 - 252 - /* last item (Migrations): centered single row */ 253 - &.service--center { 254 - grid-column: 1 / -1; 255 - max-width: 680px; 256 - justify-self: center; 257 - border-top: 1px solid @line; // always show a separator above it 258 - } 259 259 } 260 - /* If there is an odd number of services, center the last one on its own row */ 255 + 256 + /* If there is an odd number of services, center the last one */ 261 261 .services-grid > .service:last-child:nth-child(odd) { 262 - grid-column: 1/ -1;/*// span both columns*/258 + flex-basis: 100%; 263 263 max-width: 680px; 264 - justify-self: center; 260 + margin-left: auto; 261 + margin-right: auto; 265 265 } 266 266 267 - /* Responsive*/264 + /* Mobile: single column, full-width */ 268 268 @media (max-width: 760px) { 269 269 .services-grid { 270 - grid-template-columns: 1fr; 271 - row-gap: 20px; 267 + gap: 20px; 272 272 } 273 273 274 274 .service { 275 275 grid-template-columns: 40px 1fr; 272 + flex: 1 1 100%; 273 + max-width: 100%; 276 276 277 - /* on mobile only the first service has no top border */ 275 + /* reset border for all, then remove only on first */ 276 + border-top: 1px solid @line; 277 + 278 278 &:nth-of-type(1) { 279 279 border-top: none; 280 280 } ... ... @@ -284,10 +284,14 @@ 284 284 height: 36px; 285 285 font-size: 16px; 286 286 } 287 + } 287 287 288 - &.service--center { 289 - max-width: 100%; 290 - } 289 + /* On mobile, last item behaves like all others */ 290 + .services-grid > .service:last-child:nth-child(odd) { 291 + flex-basis: 100%; 292 + max-width: 100%; 293 + margin-left: 0; 294 + margin-right: 0; 291 291 } 292 292 } 293 293 }