Changes for page Public Web Site
Last modified by Agnease on 2026/07/07 14:40
Summary
-
Objects (1 modified, 0 added, 0 removed)
Details
- XWiki.StyleSheetExtension[0]
-
- code
-
... ... @@ -631,6 +631,49 @@ 631 631 margin-bottom: 0; 632 632 } 633 633 } 634 + 635 + h3, 636 + h4 { 637 + position: relative; 638 + z-index: 1; 639 + margin: 0 0 16px; 640 + color: #fff; 641 + font-size: 24px; 642 + line-height: 1.2; 643 + font-weight: 800; 644 + } 645 + 646 + h2 i, 647 + h3 i, 648 + h4 i { 649 + margin-right: 8px; 650 + color: @brand; 651 + } 652 + 653 + ul { 654 + position: relative; 655 + z-index: 1; 656 + margin: 18px 0 0; 657 + padding: 0; 658 + list-style: none; 659 + } 660 + 661 + li { 662 + position: relative; 663 + margin: 10px 0; 664 + padding-left: 28px; 665 + color: #DBE4EF; 666 + line-height: 1.5; 667 + 668 + &::before { 669 + content: "\f00c"; 670 + font-family: FontAwesome; 671 + position: absolute; 672 + left: 0; 673 + top: 1px; 674 + color: @brand; 675 + } 676 + } 634 634 } 635 635 636 636 .process-list { ... ... @@ -683,6 +683,34 @@ 683 683 } 684 684 } 685 685 729 +/* ===== Contact page side panel ===== */ 730 + 731 +.contact-side-panel { 732 + padding-top: 10px; 733 +} 734 + 735 +.contact-help-panel { 736 + margin-bottom: 18px; 737 + padding: 30px 28px; 738 +} 739 + 740 +.contact-help-panel h2 { 741 + font-size: 24px; 742 +} 743 + 744 +.contact-process-list li { 745 + min-height: auto; 746 +} 747 + 748 +/* CSS for hidden field to identify requests filled by bots. */ 749 +.contact-hp-wrapper { 750 + position: absolute; 751 + left: -9999px; 752 + width: 1px; 753 + height: 1px; 754 + overflow: hidden; 755 +} 756 + 686 686 /* ========== Resources ========== */ 687 687 688 688 .resource-strip { ... ... @@ -785,7 +785,7 @@ 785 785 /* ========== CTA ========== */ 786 786 787 787 .cta-section { 788 - padding:44px 0 56px;859 + border: none; 789 789 790 790 .contact-inline { 791 791 margin: 0; ... ... @@ -875,8 +875,12 @@ 875 875 grid-template-columns: 1fr; 876 876 } 877 877 878 - .split-copy h2 { 879 - text-align: center; 949 + .split-copy { 950 + padding: 34px 28px; 951 + 952 + h2 { 953 + text-align: center; 954 + } 880 880 } 881 881 } 882 882 ... ... @@ -944,6 +944,22 @@ 944 944 padding: 20px; 945 945 } 946 946 1022 + .split-copy { 1023 + padding: 30px 22px; 1024 + border-radius: 20px; 1025 + } 1026 + 1027 + .process-list li { 1028 + padding: 22px 20px 22px 68px; 1029 + 1030 + &:before { 1031 + left: 20px; 1032 + top: 22px; 1033 + width: 32px; 1034 + height: 32px; 1035 + } 1036 + } 1037 + 947 947 .services .service { 948 948 gap: 14px; 949 949 } ... ... @@ -1138,48 +1138,70 @@ 1138 1138 } 1139 1139 } 1140 1140 1141 -.resource-cta { 1142 - display: flex; 1143 - flex-direction: column; 1232 +.resource-inline-cta { 1233 + position: relative; 1234 + display: grid; 1235 + grid-template-columns: minmax(0, 1fr) auto; 1144 1144 align-items: center; 1145 - text-align: center; 1146 - 1147 - max-width: 820px; 1148 - margin: 42px auto 0; 1149 - padding: 28px 30px; 1237 + gap: 22px; 1238 + margin: 32px 0; 1239 + padding: 22px 24px 22px 28px; 1150 1150 border: 1px solid fade(@brand, 20%); 1151 1151 border-radius: @radius; 1152 - background: @brand-bg; 1242 + background: #fff; 1243 + box-shadow: @shadow-sm; 1244 + overflow: hidden; 1153 1153 1154 - h3 { 1155 - margin-top: 0; 1156 - margin-bottom: 10px; 1246 + &::before { 1247 + content: ""; 1248 + position: absolute; 1249 + inset: 0 auto 0 0; 1250 + width: 5px; 1251 + background: linear-gradient(180deg, @brand 0%, @brand-strong 100%); 1157 1157 } 1158 1158 1159 1159 p { 1160 - max-width: 680px; 1161 - margin-left: auto; 1162 - margin-right: auto; 1255 + margin: 0; 1163 1163 color: @muted; 1257 + font-size: 15px; 1258 + line-height: 1.6; 1164 1164 } 1165 1165 1261 + strong { 1262 + display: block; 1263 + margin-bottom: 4px; 1264 + color: @text; 1265 + font-size: 17px; 1266 + line-height: 1.35; 1267 + } 1268 + 1166 1166 .btn { 1167 - margin-top: 8px; 1270 + white-space: nowrap; 1271 + align-self: center; 1168 1168 } 1273 + 1274 + .btn-secondary { 1275 + border-color: @text; 1276 + background: @text; 1277 + color: #fff; 1278 + 1279 + &:hover, 1280 + &:focus { 1281 + border-color: @brand-strong; 1282 + background: @brand-strong; 1283 + color: #fff; 1284 + text-decoration: none; 1285 + } 1286 + } 1169 1169 } 1170 1170 1171 1171 .resource-note, 1172 1172 .resource-checklist, 1173 -.resource-cta { 1174 1174 display: flow-root; 1175 1175 } 1176 1176 1177 -@media (max-width: 767px) { 1178 - .resource-cta { 1179 - padding: 24px 20px; 1180 - } 1181 -} 1182 1182 1295 + 1183 1183 @media (max-width: 900px) { 1184 1184 .resource-layout { 1185 1185 padding-top: 22px;