openvibers/openvibe.play Commits
The home page is wider than a phone (Play) (#88)
Changes
@@@ -61,7 +61,8 @@ button.sc-btn.sc-primary { border: 0; }heading size and rhythm, so they do not read as another site. */:is(.pl-titles, .pl-popular, .pl-faq) { font-family: var(--ov-font, 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif); }:is(.pl-titles, .pl-popular, .pl-faq) > h2 { margin: 0 0 10px; font-size: clamp(22px, 2.6vw, 30px); letter-spacing: -.02em; }--.pl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 16px; }++/* Positioned: its hidden labels (.pl-sr) are absolute and would land past the last off-screen card. */++.pl-grid { position: relative; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 16px; }.pl-card { border: 1px solid var(--border, #1f2d47); border-radius: 14px; padding: 18px 18px 8px; background: var(--bg-card, #131c2e); }.pl-card h3 { margin: 0 0 4px; font-size: 1.25rem; }.pl-card h3 a { color: var(--text-primary, #e6edf7); text-decoration: none; }
@@ -61,7 +61,8 @@ button.sc-btn.sc-primary { border: 0; }
@@ -61,7 +61,8 @@ button.sc-btn.sc-primary { border: 0; }
heading size and rhythm, so they do not read as another site. */
heading size and rhythm, so they do not read as another site. */
:is(.pl-titles, .pl-popular, .pl-faq) { font-family: var(--ov-font, 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif); }
:is(.pl-titles, .pl-popular, .pl-faq) { font-family: var(--ov-font, 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif); }
:is(.pl-titles, .pl-popular, .pl-faq) > h2 { margin: 0 0 10px; font-size: clamp(22px, 2.6vw, 30px); letter-spacing: -.02em; }
:is(.pl-titles, .pl-popular, .pl-faq) > h2 { margin: 0 0 10px; font-size: clamp(22px, 2.6vw, 30px); letter-spacing: -.02em; }
-.pl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 16px; }
+/* Positioned: its hidden labels (.pl-sr) are absolute and would land past the last off-screen card. */
+.pl-grid { position: relative; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 16px; }
.pl-card { border: 1px solid var(--border, #1f2d47); border-radius: 14px; padding: 18px 18px 8px; background: var(--bg-card, #131c2e); }
.pl-card { border: 1px solid var(--border, #1f2d47); border-radius: 14px; padding: 18px 18px 8px; background: var(--bg-card, #131c2e); }
.pl-card h3 { margin: 0 0 4px; font-size: 1.25rem; }
.pl-card h3 { margin: 0 0 4px; font-size: 1.25rem; }
.pl-card h3 a { color: var(--text-primary, #e6edf7); text-decoration: none; }
.pl-card h3 a { color: var(--text-primary, #e6edf7); text-decoration: none; }