Changes for page Public Web Site
Last modified by Agnease on 2026/05/30 16:24
Summary
-
Objects (2 modified, 0 added, 0 removed)
Details
- XWiki.StyleSheetExtension[0]
-
- code
-
... ... @@ -599,6 +599,32 @@ 599 599 } 600 600 } 601 601 602 +.resource-content { 603 + order: 1; 604 +} 605 + 606 +.resource-sidebar { 607 + order: 2; 608 +} 609 + 610 +@media (max-width: 767px) { 611 + .resource-layout { 612 + display: flex; 613 + flex-direction: column; 614 + } 615 + 616 + .resource-sidebar { 617 + order: 0; 618 + position: static; 619 + width: 100%; 620 + margin-bottom: 24px; 621 + } 622 + 623 + .resource-content { 624 + order: 1; 625 + } 626 +} 627 + 602 602 /* ========== CTA ========== */ 603 603 604 604 .cta-section { ... ... @@ -736,24 +736,10 @@ 736 736 padding: 40px 0 30px; 737 737 border-top: none; 738 738 background: 739 - radial-gradient(42rem 14rem at 50% 0%, @brand-bg 0%, transparent 70%); 765 + radial-gradient(50rem 18rem at 50% -10%, @brand-soft 0%, transparent 60%), 766 + radial-gradient(50rem 18rem at 50% 0%, #E8F6F3 0%, transparent 60%); 740 740 741 - .resource-kicker { 742 - display: inline-flex; 743 - align-items: center; 744 - gap: 8px; 745 - color: @brand; 746 - background: fade(@brand, 8%); 747 - border: 1px solid fade(@brand, 18%); 748 - border-radius: 999px; 749 - padding: 6px 12px; 750 - margin-bottom: 14px; 751 - font-size: 13px; 752 - font-weight: 700; 753 - } 754 - 755 755 h1 { 756 - max-width: 820px; 757 757 margin: 0 auto 14px; 758 758 text-align: center; 759 759 line-height: 1.18; ... ... @@ -902,58 +902,6 @@ 902 902 } 903 903 /* ========== Products / Extensions Pages ========== */ 904 904 905 -.product-index-hero { 906 - padding: 56px 0 48px; 907 - text-align: center; 908 - background: 909 - radial-gradient(50rem 18rem at 50% -10%, @brand-soft 0%, transparent 60%), 910 - radial-gradient(50rem 18rem at 50% 0%, #E8F6F3 0%, transparent 60%); 911 - border-top: none; 912 - border-bottom: 1px solid @line; 913 - 914 - h1 { 915 - max-width: 790px; 916 - margin: 0 auto; 917 - line-height: 1.18; 918 - } 919 - 920 - .page-lead { 921 - max-width: 760px; 922 - margin: 14px auto 0; 923 - color: @muted; 924 - text-align: center; 925 - font-size: 19px; 926 - line-height: 1.55; 927 - } 928 -} 929 - 930 -.product-page-kicker, 931 -.product-card-kicker { 932 - display: inline-flex; 933 - align-items: center; 934 - gap: 8px; 935 - color: @brand; 936 - background: fade(@brand, 8%); 937 - border: 1px solid fade(@brand, 18%); 938 - border-radius: 999px; 939 - padding: 6px 12px; 940 - margin-bottom: 14px; 941 - font-size: 13px; 942 - font-weight: 700; 943 - 944 - i { 945 - color: @brand; 946 - } 947 -} 948 - 949 -.product-card-kicker { 950 - margin-bottom: 10px; 951 - padding: 5px 10px; 952 - font-size: 12px; 953 - text-transform: uppercase; 954 - letter-spacing: .04em; 955 -} 956 - 957 957 .product-index-section { 958 958 padding: 52px 0 56px; 959 959 ... ... @@ -1023,6 +1023,14 @@ 1023 1023 } 1024 1024 } 1025 1025 986 +.product-card-kicker { 987 + margin-bottom: 10px; 988 + padding: 5px 10px; 989 + font-size: 12px; 990 + text-transform: uppercase; 991 + letter-spacing: .04em; 992 +} 993 + 1026 1026 .product-highlights { 1027 1027 margin: 14px 0 20px; 1028 1028 padding-left: 18px; ... ... @@ -1034,40 +1034,8 @@ 1034 1034 } 1035 1035 } 1036 1036 1037 -.product-cta-section { 1038 - padding: 0 0 56px; 1039 - border-top: 1px solid @line; 1040 -} 1041 - 1042 -.product-cta-panel { 1043 - max-width: 860px; 1044 - margin: 0 auto; 1045 - padding: 32px; 1046 - border-radius: @radius; 1047 - border: 1px solid fade(@brand, 20%); 1048 - background: 1049 - radial-gradient(34rem 12rem at 50% 0%, @brand-soft 0%, #fff 70%); 1050 - box-shadow: @shadow-sm; 1051 - text-align: center; 1052 - 1053 - h2 { 1054 - margin-top: 0; 1055 - } 1056 - 1057 - p { 1058 - max-width: 680px; 1059 - margin: 0 auto 18px; 1060 - color: @muted; 1061 - line-height: 1.55; 1062 - } 1063 -} 1064 - 1065 1065 /* ========== Individual Product Pages ========== */ 1066 1066 1067 -.product-hero { 1068 - min-height: 330px; 1069 -} 1070 - 1071 1071 .product-layout { 1072 1072 display: grid; 1073 1073 grid-template-columns: 1.1fr .9fr; ... ... @@ -1209,19 +1209,6 @@ 1209 1209 radial-gradient(42rem 16rem at 50% 0%, @brand-bg 0%, transparent 65%); 1210 1210 } 1211 1211 1212 -.product-use-cases { 1213 - ul { 1214 - margin: 0; 1215 - padding-left: 20px; 1216 - color: @muted; 1217 - } 1218 - 1219 - li { 1220 - margin: 8px 0; 1221 - line-height: 1.5; 1222 - } 1223 -} 1224 - 1225 1225 @media (max-width: 980px) { 1226 1226 .product-layout, 1227 1227 .product-feature-grid { ... ... @@ -1234,14 +1234,6 @@ 1234 1234 } 1235 1235 1236 1236 @media (max-width: 640px) { 1237 - .product-index-hero { 1238 - padding: 38px 0 34px; 1239 - 1240 - .page-lead { 1241 - font-size: 17px; 1242 - } 1243 - } 1244 - 1245 1245 .product-card { 1246 1246 grid-template-columns: 1fr; 1247 1247 padding: 22px; ... ... @@ -1258,8 +1258,142 @@ 1258 1258 .product-gallery-panel { 1259 1259 padding: 20px; 1260 1260 } 1176 +} 1177 +/* ========== Resources Index ========== */ 1261 1261 1262 - .product-cta-panel { 1263 - padding: 24px 20px; 1179 +.resources-index-page { 1180 + padding: 56px 0 72px; 1181 + background: @brand-bg; 1182 +} 1183 + 1184 +.resources-intro { 1185 + max-width: 820px; 1186 + margin: 0 auto 32px; 1187 + text-align: center; 1188 +} 1189 + 1190 +.resources-intro p { 1191 + color: @muted; 1192 + font-size: 17px; 1193 + line-height: 1.7; 1194 + margin: 0; 1195 +} 1196 + 1197 +.resources-grid { 1198 + display: grid; 1199 + grid-template-columns: repeat(2, minmax(0, 1fr)); 1200 + gap: 24px; 1201 + margin-bottom: 36px; 1202 +} 1203 + 1204 +.resource-card { 1205 + display: flex; 1206 + gap: 18px; 1207 + background: #fff; 1208 + border: 1px solid @line; 1209 + border-radius: @radius; 1210 + box-shadow: @shadow-sm; 1211 + padding: 24px; 1212 +} 1213 + 1214 +.resource-card-icon { 1215 + flex: 0 0 46px; 1216 + width: 46px; 1217 + height: 46px; 1218 + border-radius: 14px; 1219 + background: @brand-soft; 1220 + color: @brand-strong; 1221 + display: flex; 1222 + align-items: center; 1223 + justify-content: center; 1224 + font-size: 20px; 1225 +} 1226 + 1227 +.resource-card-label { 1228 + color: @brand-strong; 1229 + font-size: 13px; 1230 + font-weight: 700; 1231 + text-transform: uppercase; 1232 + letter-spacing: .04em; 1233 + margin-bottom: 8px; 1234 +} 1235 + 1236 +.resource-card h2 { 1237 + font-size: 22px; 1238 + line-height: 1.25; 1239 + margin: 0 0 12px; 1240 +} 1241 + 1242 +.resource-card h2 a { 1243 + color: @text; 1244 + text-decoration: none; 1245 +} 1246 + 1247 +.resource-card h2 a:hover { 1248 + color: @brand-strong; 1249 + text-decoration: none; 1250 +} 1251 + 1252 +.resource-card p { 1253 + color: @muted; 1254 + font-size: 15px; 1255 + line-height: 1.65; 1256 + margin: 0 0 16px; 1257 +} 1258 + 1259 +.resource-card-link { 1260 + color: @brand-strong; 1261 + font-weight: 700; 1262 + text-decoration: none; 1263 +} 1264 + 1265 +.resource-card-link:hover { 1266 + color: @brand; 1267 + text-decoration: none; 1268 +} 1269 + 1270 +.resources-next { 1271 + max-width: 820px; 1272 + margin: 0 auto 32px; 1273 + text-align: center; 1274 +} 1275 + 1276 +.resources-next h2 { 1277 + font-size: 26px; 1278 + margin: 0 0 10px; 1279 +} 1280 + 1281 +.resources-next p { 1282 + color: @muted; 1283 + font-size: 16px; 1284 + line-height: 1.7; 1285 + margin: 0; 1286 +} 1287 + 1288 +@media (max-width: 767px) { 1289 + .resources-index-page { 1290 + padding: 36px 0 52px; 1264 1264 } 1292 + 1293 + .resources-intro { 1294 + text-align: left; 1295 + margin-bottom: 24px; 1296 + } 1297 + 1298 + .resources-grid { 1299 + grid-template-columns: 1fr; 1300 + gap: 18px; 1301 + } 1302 + 1303 + .resource-card { 1304 + padding: 20px; 1305 + } 1306 + 1307 + .resource-card h2 { 1308 + font-size: 20px; 1309 + } 1310 + 1311 + .resources-next { 1312 + text-align: left; 1313 + } 1265 1265 }
- XWiki.StyleSheetExtension[1]
-
- code
-
... ... @@ -53,6 +53,7 @@ 53 53 /* Dropdown panels */ 54 54 55 55 .agnease-services-dropdown, 56 +.agnease-resources-dropdown, 56 56 .agnease-products-dropdown { 57 57 min-width: 360px; 58 58 padding: 10px;