openvibers/openvibe.community Commits
Phones: list grids size their columns with minmax(0, 1fr) (or a min(…, 100%) minimum), so one long line can never widen a page past the screen (#134)
Changes
@@@ -263,10 +263,10 @@ a.badge:hover { border-color: var(--accent); text-decoration: none; color: var(-.chat-room { margin: 12px 0 16px; padding: 10px 14px; border: 1px solid var(--border-light); border-radius: 10px; background: var(--bg-card); }.chat-room h2 { margin: 0 0 6px; }.space-settings summary, .crosspost-form summary { cursor: pointer; color: var(--text-secondary); font-weight: 600; }--.mod-list { list-style: none; padding: 0; margin: 10px 0; display: grid; gap: 6px; }++.mod-list { list-style: none; padding: 0; margin: 10px 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }.mod-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 6px 10px; border: 1px solid var(--border-light); border-radius: 8px; background: var(--bg-card); }.mod-row .inline-form { margin-left: auto; }--.discuss-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }++.discuss-list { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }.postbits { display: grid; gap: 12px; margin: 12px 0; }.postbit { display: grid; grid-template-columns: 170px 1fr; background: var(--bg-card); border: 1px solid var(--border-light); border-radius: 12px; scroll-margin-top: 80px; }.postbit-author { padding: 14px; background: var(--bg-hover); border-right: 1px solid var(--border-light); border-radius: 12px 0 0 12px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; }
@@ -263,10 +263,10 @@ a.badge:hover { border-color: var(--accent); text-decoration: none; color: var(-
@@ -263,10 +263,10 @@ a.badge:hover { border-color: var(--accent); text-decoration: none; color: var(-
.chat-room { margin: 12px 0 16px; padding: 10px 14px; border: 1px solid var(--border-light); border-radius: 10px; background: var(--bg-card); }
.chat-room { margin: 12px 0 16px; padding: 10px 14px; border: 1px solid var(--border-light); border-radius: 10px; background: var(--bg-card); }
.chat-room h2 { margin: 0 0 6px; }
.chat-room h2 { margin: 0 0 6px; }
.space-settings summary, .crosspost-form summary { cursor: pointer; color: var(--text-secondary); font-weight: 600; }
.space-settings summary, .crosspost-form summary { cursor: pointer; color: var(--text-secondary); font-weight: 600; }
-.mod-list { list-style: none; padding: 0; margin: 10px 0; display: grid; gap: 6px; }
+.mod-list { list-style: none; padding: 0; margin: 10px 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }
.mod-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 6px 10px; border: 1px solid var(--border-light); border-radius: 8px; background: var(--bg-card); }
.mod-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 6px 10px; border: 1px solid var(--border-light); border-radius: 8px; background: var(--bg-card); }
.mod-row .inline-form { margin-left: auto; }
.mod-row .inline-form { margin-left: auto; }
-.discuss-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
+.discuss-list { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
.postbits { display: grid; gap: 12px; margin: 12px 0; }
.postbits { display: grid; gap: 12px; margin: 12px 0; }
.postbit { display: grid; grid-template-columns: 170px 1fr; background: var(--bg-card); border: 1px solid var(--border-light); border-radius: 12px; scroll-margin-top: 80px; }
.postbit { display: grid; grid-template-columns: 170px 1fr; background: var(--bg-card); border: 1px solid var(--border-light); border-radius: 12px; scroll-margin-top: 80px; }
.postbit-author { padding: 14px; background: var(--bg-hover); border-right: 1px solid var(--border-light); border-radius: 12px 0 0 12px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; }
.postbit-author { padding: 14px; background: var(--bg-hover); border-right: 1px solid var(--border-light); border-radius: 12px 0 0 12px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; }