fix(repos): set the container height properly (js)@@ -1,5 +1,5 @@
{
- "_generatedAtUnix": 1778835583155,
+ "_generatedAtUnix": 1778835975148,
"_hashAlgorithm": "sha1",
"_version": 2,
"assets": {
@@ -40,7 +40,7 @@
"pathSourceMap": "./public/.islands/PullRequestSourceSelect.bundle.js.map"
},
"RepositoriesList": {
- "hash": "fe287b3d71b1600333705fe6bf938f37181ba2f6",
+ "hash": "51fb0ce5a1de069cad8f7c6017462e2358ca6e88",
"pathSource": "./app/islands/RepositoriesList.tsx",
"pathBundle": "./public/.islands/RepositoriesList.bundle.js",
"pathSourceMap": "./public/.islands/RepositoriesList.bundle.js.map"
@@ -60,6 +60,7 @@ const RepositoriesList: ReactIsland<
}
`}</style>
<script>{`
+ // quick js to set @container height based on number of cards
window.addEventListener(\`load\`, function(event) {
const container = document.querySelector(\`${selector}\`);
if (!container) return;
@@ -68,8 +69,8 @@ const RepositoriesList: ReactIsland<
const gap = 8;
const cols = Math.max(1, Math.floor((containerWidth + gap) / (cardMin + gap)));
const rows = Math.ceil(${repositories.length} / cols);
- const cardHeight = 200; // use computed or measured height
- const height = rows * cardHeight + (rows - 1) * gap;
+ const cardHeight = 210; // use computed or measured height
+ const height = (rows * cardHeight) + ((rows - 1) * gap);
container.style.height = \`\${height}px\`;
container.style.minHeight = \`\${height}px\`;
});