Changes for page Public Web Site

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

From version 11.4
edited by Agnease
on 2026/05/22 08:32
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
... ... @@ -34,7 +34,7 @@
34 34  }
35 35  
36 36  section {
37 - padding: 30px 0;
37 + padding: @section-padding;
38 38   border-top: 1px solid @line;
39 39  
40 40   &:first-of-type {
... ... @@ -178,7 +178,7 @@
178 178   display: flex;
179 179   align-items: center;
180 180   justify-content: center;
181 - min-height: 330px;
181 + min-height: 300px;
182 182   }
183 183  
184 184   .hero-inner {
... ... @@ -191,13 +191,15 @@
191 191  
192 192   h1 {
193 193   max-width: 790px;
194 - margin-left: auto;
195 - margin-right: auto;
194 + margin: 0 auto;
196 196   line-height: 1.18;
197 197   }
198 198  
199 199   .lead {
200 - max-width: 760px;
199 + max-width: 820px;
200 + margin: 12px auto 0;
201 + color: @muted;
202 + text-align: center;
201 201   font-size: 19px;
202 202   line-height: 1.55;
203 203   }
... ... @@ -233,13 +233,6 @@
233 233   font-weight: 700;
234 234  }
235 235  
236 -.hero-support {
237 - max-width: 760px;
238 - margin: 14px auto 0;
239 - color: @muted;
240 - line-height: 1.55;
241 -}
242 -
243 243  .hero-actions,
244 244  #hero-cta {
245 245   display: flex;
... ... @@ -254,7 +254,6 @@
254 254  .trust-strip {
255 255   padding: 18px 0;
256 256   border-top: 1px solid @line;
257 - border-bottom: 1px solid @line;
258 258   background: #fff;
259 259  
260 260   ul {
... ... @@ -299,7 +299,7 @@
299 299  .services-grid {
300 300   grid-template-columns: repeat(3, minmax(0, 1fr));
301 301   max-width: 1040px;
302 - margin-top: 26px;
296 + margin-top: 22px;
303 303  }
304 304  
305 305  .resource-grid {
... ... @@ -623,7 +623,7 @@
623 623  
624 624   .resource-grid {
625 625   max-width: 1040px;
626 - margin: 26px auto 0;
620 + margin: 22px auto 0;
627 627   display: grid;
628 628   grid-template-columns: repeat(2, minmax(0, 1fr));
629 629   grid-gap: 22px;
... ... @@ -689,7 +689,7 @@
689 689  /* ========== CTA ========== */
690 690  
691 691  .cta-section {
692 - padding: 32px 0 24px;
686 + padding: @section-padding;
693 693  
694 694   .contact-inline {
695 695   margin: 0;
... ... @@ -767,8 +767,9 @@
767 767   }
768 768   }
769 769  
764 + @media (max-width: 760px) {
770 770   .hero.hero-centered {
771 - min-height: 280px;
766 + min-height: 260px;
772 772   }
773 773  
774 774   .hero {
... ... @@ -788,7 +788,7 @@
788 788  
789 789  @media (max-width: 640px) {
790 790   section {
791 - padding: 34px 0;
786 + padding: @section-padding-mobile;
792 792   }
793 793  
794 794   .widgets,
... ... @@ -813,35 +813,13 @@
813 813   padding: 24px 20px;
814 814   }
815 815  }
811 +
816 816  /* ========== Resource / Article Pages ========== */
817 817  
818 818  .resource-page {
819 - padding-top: 34px;
815 + padding-top: 0;
820 820  }
821 821  
822 -.resource-header {
823 - padding: 40px 0 30px;
824 - border-top: none;
825 - background:
826 - radial-gradient(50rem 18rem at 50% -10%, @brand-soft 0%, transparent 60%),
827 - radial-gradient(50rem 18rem at 50% 0%, #E8F6F3 0%, transparent 60%);
828 -
829 - h1 {
830 - margin: 0 auto 14px;
831 - text-align: center;
832 - line-height: 1.18;
833 - }
834 -
835 - .resource-summary {
836 - max-width: 780px;
837 - margin: 0 auto;
838 - color: @muted;
839 - text-align: center;
840 - font-size: 18px;
841 - line-height: 1.55;
842 - }
843 -}
844 -
845 845  .resource-layout {
846 846   display: grid;
847 847   grid-template-columns: minmax(0, 760px) 280px;
... ... @@ -973,10 +973,11 @@
973 973   position: static;
974 974   }
975 975  }
949 +
976 976  /* ========== Products / Extensions Pages ========== */
977 977  
978 978  .product-index-section {
979 - padding: 52px 0 56px;
953 + padding: @section-padding;
980 980  
981 981   h2 {
982 982   margin-bottom: 10px;
... ... @@ -985,7 +985,7 @@
985 985  
986 986  .product-card-grid {
987 987   max-width: 840px;
988 - margin: 28px auto 0;
962 + margin: 22px auto 0;
989 989   display: grid;
990 990   grid-template-columns: 1fr;
991 991   grid-gap: 18px;
... ... @@ -1120,7 +1120,7 @@
1120 1120   grid-template-columns: repeat(3, minmax(0, 1fr));
1121 1121   grid-gap: 18px;
1122 1122   max-width: 1040px;
1123 - margin: 26px auto 0;
1097 + margin: 22px auto 0;
1124 1124  }
1125 1125  
1126 1126  .product-feature {
... ... @@ -1223,141 +1223,142 @@
1223 1223   padding: 20px;
1224 1224   }
1225 1225  }
1200 +
1226 1226  /* ========== Resources Index ========== */
1227 1227  
1228 1228  .resources-index-page {
1229 - padding: 56px 0 72px;
1204 + padding: @section-padding;
1230 1230   background: @brand-bg;
1231 -}
1232 1232  
1233 -.resources-intro {
1234 - max-width: 820px;
1235 - margin: 0 auto 32px;
1236 - text-align: center;
1237 -}
1207 + .resources-intro {
1208 + max-width: 820px;
1209 + margin: 0 auto 32px;
1210 + text-align: center;
1238 1238  
1239 -.resources-intro p {
1240 - color: @muted;
1241 - font-size: 17px;
1242 - line-height: 1.7;
1243 - margin: 0;
1244 -}
1212 + p {
1213 + color: @muted;
1214 + font-size: 17px;
1215 + line-height: 1.7;
1216 + margin: 0;
1217 + }
1218 + }
1245 1245  
1246 -.resources-grid {
1247 - display: grid;
1248 - grid-template-columns: repeat(2, minmax(0, 1fr));
1249 - gap: 24px;
1250 - margin-bottom: 36px;
1251 -}
1220 + .resources-grid {
1221 + display: grid;
1222 + grid-template-columns: repeat(2, minmax(0, 1fr));
1223 + gap: 24px;
1224 + margin-bottom: 36px;
1225 + }
1252 1252  
1253 -.resource-card {
1254 - display: flex;
1255 - gap: 18px;
1256 - background: #fff;
1257 - border: 1px solid @line;
1258 - border-radius: @radius;
1259 - box-shadow: @shadow-sm;
1260 - padding: 24px;
1261 -}
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 + }
1262 1262  
1263 -.resource-card-icon {
1264 - flex: 0 0 46px;
1265 - width: 46px;
1266 - height: 46px;
1267 - border-radius: 14px;
1268 - background: @brand-soft;
1269 - color: @brand-strong;
1270 - display: flex;
1271 - align-items: center;
1272 - justify-content: center;
1273 - font-size: 20px;
1274 -}
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 + }
1275 1275  
1276 -.resource-card-label {
1277 - color: @brand-strong;
1278 - font-size: 13px;
1279 - font-weight: 700;
1280 - text-transform: uppercase;
1281 - letter-spacing: .04em;
1282 - margin-bottom: 8px;
1283 -}
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 + }
1284 1284  
1285 -.resource-card h2 {
1286 - font-size: 22px;
1287 - line-height: 1.25;
1288 - margin: 0 0 12px;
1289 -}
1259 + .resource-card h2 {
1260 + font-size: 22px;
1261 + line-height: 1.25;
1262 + margin: 0 0 12px;
1263 + }
1290 1290  
1291 -.resource-card h2 a {
1292 - color: @text;
1293 - text-decoration: none;
1294 -}
1265 + .resource-card h2 a {
1266 + color: @text;
1267 + text-decoration: none;
1295 1295  
1296 -.resource-card h2 a:hover {
1297 - color: @brand-strong;
1298 - text-decoration: none;
1299 -}
1269 + &:hover {
1270 + color: @brand-strong;
1271 + text-decoration: none;
1272 + }
1273 + }
1300 1300  
1301 -.resource-card p {
1302 - color: @muted;
1303 - font-size: 15px;
1304 - line-height: 1.65;
1305 - margin: 0 0 16px;
1306 -}
1275 + .resource-card p {
1276 + color: @muted;
1277 + font-size: 15px;
1278 + line-height: 1.65;
1279 + margin: 0 0 16px;
1280 + }
1307 1307  
1308 -.resource-card-link {
1309 - color: @brand-strong;
1310 - font-weight: 700;
1311 - text-decoration: none;
1312 -}
1282 + .resource-card-link {
1283 + color: @brand-strong;
1284 + font-weight: 700;
1285 + text-decoration: none;
1313 1313  
1314 -.resource-card-link:hover {
1315 - color: @brand;
1316 - text-decoration: none;
1317 -}
1287 + &:hover {
1288 + color: @brand;
1289 + text-decoration: none;
1290 + }
1291 + }
1318 1318  
1319 -.resources-next {
1320 - max-width: 820px;
1321 - margin: 0 auto 32px;
1322 - text-align: center;
1323 -}
1293 + .resources-next {
1294 + max-width: 820px;
1295 + margin: 0 auto 32px;
1296 + text-align: center;
1324 1324  
1325 -.resources-next h2 {
1326 - font-size: 26px;
1327 - margin: 0 0 10px;
1328 -}
1298 + h2 {
1299 + font-size: 26px;
1300 + margin: 0 0 10px;
1301 + }
1329 1329  
1330 -.resources-next p {
1331 - color: @muted;
1332 - font-size: 16px;
1333 - line-height: 1.7;
1334 - margin: 0;
1303 + p {
1304 + color: @muted;
1305 + font-size: 16px;
1306 + line-height: 1.7;
1307 + margin: 0;
1308 + }
1309 + }
1335 1335  }
1336 1336  
1337 1337  @media (max-width: 767px) {
1338 1338   .resources-index-page {
1339 - padding: 36px 0 52px;
1340 - }
1314 + padding: @section-padding-mobile;
1341 1341  
1342 - .resources-intro {
1343 - text-align: left;
1344 - margin-bottom: 24px;
1345 - }
1316 + .resources-intro {
1317 + text-align: left;
1318 + margin-bottom: 24px;
1319 + }
1346 1346  
1347 - .resources-grid {
1348 - grid-template-columns: 1fr;
1349 - gap: 18px;
1350 - }
1321 + .resources-grid {
1322 + grid-template-columns: 1fr;
1323 + gap: 18px;
1324 + }
1351 1351  
1352 - .resource-card {
1353 - padding: 20px;
1354 - }
1326 + .resource-card {
1327 + padding: 20px;
1328 + }
1355 1355  
1356 - .resource-card h2 {
1357 - font-size: 20px;
1358 - }
1330 + .resource-card h2 {
1331 + font-size: 20px;
1332 + }
1359 1359  
1360 - .resources-next {
1361 - text-align: left;
1334 + .resources-next {
1335 + text-align: left;
1336 + }
1362 1362   }
1363 1363  }