nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Hub Gallery last row should not be stretched

CynthiaRoush1

When the number of cards in a Hub Gallery is not divisible by 4, the remaining cards are stretched across the last row. There are multiple reasons to keep all cards the same size:

Visually more orderly and appealing
The last items are not more important. Larger size implies more importance.
Keep the same aspect ratio for thumbnails.

Since I was already using the manual option for galleries, I find myself putting the last row in its own gallery and padding with empty text boxes to stop the stretching. This workaround is messy and I hope the hub will be changed to either default to standard card size or provide that option.

Trouver plus de publications taguées avec

Status: Ouvrir

Réponses

KevinMacLeodCAI

Great idea. I would also like to see cards the same size by default. And either a way to control stretching for them all and/or customize on each individual card. Is this on the road map?

I tried accomplishing this same goal with CSS to adjust the thumbnail width, work in progress... https://community.esri.com/t5/arcgis-hub-questions/how-to-prevent-gallery-thumbnails-from-stretching/m-p/1095548#M4750

Gallery is one of the main uses I see for Hub in addition to search, for municipalities to provide a list of apps and data. I hope they add stretching control and pagination (left / right arrows) to swipe horizontally on a gallery through apps when the number exceeds the amount displayed, i.e. 4 or 8 or 12, etc. https://community.esri.com/t5/arcgis-hub-ideas/add-pagination-to-gallery-widget/idi-p/1044258

AdminWPZ

Thank you both for your suggestions, I fully second your ideas. This really doesn't look professional.

Char10773g

Agreed! This is a real problem for my client at the moment - we are dynamically generating cards so different users will see a different number of cards - those who see 5 will have one app much bigger than the rest which is a confusing user experience as it is not more significant than the other apps, it's just the last one in the list. I think this could be quite easily fixed using the css grid functionality - I tried to override the css of the current gallery but unfortunately was unsuccessful in getting it to apply. Maybe this could be a checkbox option so that you can have the cards either uniform size or stretch as they currently do? I can't really understand what the use case is for differently sized cards.

Rejoindre la conversation

Connectez-vous pour publier, suivre du contenu, et plus encore. Nouveau ici ? Inscrivez-vous gratuitement.