Changes for page Public Web Site

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

From version 10.39
edited by Agnease
on 2026/05/22 08:13
Change comment: There is no comment for this version
To version 12.17
edited by Agnease
on 2026/05/22 14:34
Change comment: There is no comment for this version

Summary

Details

Page properties
Content
... ... @@ -5,22 +5,13 @@
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 - <p class="hero-support">
20 - From LTS upgrades and maintenance to custom applications, integrations, workflows and migrations,
21 - Agnease provides focused XWiki expertise with practical delivery and long-term care.
22 - </p>
23 -
24 24   <ul class="benefits">
25 25   <li>Safe LTS upgrades</li>
26 26   <li>Support and recovery</li>
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 {
... ... @@ -194,9 +194,10 @@
194 194   }
195 195  
196 196   .lead {
197 - max-width: 760px;
200 + max-width: 820px;
198 198   font-size: 19px;
199 199   line-height: 1.55;
203 + margin-top: 12px;
200 200   }
201 201  
202 202   .benefits {
... ... @@ -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;
295 + margin-top: 22px;
300 300  }
301 301  
302 302  .resource-grid {
... ... @@ -329,12 +329,6 @@
329 329   border: 1px solid @line;
330 330   border-radius: @radius;
331 331   box-shadow: @shadow-sm;
332 - transition: transform .18s ease, box-shadow .18s ease;
333 -
334 - &:hover {
335 - transform: translateY(-2px);
336 - box-shadow: @shadow;
337 - }
338 338  }
339 339  
340 340  /* ========== Small Widgets ========== */
... ... @@ -450,13 +450,7 @@
450 450   border: 1px solid @line;
451 451   border-radius: @radius;
452 452   box-shadow: @shadow-sm;
453 - transition: transform .18s ease, box-shadow .18s ease;
454 454  
455 - &:hover {
456 - transform: translateY(-2px);
457 - box-shadow: @shadow;
458 - }
459 -
460 460   .service-icon {
461 461   width: 46px;
462 462   height: 46px;
... ... @@ -632,7 +632,7 @@
632 632  
633 633   .resource-grid {
634 634   max-width: 1040px;
635 - margin: 26px auto 0;
619 + margin: 22px auto 0;
636 636   display: grid;
637 637   grid-template-columns: repeat(2, minmax(0, 1fr));
638 638   grid-gap: 22px;
... ... @@ -698,7 +698,7 @@
698 698  /* ========== CTA ========== */
699 699  
700 700  .cta-section {
701 - padding: 32px 0 24px;
685 + padding: @section-padding;
702 702  
703 703   .contact-inline {
704 704   margin: 0;
... ... @@ -797,7 +797,7 @@
797 797  
798 798  @media (max-width: 640px) {
799 799   section {
800 - padding: 34px 0;
784 + padding: @section-padding-mobile;
801 801   }
802 802  
803 803   .widgets,
... ... @@ -822,14 +822,15 @@
822 822   padding: 24px 20px;
823 823   }
824 824  }
809 +
825 825  /* ========== Resource / Article Pages ========== */
826 826  
827 827  .resource-page {
828 - padding-top: 34px;
813 + padding-top: 0;
829 829  }
830 830  
831 831  .resource-header {
832 - padding: 40px 0 30px;
817 + padding: @section-padding;
833 833   border-top: none;
834 834   background:
835 835   radial-gradient(50rem 18rem at 50% -10%, @brand-soft 0%, transparent 60%),
... ... @@ -982,10 +982,11 @@
982 982   position: static;
983 983   }
984 984  }
970 +
985 985  /* ========== Products / Extensions Pages ========== */
986 986  
987 987  .product-index-section {
988 - padding: 52px 0 56px;
974 + padding: @section-padding;
989 989  
990 990   h2 {
991 991   margin-bottom: 10px;
... ... @@ -994,7 +994,7 @@
994 994  
995 995  .product-card-grid {
996 996   max-width: 840px;
997 - margin: 28px auto 0;
983 + margin: 22px auto 0;
998 998   display: grid;
999 999   grid-template-columns: 1fr;
1000 1000   grid-gap: 18px;
... ... @@ -1010,13 +1010,7 @@
1010 1010   grid-template-columns: 68px 1fr;
1011 1011   grid-gap: 22px;
1012 1012   align-items: start;
1013 - transition: transform .18s ease, box-shadow .18s ease;
1014 1014  
1015 - &:hover {
1016 - transform: translateY(-2px);
1017 - box-shadow: @shadow;
1018 - }
1019 -
1020 1020   .product-card-icon {
1021 1021   width: 58px;
1022 1022   height: 58px;
... ... @@ -1135,7 +1135,7 @@
1135 1135   grid-template-columns: repeat(3, minmax(0, 1fr));
1136 1136   grid-gap: 18px;
1137 1137   max-width: 1040px;
1138 - margin: 26px auto 0;
1118 + margin: 22px auto 0;
1139 1139  }
1140 1140  
1141 1141  .product-feature {
... ... @@ -1144,11 +1144,12 @@
1144 1144   border-radius: @radius;
1145 1145   box-shadow: @shadow-sm;
1146 1146   padding: 22px;
1147 - transition: transform .18s ease, box-shadow .18s ease;
1148 1148  
1149 - &:hover {
1150 - transform: translateY(-2px);
1151 - box-shadow: @shadow;
1128 + .feature-heading {
1129 + display: flex;
1130 + align-items: center;
1131 + gap: 14px;
1132 + margin-bottom: 14px;
1152 1152   }
1153 1153  
1154 1154   .feature-icon {
... ... @@ -1160,12 +1160,12 @@
1160 1160   display: flex;
1161 1161   align-items: center;
1162 1162   justify-content: center;
1163 - margin-bottom: 14px;
1164 1164   font-size: 18px;
1145 + flex-shrink: 0;
1165 1165   }
1166 1166  
1167 1167   h3 {
1168 - margin: 0 0 8px;
1149 + margin: 0;
1169 1169   color: @text;
1170 1170   font-size: 18px;
1171 1171   line-height: 1.25;
... ... @@ -1244,141 +1244,27 @@
1244 1244   padding: 20px;
1245 1245   }
1246 1246  }
1228 +
1247 1247  /* ========== Resources Index ========== */
1248 1248  
1249 1249  .resources-index-page {
1250 - padding: 56px 0 72px;
1251 - background: @brand-bg;
1252 -}
1253 -
1254 -.resources-intro {
1255 - max-width: 820px;
1256 - margin: 0 auto 32px;
1257 - text-align: center;
1258 -}
1259 -
1260 -.resources-intro p {
1261 - color: @muted;
1262 - font-size: 17px;
1263 - line-height: 1.7;
1264 - margin: 0;
1265 -}
1266 -
1267 -.resources-grid {
1268 - display: grid;
1269 - grid-template-columns: repeat(2, minmax(0, 1fr));
1270 - gap: 24px;
1271 - margin-bottom: 36px;
1272 -}
1273 -
1274 -.resource-card {
1275 - display: flex;
1276 - gap: 18px;
1277 1277   background: #fff;
1278 - border: 1px solid @line;
1279 - border-radius: @radius;
1280 - box-shadow: @shadow-sm;
1281 - padding: 24px;
1282 -}
1283 1283  
1284 -.resource-card-icon {
1285 - flex: 0 0 46px;
1286 - width: 46px;
1287 - height: 46px;
1288 - border-radius: 14px;
1289 - background: @brand-soft;
1290 - color: @brand-strong;
1291 - display: flex;
1292 - align-items: center;
1293 - justify-content: center;
1294 - font-size: 20px;
1234 + .services-grid {
1235 + grid-template-columns: repeat(2, minmax(0, 1fr));
1236 + }
1295 1295  }
1296 1296  
1297 -.resource-card-label {
1298 - color: @brand-strong;
1299 - font-size: 13px;
1300 - font-weight: 700;
1301 - text-transform: uppercase;
1302 - letter-spacing: .04em;
1303 - margin-bottom: 8px;
1239 +@media (max-width: 980px) {
1240 + .resources-index-page {
1241 + .services-grid {
1242 + grid-template-columns: 1fr;
1243 + }
1244 + }
1304 1304  }
1305 1305  
1306 -.resource-card h2 {
1307 - font-size: 22px;
1308 - line-height: 1.25;
1309 - margin: 0 0 12px;
1310 -}
1311 -
1312 -.resource-card h2 a {
1313 - color: @text;
1314 - text-decoration: none;
1315 -}
1316 -
1317 -.resource-card h2 a:hover {
1318 - color: @brand-strong;
1319 - text-decoration: none;
1320 -}
1321 -
1322 -.resource-card p {
1323 - color: @muted;
1324 - font-size: 15px;
1325 - line-height: 1.65;
1326 - margin: 0 0 16px;
1327 -}
1328 -
1329 -.resource-card-link {
1330 - color: @brand-strong;
1331 - font-weight: 700;
1332 - text-decoration: none;
1333 -}
1334 -
1335 -.resource-card-link:hover {
1336 - color: @brand;
1337 - text-decoration: none;
1338 -}
1339 -
1340 -.resources-next {
1341 - max-width: 820px;
1342 - margin: 0 auto 32px;
1343 - text-align: center;
1344 -}
1345 -
1346 -.resources-next h2 {
1347 - font-size: 26px;
1348 - margin: 0 0 10px;
1349 -}
1350 -
1351 -.resources-next p {
1352 - color: @muted;
1353 - font-size: 16px;
1354 - line-height: 1.7;
1355 - margin: 0;
1356 -}
1357 -
1358 1358  @media (max-width: 767px) {
1359 1359   .resources-index-page {
1360 - padding: 36px 0 52px;
1249 + padding: @section-padding-mobile;
1361 1361   }
1362 -
1363 - .resources-intro {
1364 - text-align: left;
1365 - margin-bottom: 24px;
1366 - }
1367 -
1368 - .resources-grid {
1369 - grid-template-columns: 1fr;
1370 - gap: 18px;
1371 - }
1372 -
1373 - .resource-card {
1374 - padding: 20px;
1375 - }
1376 -
1377 - .resource-card h2 {
1378 - font-size: 20px;
1379 - }
1380 -
1381 - .resources-next {
1382 - text-align: left;
1383 - }
1384 1384  }
XWiki.StyleSheetExtension[1]
code
... ... @@ -1,14 +1,8 @@
1 1  /* ========== Agnease Public Top Menu ========== */
2 -
3 -/* Desktop alignment */
4 -#menuview .navbar-nav {
5 - float: right !important;
6 -}
7 -
8 8  /* Top-level menu items */
9 9  
10 -.agnease-menu-item,
11 -.agnease-menu-link {
4 +#menuview .agnease-menu-item,
5 +#menuview .agnease-menu-link {
12 12   > a,
13 13   > .dropdown-toggle {
14 14   color: @brand;
... ... @@ -17,6 +17,7 @@
17 17   padding-left: 16px;
18 18   padding-right: 16px;
19 19   text-decoration: none;
14 + background: transparent;
20 20   }
21 21  
22 22   > a:hover,
... ... @@ -27,6 +27,7 @@
27 27   color: @brand-strong;
28 28   text-decoration: none;
29 29   outline: none;
25 + background: transparent;
30 30   }
31 31  
32 32   .caret {
... ... @@ -47,7 +47,7 @@
47 47  
48 48  /* Dropdown panel */
49 49  
50 -.agnease-dropdown {
46 +#menuview .agnease-dropdown {
51 51   min-width: 310px;
52 52   padding: 10px 8px;
53 53   border: 1px solid fade(@brand, 18%);
... ... @@ -66,6 +66,7 @@
66 66   font-weight: 600;
67 67   line-height: 1.3;
68 68   text-decoration: none;
65 + background: transparent;
69 69  
70 70   i {
71 71   width: 20px;
... ... @@ -81,6 +81,7 @@
81 81   color: @brand-strong;
82 82   text-decoration: none;
83 83   outline: none;
81 + background: transparent;
84 84  
85 85   i {
86 86   color: @brand-strong;
... ... @@ -90,6 +90,7 @@
90 90  
91 91   > .active > a {
92 92   color: @brand-strong;
91 + background: transparent;
93 93  
94 94   i {
95 95   color: @brand-strong;
... ... @@ -105,23 +105,33 @@
105 105  /* Mobile */
106 106  
107 107  @media (max-width: 767px) {
108 - .site-nav {
107 + #menuview {
109 109   margin-left: 0;
110 - justify-content: center;
111 - flex-wrap: wrap;
109 + width: 100%;
112 112   }
113 113  
114 - .agnease-menu-item,
115 - .agnease-menu-link {
116 - > a,
117 - > .dropdown-toggle {
118 - font-size: 16px;
119 - padding-top: 9px;
120 - padding-bottom: 9px;
121 - }
112 + #menuview .navbar-nav {
113 + float: none;
114 + margin: 0;
115 + width: 100%;
116 + text-align: center;
122 122   }
123 123  
124 - .agnease-dropdown {
119 + #menuview .navbar-nav > li {
120 + float: none;
121 + display: inline-block;
122 + }
123 +
124 + #menuview .navbar-nav > li.agnease-menu-item > a,
125 + #menuview .navbar-nav > li.agnease-menu-link > a,
126 + #menuview .navbar-nav > li.agnease-menu-item > .dropdown-toggle,
127 + #menuview .navbar-nav > li.agnease-menu-link > .dropdown-toggle {
128 + font-size: 16px;
129 + padding: 10px 10px;
130 + text-align: center;
131 + }
132 +
133 + #menuview .agnease-dropdown {
125 125   min-width: 0;
126 126   width: 100%;
127 127   padding: 4px 8px 8px 18px;
... ... @@ -129,6 +129,7 @@
129 129   border-radius: 0;
130 130   box-shadow: none;
131 131   background: transparent;
141 + text-align: left;
132 132  
133 133   > li > a {
134 134   padding: 8px 10px;