Skip to content

feat: Expands description to fit card (closes #27)#32

Merged
EmersonFras merged 4 commits intomainfrom
feature/issue-27/fill-empty-space-with-description
Jan 17, 2026
Merged

feat: Expands description to fit card (closes #27)#32
EmersonFras merged 4 commits intomainfrom
feature/issue-27/fill-empty-space-with-description

Conversation

@EmersonFras
Copy link
Copy Markdown
Contributor

Summary

Dynamically scales the size of the description in the catalogs cards so that they take up empty space. Along with this the title length has been limited to 3 lines. User's can hover title to get the full title.

Images

Below is an example of the description expanding.

image

Closes #27

@EmersonFras EmersonFras requested review from Copilot and egrace479 and removed request for Copilot January 16, 2026 23:01
@EmersonFras EmersonFras removed the request for review from egrace479 January 16, 2026 23:02
Copilot AI review requested due to automatic review settings January 16, 2026 23:35
@EmersonFras EmersonFras requested a review from egrace479 January 16, 2026 23:37
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR improves the catalog card layout by allowing descriptions to dynamically expand and fill available vertical space, while limiting title lengths to 3 lines with a hover tooltip for full titles.

Changes:

  • Modified catalog card structure to make descriptions expand and fill empty space using flexbox
  • Limited title display to 3 lines with overflow handling and added hover tooltip showing full title
  • Updated main container width constraints for better responsive layout

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 1 comment.

File Description
main.js Updated card rendering to move description outside header div, apply flex-grow for dynamic sizing, limit title to 3 lines, and add title tooltip
index.html Changed main container from generic container class to responsive max-width constraints for improved layout

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread main.js Outdated
Copy link
Copy Markdown
Member

@egrace479 egrace479 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome!

@EmersonFras EmersonFras merged commit 20902c0 into main Jan 17, 2026
@egrace479 egrace479 deleted the feature/issue-27/fill-empty-space-with-description branch February 20, 2026 23:38
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Fill available space with descriptions

3 participants