Changes for page Home
Last modified by Alex Cotiugă on 2026/01/13 13:12
From version 7.79
edited by Alex Cotiugă
on 2025/11/13 20:56
on 2025/11/13 20:56
Change comment:
There is no comment for this version
To version 7.87
edited by Alex Cotiugă
on 2025/11/13 21:16
on 2025/11/13 21:16
Change comment:
There is no comment for this version
Summary
-
Objects (1 modified, 0 added, 0 removed)
Details
- XWiki.StyleSheetExtension[0]
-
- Code
-
... ... @@ -124,26 +124,28 @@ 124 124 .widgets { 125 125 margin-top: 12px; 126 126 127 - /* Flex layout =equal-heightcolumns */127 + /* Flex layout for equal-height and spacing */ 128 128 display: flex; 129 129 flex-wrap: wrap; 130 + justify-content: space-between; 130 130 131 - /* Cancel Bootstrap's outer gutters so cards align with heading */ 132 - margin-left: -15px; 133 - margin-right: -15px; 134 - 135 135 .widget { 136 - /* Bootstrap grid classes (col-sm-6, col-md-3) still apply padding */ 133 + box-sizing: border-box; 134 + 135 + /* Desktop (md+) – 4 per row */ 136 + flex: 0 0 24%; 137 + max-width: 24%; 138 + margin-bottom: 16px; 139 + 140 + /* Card look */ 137 137 display: flex; 138 138 flex-direction: column; 139 139 height: 100%; 140 - 141 - /* Card design */ 144 + padding: 18px; 142 142 background: #fff; 143 143 border: 1px solid @line; 144 144 border-radius: @radius; 145 145 box-shadow: @shadow-sm; 146 - padding: 18px; 147 147 transition: transform .18s ease, box-shadow .18s ease; 148 148 149 149 &:hover { ... ... @@ -158,14 +158,8 @@ 158 158 padding-bottom: 6px; 159 159 margin-bottom: 8px; 160 160 border-bottom: 1px solid fade(@line, 60%); 161 - 162 - i { color: @brand; } 163 - 164 - h4 { 165 - margin: 0; 166 - line-height: 1.2; 167 - color: @text; 168 - } 163 + i { color: @brand; } 164 + h4 { margin: 0; line-height: 1.2; color: @text; } 169 169 } 170 170 171 171 p { ... ... @@ -175,14 +175,23 @@ 175 175 } 176 176 } 177 177 174 + /* Tablet (sm–md) – 2 per row */ 175 + @media (max-width: 991px) { 176 + .widget { 177 + flex: 0 0 48%; 178 + max-width: 48%; 179 + } 180 + } 181 + 182 + /* Mobile (xs) – 1 per row */ 178 178 @media (max-width: 767px) { 179 179 .widget { 180 - margin-bottom: 16px; /* spacing between stacked items */ 185 + flex: 0 0 100%; 186 + max-width: 100%; 181 181 } 182 182 } 183 183 } 184 184 185 - 186 186 /* SERVICES */ 187 187 .services { 188 188 h2 {