Changes for page Home
Last modified by Alex Cotiugă on 2026/01/13 13:12
From version 7.42
edited by Alex Cotiugă
on 2025/11/13 12:09
on 2025/11/13 12:09
Change comment:
There is no comment for this version
To version 7.45
edited by Alex Cotiugă
on 2025/11/13 12:14
on 2025/11/13 12:14
Change comment:
There is no comment for this version
Summary
-
Objects (1 modified, 0 added, 0 removed)
Details
- XWiki.StyleSheetExtension[0]
-
- Code
-
... ... @@ -179,85 +179,65 @@ 179 179 } 180 180 181 181 /* SERVICES */ 182 - /* --- GridLayout--- */183 - .services-grid {184 - display: grid;185 - grid-template-columns: repeat(2, 1fr);186 - gap: 32px 36px;187 - }182 + /* --- Services grid --- */ 183 +.services-grid { 184 + display: grid; 185 + grid-template-columns: repeat(2, 1fr); 186 + gap: 32px 36px; 187 +} 188 188 189 - /* Center the first service (Migrations) */ 190 - .service--center { 191 - grid-column: 1 / -1; 192 - max-width: 640px; 193 - justify-self: center; 194 - } 189 +/* Service item */ 190 +.services-grid > article.service { 191 + display: grid; 192 + grid-template-columns: 48px 1fr; 193 + gap: 16px; 194 + padding: 18px 0; 195 + border-top: 1px solid rgba(0,0,0,0.08); 196 +} 195 195 196 - /* --- Service Card --- */ 197 - .service { 198 - display: grid; 199 - grid-template-columns: 48px 1fr; 200 - gap: 16px; 201 - padding: 18px 0; 202 - border-top: 1px solid rgba(0,0,0,0.08); 203 - } 204 - .service:nth-child(2), 205 - .service:nth-child(3) { 206 - border-top: none; /* remove top border for first row after Migrations */ 207 - } 198 +/* First row only: remove top border. 199 + Use nth-of-type to avoid XWiki DOM noise changing indexes. */ 200 +.services-grid > article.service:nth-of-type(-n + 2) { 201 + border-top: none; 202 +} 208 208 209 - .service > i { 210 - width: 42px; 211 - height: 42px; 212 - border-radius: 50%; 213 - display: flex; 214 - align-items: center; 215 - justify-content: center; 216 - font-size: 18px; 217 - color: #008e78; 218 - background: rgba(0,142,120,0.08); 219 - margin-top: 3px; 220 - } 204 +/* Icon badge */ 205 +.services-grid > article.service > i { 206 + width: 42px; 207 + height: 42px; 208 + border-radius: 50%; 209 + display: flex; 210 + align-items: center; 211 + justify-content: center; 212 + font-size: 18px; 213 + color: #008e78; 214 + background: rgba(0,142,120,0.08); 215 + margin-top: 3px; 216 +} 221 221 222 - /*.service .body h3 { 223 - margin: 0 0 4px; 224 - font-size: 1.125rem; 225 - font-weight: 800; 226 - } 227 - .service .body p { 228 - margin: 0 0 6px; 229 - color: #25333b; 230 - line-height: 1.5; 231 - } */ 232 - .service .body ul { 233 - margin: .4rem 0 0; 234 - padding-left: 1.1rem; 235 - color: #2d3b43; 236 - } 237 - .service .body li { 238 - margin: .25rem 0; 239 - line-height: 1.45; 240 - } 218 +/* Text */ 219 +.services-grid .body h3 { margin: 0 0 4px; font-size: 1.125rem; font-weight: 800; } 220 +.services-grid .body p { margin: 0 0 6px; color: #25333b; line-height: 1.5; } 221 +.services-grid .body ul { margin: .45rem 0 0; padding-left: 1.1rem; color: #2d3b43; } 222 +.services-grid .body li { margin: .25rem 0; line-height: 1.45; } 241 241 242 - /* --- Responsive --- */ 243 - @media (max-width: 760px) { 244 - .services-grid { 245 - grid-template-columns: 1fr; 246 - gap: 20px; 247 - } 248 - .service { 249 - grid-template-columns: 40px 1fr; 250 - } 251 - .service > i { 252 - width: 36px; 253 - height: 36px; 254 - font-size: 16px; 255 - } 256 - .service--center { 257 - max-width: 100%; 258 - } 259 - } 224 +/* Last item (Migrations): centered single row */ 225 +.services-grid > article.service.service--center { 226 + grid-column: 1 / -1; 227 + max-width: 680px; 228 + justify-self: center; 229 + border-top: 1px solid rgba(0,0,0,0.08); 230 +} 260 260 232 +/* Responsive */ 233 +@media (max-width: 760px) { 234 + .services-grid { grid-template-columns: 1fr; gap: 20px; } 235 + .services-grid > article.service { grid-template-columns: 40px 1fr; } 236 + .services-grid > article.service > i { width: 36px; height: 36px; font-size: 16px; } 237 + .services-grid > article.service.service--center { max-width: 100%; } 238 + /* On mobile only the very first service should have no top border */ 239 + .services-grid > article.service:nth-of-type(1) { border-top: none; } 240 +} 261 261 /* METRICS */ 262 262 .metrics { 263 263 display: grid; gap: 14px; grid-template-columns: repeat(2, 1fr);