Changes for page Public Web Site

Last modified by Agnease on 2026/05/30 16:24

From version 11.2
edited by Agnease
on 2026/05/22 08:21
Change comment: There is no comment for this version
To version 11.22
edited by Agnease
on 2026/05/22 10:12
Change comment: There is no comment for this version

Summary

Details

Page properties
Content
... ... @@ -5,15 +5,11 @@
5 5  
6 6   <section class="hero hero-centered" aria-labelledby="hero-title">
7 7   <div class="container hero-inner">
8 - <div class="hero-kicker">
9 - <i class="fa fa-shield" aria-hidden="true"></i>
10 - Your trusted partner for professional XWiki services
11 - </div>
8 + <h1 id="hero-title">Professional XWiki engineering and support</h1>
12 12  
13 - <h1 id="hero-title">Reliable XWiki engineering for organizations that depend on their knowledge platform</h1>
14 -
15 15   <p class="lead">
16 - Agnease helps companies keep XWiki secure, stable, up-to-date and adapted to real business processes.
11 + Agnease helps organizations upgrade, maintain, secure and extend XWiki so production platforms stay stable,
12 + up-to-date and adapted to real business processes.
17 17   </p>
18 18  
19 19   <ul class="benefits">
XWiki.StyleSheetExtension[0]
code
... ... @@ -12,6 +12,9 @@
12 12  @shadow: 0 12px 36px rgba(0, 0, 0, .08);
13 13  @maxw: 1140px;
14 14  
15 +@section-padding: 30px 0;
16 +@section-padding-mobile: 28px 0;
17 +
15 15  /* ========== Base ========== */
16 16  
17 17  #mainContentArea {
... ... @@ -31,7 +31,7 @@
31 31  }
32 32  
33 33  section {
34 - padding: 42px 0;
37 + padding: @section-padding;
35 35   border-top: 1px solid @line;
36 36  
37 37   &:first-of-type {
... ... @@ -175,7 +175,7 @@
175 175   display: flex;
176 176   align-items: center;
177 177   justify-content: center;
178 - min-height: 330px;
181 + min-height: 300px;
179 179   }
180 180  
181 181   .hero-inner {
... ... @@ -188,13 +188,15 @@
188 188  
189 189   h1 {
190 190   max-width: 790px;
191 - margin-left: auto;
192 - margin-right: auto;
194 + margin: 0 auto;
193 193   line-height: 1.18;
194 194   }
195 195  
196 196   .lead {
197 - max-width: 760px;
199 + max-width: 820px;
200 + margin: 12px auto 0;
201 + color: @muted;
202 + text-align: center;
198 198   font-size: 19px;
199 199   line-height: 1.55;
200 200   }
... ... @@ -230,13 +230,6 @@
230 230   font-weight: 700;
231 231  }
232 232  
233 -.hero-support {
234 - max-width: 760px;
235 - margin: 14px auto 0;
236 - color: @muted;
237 - line-height: 1.55;
238 -}
239 -
240 240  .hero-actions,
241 241  #hero-cta {
242 242   display: flex;
... ... @@ -251,7 +251,6 @@
251 251  .trust-strip {
252 252   padding: 18px 0;
253 253   border-top: 1px solid @line;
254 - border-bottom: 1px solid @line;
255 255   background: #fff;
256 256  
257 257   ul {
... ... @@ -296,7 +296,7 @@
296 296  .services-grid {
297 297   grid-template-columns: repeat(3, minmax(0, 1fr));
298 298   max-width: 1040px;
299 - margin-top: 26px;
296 + margin-top: 22px;
300 300  }
301 301  
302 302  .resource-grid {
... ... @@ -620,7 +620,7 @@
620 620  
621 621   .resource-grid {
622 622   max-width: 1040px;
623 - margin: 26px auto 0;
620 + margin: 22px auto 0;
624 624   display: grid;
625 625   grid-template-columns: repeat(2, minmax(0, 1fr));
626 626   grid-gap: 22px;
... ... @@ -686,7 +686,7 @@
686 686  /* ========== CTA ========== */
687 687  
688 688  .cta-section {
689 - padding: 32px 0 24px;
686 + padding: @section-padding;
690 690  
691 691   .contact-inline {
692 692   margin: 0;
... ... @@ -764,8 +764,9 @@
764 764   }
765 765   }
766 766  
764 + @media (max-width: 760px) {
767 767   .hero.hero-centered {
768 - min-height: 280px;
766 + min-height: 260px;
769 769   }
770 770  
771 771   .hero {
... ... @@ -785,7 +785,7 @@
785 785  
786 786  @media (max-width: 640px) {
787 787   section {
788 - padding: 34px 0;
786 + padding: @section-padding-mobile;
789 789   }
790 790  
791 791   .widgets,
... ... @@ -810,35 +810,13 @@
810 810   padding: 24px 20px;
811 811   }
812 812  }
811 +
813 813  /* ========== Resource / Article Pages ========== */
814 814  
815 815  .resource-page {
816 - padding-top: 34px;
815 + padding-top: 0;
817 817  }
818 818  
819 -.resource-header {
820 - padding: 40px 0 30px;
821 - border-top: none;
822 - background:
823 - radial-gradient(50rem 18rem at 50% -10%, @brand-soft 0%, transparent 60%),
824 - radial-gradient(50rem 18rem at 50% 0%, #E8F6F3 0%, transparent 60%);
825 -
826 - h1 {
827 - margin: 0 auto 14px;
828 - text-align: center;
829 - line-height: 1.18;
830 - }
831 -
832 - .resource-summary {
833 - max-width: 780px;
834 - margin: 0 auto;
835 - color: @muted;
836 - text-align: center;
837 - font-size: 18px;
838 - line-height: 1.55;
839 - }
840 -}
841 -
842 842  .resource-layout {
843 843   display: grid;
844 844   grid-template-columns: minmax(0, 760px) 280px;
... ... @@ -970,10 +970,11 @@
970 970   position: static;
971 971   }
972 972  }
949 +
973 973  /* ========== Products / Extensions Pages ========== */
974 974  
975 975  .product-index-section {
976 - padding: 52px 0 56px;
953 + padding: @section-padding;
977 977  
978 978   h2 {
979 979   margin-bottom: 10px;
... ... @@ -982,7 +982,7 @@
982 982  
983 983  .product-card-grid {
984 984   max-width: 840px;
985 - margin: 28px auto 0;
962 + margin: 22px auto 0;
986 986   display: grid;
987 987   grid-template-columns: 1fr;
988 988   grid-gap: 18px;
... ... @@ -1117,7 +1117,7 @@
1117 1117   grid-template-columns: repeat(3, minmax(0, 1fr));
1118 1118   grid-gap: 18px;
1119 1119   max-width: 1040px;
1120 - margin: 26px auto 0;
1097 + margin: 22px auto 0;
1121 1121  }
1122 1122  
1123 1123  .product-feature {
... ... @@ -1220,141 +1220,142 @@
1220 1220   padding: 20px;
1221 1221   }
1222 1222  }
1200 +
1223 1223  /* ========== Resources Index ========== */
1224 1224  
1225 1225  .resources-index-page {
1226 - padding: 56px 0 72px;
1204 + padding: @section-padding;
1227 1227   background: @brand-bg;
1228 -}
1229 1229  
1230 -.resources-intro {
1231 - max-width: 820px;
1232 - margin: 0 auto 32px;
1233 - text-align: center;
1234 -}
1207 + .resources-intro {
1208 + max-width: 820px;
1209 + margin: 0 auto 32px;
1210 + text-align: center;
1235 1235  
1236 -.resources-intro p {
1237 - color: @muted;
1238 - font-size: 17px;
1239 - line-height: 1.7;
1240 - margin: 0;
1241 -}
1212 + p {
1213 + color: @muted;
1214 + font-size: 17px;
1215 + line-height: 1.7;
1216 + margin: 0;
1217 + }
1218 + }
1242 1242  
1243 -.resources-grid {
1244 - display: grid;
1245 - grid-template-columns: repeat(2, minmax(0, 1fr));
1246 - gap: 24px;
1247 - margin-bottom: 36px;
1248 -}
1220 + .resources-grid {
1221 + display: grid;
1222 + grid-template-columns: repeat(2, minmax(0, 1fr));
1223 + gap: 24px;
1224 + margin-bottom: 36px;
1225 + }
1249 1249  
1250 -.resource-card {
1251 - display: flex;
1252 - gap: 18px;
1253 - background: #fff;
1254 - border: 1px solid @line;
1255 - border-radius: @radius;
1256 - box-shadow: @shadow-sm;
1257 - padding: 24px;
1258 -}
1227 + .resource-card {
1228 + display: flex;
1229 + gap: 18px;
1230 + background: #fff;
1231 + border: 1px solid @line;
1232 + border-radius: @radius;
1233 + box-shadow: @shadow-sm;
1234 + padding: 24px;
1235 + }
1259 1259  
1260 -.resource-card-icon {
1261 - flex: 0 0 46px;
1262 - width: 46px;
1263 - height: 46px;
1264 - border-radius: 14px;
1265 - background: @brand-soft;
1266 - color: @brand-strong;
1267 - display: flex;
1268 - align-items: center;
1269 - justify-content: center;
1270 - font-size: 20px;
1271 -}
1237 + .resource-card-icon {
1238 + flex: 0 0 46px;
1239 + width: 46px;
1240 + height: 46px;
1241 + border-radius: 14px;
1242 + background: @brand-soft;
1243 + color: @brand-strong;
1244 + display: flex;
1245 + align-items: center;
1246 + justify-content: center;
1247 + font-size: 20px;
1248 + }
1272 1272  
1273 -.resource-card-label {
1274 - color: @brand-strong;
1275 - font-size: 13px;
1276 - font-weight: 700;
1277 - text-transform: uppercase;
1278 - letter-spacing: .04em;
1279 - margin-bottom: 8px;
1280 -}
1250 + .resource-card-label {
1251 + color: @brand-strong;
1252 + font-size: 13px;
1253 + font-weight: 700;
1254 + text-transform: uppercase;
1255 + letter-spacing: .04em;
1256 + margin-bottom: 8px;
1257 + }
1281 1281  
1282 -.resource-card h2 {
1283 - font-size: 22px;
1284 - line-height: 1.25;
1285 - margin: 0 0 12px;
1286 -}
1259 + .resource-card h2 {
1260 + font-size: 22px;
1261 + line-height: 1.25;
1262 + margin: 0 0 12px;
1263 + }
1287 1287  
1288 -.resource-card h2 a {
1289 - color: @text;
1290 - text-decoration: none;
1291 -}
1265 + .resource-card h2 a {
1266 + color: @text;
1267 + text-decoration: none;
1292 1292  
1293 -.resource-card h2 a:hover {
1294 - color: @brand-strong;
1295 - text-decoration: none;
1296 -}
1269 + &:hover {
1270 + color: @brand-strong;
1271 + text-decoration: none;
1272 + }
1273 + }
1297 1297  
1298 -.resource-card p {
1299 - color: @muted;
1300 - font-size: 15px;
1301 - line-height: 1.65;
1302 - margin: 0 0 16px;
1303 -}
1275 + .resource-card p {
1276 + color: @muted;
1277 + font-size: 15px;
1278 + line-height: 1.65;
1279 + margin: 0 0 16px;
1280 + }
1304 1304  
1305 -.resource-card-link {
1306 - color: @brand-strong;
1307 - font-weight: 700;
1308 - text-decoration: none;
1309 -}
1282 + .resource-card-link {
1283 + color: @brand-strong;
1284 + font-weight: 700;
1285 + text-decoration: none;
1310 1310  
1311 -.resource-card-link:hover {
1312 - color: @brand;
1313 - text-decoration: none;
1314 -}
1287 + &:hover {
1288 + color: @brand;
1289 + text-decoration: none;
1290 + }
1291 + }
1315 1315  
1316 -.resources-next {
1317 - max-width: 820px;
1318 - margin: 0 auto 32px;
1319 - text-align: center;
1320 -}
1293 + .resources-next {
1294 + max-width: 820px;
1295 + margin: 0 auto 32px;
1296 + text-align: center;
1321 1321  
1322 -.resources-next h2 {
1323 - font-size: 26px;
1324 - margin: 0 0 10px;
1325 -}
1298 + h2 {
1299 + font-size: 26px;
1300 + margin: 0 0 10px;
1301 + }
1326 1326  
1327 -.resources-next p {
1328 - color: @muted;
1329 - font-size: 16px;
1330 - line-height: 1.7;
1331 - margin: 0;
1303 + p {
1304 + color: @muted;
1305 + font-size: 16px;
1306 + line-height: 1.7;
1307 + margin: 0;
1308 + }
1309 + }
1332 1332  }
1333 1333  
1334 1334  @media (max-width: 767px) {
1335 1335   .resources-index-page {
1336 - padding: 36px 0 52px;
1337 - }
1314 + padding: @section-padding-mobile;
1338 1338  
1339 - .resources-intro {
1340 - text-align: left;
1341 - margin-bottom: 24px;
1342 - }
1316 + .resources-intro {
1317 + text-align: left;
1318 + margin-bottom: 24px;
1319 + }
1343 1343  
1344 - .resources-grid {
1345 - grid-template-columns: 1fr;
1346 - gap: 18px;
1347 - }
1321 + .resources-grid {
1322 + grid-template-columns: 1fr;
1323 + gap: 18px;
1324 + }
1348 1348  
1349 - .resource-card {
1350 - padding: 20px;
1351 - }
1326 + .resource-card {
1327 + padding: 20px;
1328 + }
1352 1352  
1353 - .resource-card h2 {
1354 - font-size: 20px;
1355 - }
1330 + .resource-card h2 {
1331 + font-size: 20px;
1332 + }
1356 1356  
1357 - .resources-next {
1358 - text-align: left;
1334 + .resources-next {
1335 + text-align: left;
1336 + }
1359 1359   }
1360 1360  }