Changes for page Public Web Site
Last modified by Agnease on 2026/05/30 16:24
Summary
-
Objects (2 modified, 1 added, 0 removed)
Details
- XWiki.StyleSheetExtension[0]
-
- code
-
... ... @@ -599,32 +599,6 @@ 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 - 628 628 /* ========== CTA ========== */ 629 629 630 630 .cta-section { ... ... @@ -752,563 +752,3 @@ 752 752 padding: 24px 20px; 753 753 } 754 754 } 755 -/* ========== Resource / Article Pages ========== */ 756 - 757 -.resource-page { 758 - padding-top: 34px; 759 -} 760 - 761 -.resource-header { 762 - padding: 40px 0 30px; 763 - border-top: none; 764 - background: 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%); 767 - 768 - h1 { 769 - margin: 0 auto 14px; 770 - text-align: center; 771 - line-height: 1.18; 772 - } 773 - 774 - .resource-summary { 775 - max-width: 780px; 776 - margin: 0 auto; 777 - color: @muted; 778 - text-align: center; 779 - font-size: 18px; 780 - line-height: 1.55; 781 - } 782 -} 783 - 784 -.resource-layout { 785 - display: grid; 786 - grid-template-columns: minmax(0, 760px) 280px; 787 - gap: 42px; 788 - max-width: 1080px; 789 - margin: 0 auto; 790 - align-items: start; 791 -} 792 - 793 -.resource-content { 794 - color: @text; 795 - font-size: 16px; 796 - line-height: 1.68; 797 - 798 - h2 { 799 - text-align: left; 800 - margin: 34px 0 12px; 801 - line-height: 1.28; 802 - } 803 - 804 - h3 { 805 - margin: 24px 0 8px; 806 - line-height: 1.3; 807 - } 808 - 809 - p { 810 - margin: 0 0 16px; 811 - } 812 - 813 - ul, 814 - ol { 815 - margin: 0 0 18px; 816 - padding-left: 22px; 817 - } 818 - 819 - li { 820 - margin: 6px 0; 821 - } 822 - 823 - strong { 824 - color: @text; 825 - } 826 -} 827 - 828 -.resource-note { 829 - border-left: 4px solid @brand; 830 - background: @brand-bg; 831 - padding: 16px 18px; 832 - margin: 22px 0; 833 - border-radius: 0 @radius @radius 0; 834 - 835 - p:last-child { 836 - margin-bottom: 0; 837 - } 838 -} 839 - 840 -.resource-checklist { 841 - margin: 18px 0 24px; 842 - padding: 0; 843 - list-style: none; 844 - 845 - li { 846 - position: relative; 847 - padding: 10px 0 10px 34px; 848 - border-bottom: 1px solid @line; 849 - 850 - &:before { 851 - content: "\f00c"; 852 - font-family: FontAwesome; 853 - position: absolute; 854 - left: 0; 855 - top: 11px; 856 - color: @brand; 857 - } 858 - } 859 -} 860 - 861 -.resource-sidebar { 862 - position: sticky; 863 - top: 96px; 864 - border: 1px solid @line; 865 - border-radius: @radius; 866 - padding: 18px; 867 - background: #fff; 868 - box-shadow: @shadow-sm; 869 - 870 - h4 { 871 - margin: 0 0 10px; 872 - } 873 - 874 - ul { 875 - margin: 0; 876 - padding-left: 18px; 877 - color: @muted; 878 - } 879 - 880 - li { 881 - margin: 8px 0; 882 - } 883 - 884 - a { 885 - color: @brand; 886 - font-weight: 600; 887 - } 888 -} 889 - 890 -.resource-cta { 891 - margin-top: 36px; 892 - padding: 22px; 893 - border: 1px solid fade(@brand, 20%); 894 - border-radius: @radius; 895 - background: @brand-bg; 896 - 897 - h3 { 898 - margin-top: 0; 899 - } 900 - 901 - p { 902 - color: @muted; 903 - } 904 -} 905 - 906 -@media (max-width: 900px) { 907 - .resource-layout { 908 - grid-template-columns: 1fr; 909 - } 910 - 911 - .resource-sidebar { 912 - position: static; 913 - } 914 -} 915 -/* ========== Products / Extensions Pages ========== */ 916 - 917 -.product-index-section { 918 - padding: 52px 0 56px; 919 - 920 - h2 { 921 - margin-bottom: 10px; 922 - } 923 -} 924 - 925 -.product-card-grid { 926 - max-width: 840px; 927 - margin: 28px auto 0; 928 - display: grid; 929 - grid-template-columns: 1fr; 930 - grid-gap: 18px; 931 -} 932 - 933 -.product-card { 934 - background: #fff; 935 - border: 1px solid @line; 936 - border-radius: @radius; 937 - box-shadow: @shadow-sm; 938 - padding: 28px; 939 - display: grid; 940 - grid-template-columns: 68px 1fr; 941 - grid-gap: 22px; 942 - align-items: start; 943 - transition: transform .18s ease, box-shadow .18s ease; 944 - 945 - &:hover { 946 - transform: translateY(-2px); 947 - box-shadow: @shadow; 948 - } 949 - 950 - .product-card-icon { 951 - width: 58px; 952 - height: 58px; 953 - border-radius: 50%; 954 - background: fade(@brand, 10%); 955 - border: 1px solid fade(@brand, 20%); 956 - color: @brand; 957 - display: flex; 958 - align-items: center; 959 - justify-content: center; 960 - font-size: 22px; 961 - flex-shrink: 0; 962 - } 963 - 964 - h3 { 965 - margin: 0 0 10px; 966 - color: @text; 967 - font-size: 23px; 968 - line-height: 1.25; 969 - font-weight: 800; 970 - } 971 - 972 - p { 973 - color: @muted; 974 - line-height: 1.6; 975 - } 976 - 977 - .card-link { 978 - margin: 0; 979 - 980 - a { 981 - font-weight: 700; 982 - } 983 - } 984 -} 985 - 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 - 994 -.product-highlights { 995 - margin: 14px 0 20px; 996 - padding-left: 18px; 997 - color: @muted; 998 - 999 - li { 1000 - margin: 6px 0; 1001 - line-height: 1.45; 1002 - } 1003 -} 1004 - 1005 -/* ========== Individual Product Pages ========== */ 1006 - 1007 -.product-layout { 1008 - display: grid; 1009 - grid-template-columns: 1.1fr .9fr; 1010 - grid-gap: 36px; 1011 - max-width: 1040px; 1012 - margin: 0 auto; 1013 - align-items: start; 1014 -} 1015 - 1016 -.product-summary-card, 1017 -.product-info-card, 1018 -.product-gallery-panel { 1019 - background: #fff; 1020 - border: 1px solid @line; 1021 - border-radius: @radius; 1022 - box-shadow: @shadow-sm; 1023 -} 1024 - 1025 -.product-summary-card { 1026 - padding: 26px; 1027 - 1028 - h2 { 1029 - text-align: left; 1030 - margin-top: 0; 1031 - } 1032 - 1033 - p { 1034 - color: @muted; 1035 - line-height: 1.6; 1036 - } 1037 - 1038 - p:last-child { 1039 - margin-bottom: 0; 1040 - } 1041 -} 1042 - 1043 -.product-info-card { 1044 - padding: 22px; 1045 - 1046 - h3 { 1047 - margin-top: 0; 1048 - margin-bottom: 12px; 1049 - } 1050 - 1051 - ul { 1052 - margin: 0; 1053 - padding-left: 20px; 1054 - color: @muted; 1055 - } 1056 - 1057 - li { 1058 - margin: 8px 0; 1059 - line-height: 1.45; 1060 - } 1061 -} 1062 - 1063 -.product-feature-grid { 1064 - display: grid; 1065 - grid-template-columns: repeat(3, minmax(0, 1fr)); 1066 - grid-gap: 18px; 1067 - max-width: 1040px; 1068 - margin: 26px auto 0; 1069 -} 1070 - 1071 -.product-feature { 1072 - background: #fff; 1073 - border: 1px solid @line; 1074 - border-radius: @radius; 1075 - box-shadow: @shadow-sm; 1076 - padding: 22px; 1077 - transition: transform .18s ease, box-shadow .18s ease; 1078 - 1079 - &:hover { 1080 - transform: translateY(-2px); 1081 - box-shadow: @shadow; 1082 - } 1083 - 1084 - .feature-icon { 1085 - width: 46px; 1086 - height: 46px; 1087 - border-radius: 50%; 1088 - background: fade(@brand, 10%); 1089 - color: @brand; 1090 - display: flex; 1091 - align-items: center; 1092 - justify-content: center; 1093 - margin-bottom: 14px; 1094 - font-size: 18px; 1095 - } 1096 - 1097 - h3 { 1098 - margin: 0 0 8px; 1099 - color: @text; 1100 - font-size: 18px; 1101 - line-height: 1.25; 1102 - } 1103 - 1104 - p { 1105 - margin: 0; 1106 - color: @muted; 1107 - line-height: 1.5; 1108 - } 1109 -} 1110 - 1111 -.product-gallery-panel { 1112 - max-width: 1040px; 1113 - margin: 20px auto 0; 1114 - padding: 26px; 1115 - 1116 - h2 { 1117 - margin-top: 0; 1118 - text-align: center; 1119 - } 1120 - 1121 - .gallery-note { 1122 - max-width: 700px; 1123 - margin: 0 auto 18px; 1124 - color: @muted; 1125 - text-align: center; 1126 - line-height: 1.55; 1127 - } 1128 -} 1129 - 1130 -.product-gallery-placeholder { 1131 - min-height: 260px; 1132 - padding: 28px; 1133 - border: 1px dashed fade(@brand, 40%); 1134 - border-radius: @radius; 1135 - background: fade(@brand, 5%); 1136 - color: @muted; 1137 - text-align: center; 1138 - display: flex; 1139 - align-items: center; 1140 - justify-content: center; 1141 -} 1142 - 1143 -.product-section-muted { 1144 - background: 1145 - radial-gradient(42rem 16rem at 50% 0%, @brand-bg 0%, transparent 65%); 1146 -} 1147 - 1148 -@media (max-width: 980px) { 1149 - .product-layout, 1150 - .product-feature-grid { 1151 - grid-template-columns: 1fr; 1152 - } 1153 - 1154 - .product-summary-card h2 { 1155 - text-align: center; 1156 - } 1157 -} 1158 - 1159 -@media (max-width: 640px) { 1160 - .product-card { 1161 - grid-template-columns: 1fr; 1162 - padding: 22px; 1163 - text-align: left; 1164 - 1165 - .product-card-icon { 1166 - margin-bottom: 2px; 1167 - } 1168 - } 1169 - 1170 - .product-summary-card, 1171 - .product-info-card, 1172 - .product-feature, 1173 - .product-gallery-panel { 1174 - padding: 20px; 1175 - } 1176 -} 1177 -/* ========== Resources Index ========== */ 1178 - 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; 1291 - } 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 - } 1314 -}
- XWiki.StyleSheetExtension[1]
-
- code
-
... ... @@ -7,53 +7,25 @@ 7 7 @line: #E4ECE9; 8 8 @brand-bg: #F4FCFA; 9 9 10 -/* Top-level menu items */ 11 - 12 -.agnease-services-menu, 13 -.agnease-products-menu { 10 +.agnease-services-menu { 14 14 .dropdown-toggle { 15 15 font-weight: inherit; 16 16 font-size: inherit; 17 17 } 18 18 19 - .caret { 20 - margin-left: 4px; 21 - } 22 - 23 23 &.open > .dropdown-toggle, 24 24 .dropdown-toggle:hover, 25 25 .dropdown-toggle:focus { 26 - color: @brand -strong;19 + color: @brand; 27 27 background: transparent; 28 - background-color: transparent; 29 - box-shadow: none; 30 30 } 31 -} 32 32 33 -/* Keep Agnease public top-level menu visually clean when hovered/open/focused */ 34 - 35 -.navbar-nav > li.agnease-services-menu > a, 36 -.navbar-nav > li.agnease-products-menu > a, 37 -.navbar-nav > li.agnease-services-menu > a:hover, 38 -.navbar-nav > li.agnease-products-menu > a:hover, 39 -.navbar-nav > li.agnease-services-menu > a:focus, 40 -.navbar-nav > li.agnease-products-menu > a:focus, 41 -.navbar-nav > li.agnease-services-menu.open > a, 42 -.navbar-nav > li.agnease-products-menu.open > a, 43 -.navbar-nav > li.agnease-services-menu.open > a:hover, 44 -.navbar-nav > li.agnease-products-menu.open > a:hover, 45 -.navbar-nav > li.agnease-services-menu.open > a:focus, 46 -.navbar-nav > li.agnease-products-menu.open > a:focus { 47 - background: transparent; 48 - background-color: transparent; 49 - color: @brand-strong; 50 - box-shadow: none; 23 + .caret { 24 + margin-left: 4px; 25 + } 51 51 } 52 52 53 -/* Dropdown panels */ 54 - 55 -.agnease-services-dropdown, 56 -.agnease-products-dropdown { 28 +.agnease-services-dropdown { 57 57 min-width: 360px; 58 58 padding: 10px; 59 59 border: 1px solid @line; ... ... @@ -130,23 +130,12 @@ 130 130 } 131 131 } 132 132 133 -/* Products dropdown can be slightly narrower for now */ 134 - 135 -.agnease-products-dropdown { 136 - min-width: 340px; 137 -} 138 - 139 -/* Mobile */ 140 - 141 141 @media (max-width: 767px) { 142 - .agnease-services-dropdown, 143 - .agnease-products-dropdown { 106 + .agnease-services-dropdown { 144 144 min-width: 0; 145 145 width: 100%; 146 146 padding: 6px; 147 147 border-radius: 0; 148 - border-left: 0; 149 - border-right: 0; 150 150 box-shadow: none; 151 151 152 152 > li > a { ... ... @@ -154,3 +154,15 @@ 154 154 } 155 155 } 156 156 } 118 +/* Keep the top-level Services menu visually clean when hovered/open/focused */ 119 +.navbar-nav > li.agnease-services-menu > a, 120 +.navbar-nav > li.agnease-services-menu > a:hover, 121 +.navbar-nav > li.agnease-services-menu > a:focus, 122 +.navbar-nav > li.agnease-services-menu.open > a, 123 +.navbar-nav > li.agnease-services-menu.open > a:hover, 124 +.navbar-nav > li.agnease-services-menu.open > a:focus { 125 + background: transparent; 126 + background-color: transparent; 127 + color: @brand-strong; 128 + box-shadow: none; 129 +}
- XWiki.StyleSheetExtension[2]
-
- cache
-
... ... @@ -1,0 +1,1 @@ 1 +long - code
-
... ... @@ -1,0 +1,174 @@ 1 +/* ========== Resource / Article Pages ========== */ 2 + 3 +.resource-page { 4 + padding-top: 34px; 5 +} 6 + 7 +.resource-header { 8 + padding: 40px 0 30px; 9 + border-top: none; 10 + background: 11 + radial-gradient(42rem 14rem at 50% 0%, @brand-bg 0%, transparent 70%); 12 + 13 + .resource-kicker { 14 + display: inline-flex; 15 + align-items: center; 16 + gap: 8px; 17 + color: @brand; 18 + background: fade(@brand, 8%); 19 + border: 1px solid fade(@brand, 18%); 20 + border-radius: 999px; 21 + padding: 6px 12px; 22 + margin-bottom: 14px; 23 + font-size: 13px; 24 + font-weight: 700; 25 + } 26 + 27 + h1 { 28 + max-width: 820px; 29 + margin: 0 auto 14px; 30 + text-align: center; 31 + line-height: 1.18; 32 + } 33 + 34 + .resource-summary { 35 + max-width: 780px; 36 + margin: 0 auto; 37 + color: @muted; 38 + text-align: center; 39 + font-size: 18px; 40 + line-height: 1.55; 41 + } 42 +} 43 + 44 +.resource-layout { 45 + display: grid; 46 + grid-template-columns: minmax(0, 760px) 280px; 47 + gap: 42px; 48 + max-width: 1080px; 49 + margin: 0 auto; 50 + align-items: start; 51 +} 52 + 53 +.resource-content { 54 + color: @text; 55 + font-size: 16px; 56 + line-height: 1.68; 57 + 58 + h2 { 59 + text-align: left; 60 + margin: 34px 0 12px; 61 + line-height: 1.28; 62 + } 63 + 64 + h3 { 65 + margin: 24px 0 8px; 66 + line-height: 1.3; 67 + } 68 + 69 + p { 70 + margin: 0 0 16px; 71 + } 72 + 73 + ul, 74 + ol { 75 + margin: 0 0 18px; 76 + padding-left: 22px; 77 + } 78 + 79 + li { 80 + margin: 6px 0; 81 + } 82 + 83 + strong { 84 + color: @text; 85 + } 86 +} 87 + 88 +.resource-note { 89 + border-left: 4px solid @brand; 90 + background: @brand-bg; 91 + padding: 16px 18px; 92 + margin: 22px 0; 93 + border-radius: 0 @radius @radius 0; 94 + 95 + p:last-child { 96 + margin-bottom: 0; 97 + } 98 +} 99 + 100 +.resource-checklist { 101 + margin: 18px 0 24px; 102 + padding: 0; 103 + list-style: none; 104 + 105 + li { 106 + position: relative; 107 + padding: 10px 0 10px 34px; 108 + border-bottom: 1px solid @line; 109 + 110 + &:before { 111 + content: "\f00c"; 112 + font-family: FontAwesome; 113 + position: absolute; 114 + left: 0; 115 + top: 11px; 116 + color: @brand; 117 + } 118 + } 119 +} 120 + 121 +.resource-sidebar { 122 + position: sticky; 123 + top: 96px; 124 + border: 1px solid @line; 125 + border-radius: @radius; 126 + padding: 18px; 127 + background: #fff; 128 + box-shadow: @shadow-sm; 129 + 130 + h4 { 131 + margin: 0 0 10px; 132 + } 133 + 134 + ul { 135 + margin: 0; 136 + padding-left: 18px; 137 + color: @muted; 138 + } 139 + 140 + li { 141 + margin: 8px 0; 142 + } 143 + 144 + a { 145 + color: @brand; 146 + font-weight: 600; 147 + } 148 +} 149 + 150 +.resource-cta { 151 + margin-top: 36px; 152 + padding: 22px; 153 + border: 1px solid fade(@brand, 20%); 154 + border-radius: @radius; 155 + background: @brand-bg; 156 + 157 + h3 { 158 + margin-top: 0; 159 + } 160 + 161 + p { 162 + color: @muted; 163 + } 164 +} 165 + 166 +@media (max-width: 900px) { 167 + .resource-layout { 168 + grid-template-columns: 1fr; 169 + } 170 + 171 + .resource-sidebar { 172 + position: static; 173 + } 174 +} - contentType
-
... ... @@ -1,0 +1,1 @@ 1 +LESS - name
-
... ... @@ -1,0 +1,1 @@ 1 +resources - use
-
... ... @@ -1,0 +1,1 @@ 1 +onDemand