openvibers/openvibe.mediahub Commits
openvibe.pics: the six feature cards sit in two rows of three on a desktop (they were four, then two beside two empty slots) (#120)
Changes
@@@ -70,7 +70,7 @@.ovp-tile:hover img, .ovp-tile:focus-visible img { transform: scale(1.03); }.ovp-tile.is-hidden img { opacity: .45; }.ovp-flag { position: absolute; left: 8px; top: 8px; padding: 2px 8px; border-radius: 999px; background: rgba(0, 0, 0, .7); color: #fff; font-size: .72rem; font-weight: 700; }--.ovp-features { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }++.ovp-features { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 12px; }.ovp-feature { padding: 16px 18px; border-radius: 14px; border: 1px solid var(--ovp-line); background: var(--ovp-card); }.ovp-feature h3 { margin: 0 0 6px; font-size: 1rem; }.ovp-feature p { margin: 0; color: var(--ovp-dim); font-size: .92rem; }
@@ -70,7 +70,7 @@
@@ -70,7 +70,7 @@
.ovp-tile:hover img, .ovp-tile:focus-visible img { transform: scale(1.03); }
.ovp-tile:hover img, .ovp-tile:focus-visible img { transform: scale(1.03); }
.ovp-tile.is-hidden img { opacity: .45; }
.ovp-tile.is-hidden img { opacity: .45; }
.ovp-flag { position: absolute; left: 8px; top: 8px; padding: 2px 8px; border-radius: 999px; background: rgba(0, 0, 0, .7); color: #fff; font-size: .72rem; font-weight: 700; }
.ovp-flag { position: absolute; left: 8px; top: 8px; padding: 2px 8px; border-radius: 999px; background: rgba(0, 0, 0, .7); color: #fff; font-size: .72rem; font-weight: 700; }
-.ovp-features { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
+.ovp-features { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 12px; }
.ovp-feature { padding: 16px 18px; border-radius: 14px; border: 1px solid var(--ovp-line); background: var(--ovp-card); }
.ovp-feature { padding: 16px 18px; border-radius: 14px; border: 1px solid var(--ovp-line); background: var(--ovp-card); }
.ovp-feature h3 { margin: 0 0 6px; font-size: 1rem; }
.ovp-feature h3 { margin: 0 0 6px; font-size: 1rem; }
.ovp-feature p { margin: 0; color: var(--ovp-dim); font-size: .92rem; }
.ovp-feature p { margin: 0; color: var(--ovp-dim); font-size: .92rem; }