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
-
... ... @@ -1229,53 +1229,33 @@ 1229 1229 } 1230 1230 } 1231 1231 1232 -.resource-cta { 1233 - display: flex; 1234 - flex-direction: column; 1235 - align-items: center; 1236 - text-align: center; 1237 - 1238 - max-width: 820px; 1239 - margin: 42px auto 0; 1240 - padding: 28px 30px; 1241 - border: 1px solid fade(@brand, 20%); 1242 - border-radius: @radius; 1243 - background: @brand-bg; 1244 - 1245 - h3 { 1246 - margin-top: 0; 1247 - margin-bottom: 10px; 1248 - } 1249 - 1250 - p { 1251 - max-width: 680px; 1252 - margin-left: auto; 1253 - margin-right: auto; 1254 - color: @muted; 1255 - } 1256 - 1257 - .btn { 1258 - margin-top: 8px; 1259 - } 1260 -} 1261 - 1262 1262 .resource-inline-cta { 1263 - display: flex; 1233 + position: relative; 1234 + display: grid; 1235 + grid-template-columns: minmax(0, 1fr) auto; 1264 1264 align-items: center; 1265 - justify-content: space-between; 1266 1266 gap: 22px; 1267 - margin: 30px 0; 1268 - padding: 20px 22px; 1269 - border: 1px solid @line; 1270 - border-left: 4px solid @brand; 1238 + margin: 32px 0; 1239 + padding: 22px 24px 22px 28px; 1240 + border: 1px solid fade(@brand, 20%); 1271 1271 border-radius: @radius; 1272 1272 background: #fff; 1273 1273 box-shadow: @shadow-sm; 1244 + overflow: hidden; 1274 1274 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%); 1252 + } 1253 + 1275 1275 p { 1276 1276 margin: 0; 1277 1277 color: @muted; 1278 - line-height: 1.55; 1257 + font-size: 15px; 1258 + line-height: 1.6; 1279 1279 } 1280 1280 1281 1281 strong { ... ... @@ -1283,40 +1283,44 @@ 1283 1283 margin-bottom: 4px; 1284 1284 color: @text; 1285 1285 font-size: 17px; 1286 - line-height: 1.3; 1266 + line-height: 1.35; 1287 1287 } 1288 1288 1289 1289 .btn { 1290 - flex-shrink: 0; 1291 1291 white-space: nowrap; 1271 + align-self: center; 1292 1292 } 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 + } 1293 1293 } 1294 1294 1295 1295 .resource-note, 1296 1296 .resource-checklist, 1297 -.resource-cta, 1298 -.resource-inline-cta { 1299 1299 display: flow-root; 1300 1300 } 1301 1301 1302 1302 @media (max-width: 767px) { 1303 - .resource-cta { 1304 - padding: 24px 20px; 1305 - } 1306 -} 1307 - 1308 -@media (max-width: 767px) { 1309 1309 .resource-inline-cta { 1310 - display: block; 1296 + grid-template-columns: 1fr; 1297 + gap: 16px; 1298 + padding: 22px 20px 22px 24px; 1299 + text-align: left; 1311 1311 1312 - p { 1313 - margin-bottom: 14px; 1314 - } 1315 - 1316 1316 .btn { 1317 - display: block; 1318 1318 width: 100%; 1319 - white-space:normal;1303 + justify-self: stretch; 1320 1320 } 1321 1321 } 1322 1322 }