Make sure most app names don’t ellipsize, fix #22845, fix #22219

[jancborchardt]

Small adjustments to make sure that most app names don’t ellipsize, as discussed @karlitschek @juliushaertl

• font-size reduced to 12px (active/hover/focus get 14px again)
• letter-spacing: -0.5px;
• sides add 2 px each (from margin)

Further enhancement for active/hover/focus states:

• set in bold for further emphasis
• margin-bottom: -1px; for vertical alignment

Before

After

• Fix App name text display improvements #22845: App name text display improvements
• Fix App navigation design issues #22219: App navigation design issues – also feel free to review this @YouveGotMeowxy @STaRDoGG

[karlitschek]

Great 👍

[faily-bot]

🤖 beep boop beep 🤖

Here are the logs for the failed build:

Status of 33185: failure

acceptance-app-files

• tests/acceptance/features/app-files.feature:108

Show full log

  Scenario: show shares                                               # /drone/src/tests/acceptance/features/app-files.feature:108
    Given I am logged in                                              # LoginPageContext::iAmLoggedIn()
    And I share the link for "welcome.txt"                            # FilesAppSharingContext::iShareTheLinkFor()
    When I open the "Shares" section                                  # AppNavigationContext::iOpenTheSection()
    Then I see that the current section is "Shares"                   # AppNavigationContext::iSeeThatTheCurrentSectionIs()
    Then I see that the file list contains a file named "welcome.txt" # FileListContext::iSeeThatTheFileListContainsAFileNamed()
      Row for file welcome.txt in file list could not be found after 100 seconds (NoSuchElementException)

acceptance-users

• tests/acceptance/features/users.feature:35

Show full log

  Scenario: disable a user                                                      # /drone/src/tests/acceptance/features/users.feature:35
    Given I act as Jane                                                         # ActorContext::iActAs()
    And I am logged in as the admin                                             # LoginPageContext::iAmLoggedInAsTheAdmin()
    And I open the User settings                                                # SettingsMenuContext::iOpenTheUserSettings()
    And I see that the list of users contains the user user0                    # UsersSettingsContext::iSeeThatTheListOfUsersContainsTheUser()
    And I open the actions menu for the user user0                              # UsersSettingsContext::iOpenTheActionsMenuOf()
      Row for user user0 in Users Settings could not be found
      Actions menu for user user0 in Users Settings could not be found (NoSuchElementException)
    And I see that the "Disable user" action in the user0 actions menu is shown # UsersSettingsContext::iSeeTheAction()
    When I click the "Disable user" action in the user0 actions menu            # UsersSettingsContext::iClickTheAction()
    Then I see that the list of users does not contains the user user0          # UsersSettingsContext::iSeeThatTheListOfUsersDoesNotContainsTheUser()
    When I open the "Disabled users" section                                    # AppNavigationContext::iOpenTheSection()
    Then I see that the list of users contains the user user0                   # UsersSettingsContext::iSeeThatTheListOfUsersContainsTheUser()

[jancborchardt]

/backport to stable20

[skjnldsv]

Looks good!

[YouveGotMeowxy]

Minor gripe, lol, but is there any way to remove that "bounce" up that the entire row does when placing the cursor over any of the icons? Like, keep all the icons in the same horizontal place, and just have the text popup under the icons instead of bouncing the entire row up to make room for the text. For some reason that looks really ugly to me. It reminds me of a lot of times when working with CSS and a "hover bounce" accidentally happens after adding something and you have to fix it. :)

[jancborchardt]

Like, keep all the icons in the same horizontal place, and just have the text popup under the icons

The problem with that is there are 2 scenarios:

• Keep the icons where they are, and show the text below: Not enough space below, and alsp looks unbalanced if it's not vertical
• Put the icons a bit higher by default so the text can just appear: Looks just plain bad, is not vertically aligned.