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,33 +1229,53 @@ 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 + 1232 1232 .resource-inline-cta { 1233 - position: relative; 1234 - display: grid; 1235 - grid-template-columns: minmax(0, 1fr) auto; 1263 + display: flex; 1236 1236 align-items: center; 1265 + justify-content: space-between; 1237 1237 gap: 22px; 1238 - margin: 32px 0; 1239 - padding: 22px 24px 22px 28px; 1240 - border: 1px solid fade(@brand, 20%); 1267 + margin: 30px 0; 1268 + padding: 20px 22px; 1269 + border: 1px solid @line; 1270 + border-left: 4px solid @brand; 1241 1241 border-radius: @radius; 1242 1242 background: #fff; 1243 1243 box-shadow: @shadow-sm; 1244 - overflow: hidden; 1245 1245 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 - 1254 1254 p { 1255 1255 margin: 0; 1256 1256 color: @muted; 1257 - font-size: 15px; 1258 - line-height: 1.6; 1278 + line-height: 1.55; 1259 1259 } 1260 1260 1261 1261 strong { ... ... @@ -1263,36 +1263,44 @@ 1263 1263 margin-bottom: 4px; 1264 1264 color: @text; 1265 1265 font-size: 17px; 1266 - line-height: 1.3 5;1286 + line-height: 1.3; 1267 1267 } 1268 1268 1269 1269 .btn { 1290 + flex-shrink: 0; 1270 1270 white-space: nowrap; 1271 - align-self: center; 1272 1272 } 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 - } 1287 1287 } 1288 1288 1289 1289 .resource-note, 1290 1290 .resource-checklist, 1297 +.resource-cta, 1298 +.resource-inline-cta { 1291 1291 display: flow-root; 1292 1292 } 1293 1293 1302 +@media (max-width: 767px) { 1303 + .resource-cta { 1304 + padding: 24px 20px; 1305 + } 1306 +} 1294 1294 1308 +@media (max-width: 767px) { 1309 + .resource-inline-cta { 1310 + display: block; 1295 1295 1312 + p { 1313 + margin-bottom: 14px; 1314 + } 1315 + 1316 + .btn { 1317 + display: block; 1318 + width: 100%; 1319 + white-space: normal; 1320 + } 1321 + } 1322 +} 1323 + 1296 1296 @media (max-width: 900px) { 1297 1297 .resource-layout { 1298 1298 padding-top: 22px;