Long collection names are truncated, with no hover text

[pa-jberanek]

Steps To Reproduce

1. Go to your web vault, then into an organisation
2. Create a collection with more than 18 or so English characters
3. Create another collection with a similar name and similar length
4. Browse the vault

Expected Result

I'd expect to be able to tell the difference between 2 or more collections which have long, similar names.

Actual Result

I am unable to tell the difference between 2 or more collections which have long, similar names.

Screenshots or Videos

Additional Context

This issue also affects the Windows native client.

Operating System

Windows

Operating System Version

21H2 (22000.795)

Web Browser

Chrome

Browser Version

104

Build Version

n/a

[mfominov]

To handle this problem we made some small css fix

collections.css: 
    .vault-filters .filter .filter-buttons button {
        white-space: normal;
        word-break: break-all;
    }
    .vault-filters .filter .filter-buttons i {
        display: inline-block;
    }
    .vault-filters .filter .filter-buttons .filter-button {
        max-width: 100%;
        text-align: left;
    }
    .vault-filters .filter-option.active>.filter-buttons .filter-button {
        font-weight: 600;
    }

[pa-jberanek]

To handle this problem we made some small css fix

Thank you for that, that's quite a neat workaround, until Bitwarden look at this.

[pa-jberanek]

What I'd prefer to the folder/collection name wrapping would be if the vast swathes of horizontal space which are currently empty would be used...I'll have a go at some CSS changes to allow the vault to be wider.

[pa-jberanek]

I went for:

    .container { width: auto }

[pa-jberanek]

For the full-width issue, it seems Bitwarden implemented an option at least for the web vault (it still doesn't help if your browser window is less wide though).

[tonaltti]

This is still an issue with the desktop client.

[djsmith85]

Closing this as duplicate of #4703 which per this comment is fixed in 2023.2.0.

@tonaltti: For the desktop, we have an open community contribution which is located here: https://github.com/bitwarden/clients/pull/5131