Skip to content

Conversation

@Antreesy
Copy link
Contributor

@Antreesy Antreesy commented May 6, 2024

☑️ Resolves

  • Fix cases then component could overflow page content (in sidebar, for example)
    • Restrict max-height of 'dropdown-toggle' element to 100px (2 visible lines of tags + 1 half-visible to scroll)
    • Make action button sticky to follow position

🖼️ Screenshots

🏚️ Before 🏡 After
image image

before-select | after-select

🚧 Tasks

  • Check other use-cases
  • Discuss restriction size

🏁 Checklist

  • ⛑️ Tests are included or are not applicable
  • 📘 Component documentation has been extended, updated or is not applicable
  • 3️⃣ Backport to next requested with a Vue 3 upgrade

@Antreesy Antreesy added bug Something isn't working 3. to review Waiting for reviews feature: select Related to the NcSelect* components accessibility Making sure we design for the widest range of people possible, including those who have disabilities labels May 6, 2024
@Antreesy Antreesy added this to the 8.11.3 milestone May 6, 2024
@Antreesy Antreesy self-assigned this May 6, 2024
Copy link
Contributor

@ShGKme ShGKme left a comment

Choose a reason for hiding this comment

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

Nice. I'd do it even smaller by default, e.g. 2.5 lines.

@ShGKme
Copy link
Contributor

ShGKme commented May 6, 2024

Probably we need a different component to handle it. Something like GitHub's label dialog where you can search.

@susnux susnux requested a review from a team May 6, 2024 11:39
Copy link
Contributor

@jancborchardt jancborchardt left a comment

Choose a reason for hiding this comment

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

Great idea! Agree with @ShGKme that a height of 2.5 lines would be nicer.

@Antreesy Antreesy force-pushed the fix/noid/ncselect-limit-max-height branch from e791ad2 to 471cfaf Compare May 6, 2024 12:25
@Antreesy
Copy link
Contributor Author

Antreesy commented May 6, 2024

UPD: reduce max-height to 100px (2.5 - 2.6 visible lines)


Github-styled labels is a good idea, but it's more a feature-level change (restyle of NcSelectTags wouldn't be enough, IMO), so I'd fix existing component first

@susnux
Copy link
Contributor

susnux commented May 6, 2024

/backport to next

@susnux susnux merged commit 3214c49 into master May 6, 2024
@susnux susnux deleted the fix/noid/ncselect-limit-max-height branch May 6, 2024 12:46
@Antreesy Antreesy mentioned this pull request May 7, 2024
Copy link
Contributor

@jancborchardt jancborchardt left a comment

Choose a reason for hiding this comment

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

Thanks @Antreesy! :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

3. to review Waiting for reviews accessibility Making sure we design for the widest range of people possible, including those who have disabilities bug Something isn't working feature: select Related to the NcSelect* components

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants