Workspaces UI fixes on mobile view

What does this MR do and why?

It delivers various workspaces UI fixes

• Remove horizontal scrolling when workspace name is long in Workspaces popover.
• Fix workspaces list in mobile devices.

Screenshots or screen recordings

Before	After

How to set up and validate locally

My recommendation is using the e2e spec to test this change. We can rely on live_debug and CHROME_HEADLESS=0 so you can avoid setting up remote development in your local environment.

1. Apply the following patch

   diff --git a/ee/spec/features/remote_development/workspaces_dropdown_group_spec.rb b/ee/spec/features/remote_development/workspaces_dropdown_group_spec.rb
   index 8c76427b768c..edf25b236824 100644
   --- a/ee/spec/features/remote_development/workspaces_dropdown_group_spec.rb
   +++ b/ee/spec/features/remote_development/workspaces_dropdown_group_spec.rb
   @@ -82,6 +82,8 @@
          it 'allows navigating to the new workspace page' do
            click_link 'New workspace'
    
   +        live_debug
   +
            expect(page).to have_current_path("#{new_remote_development_workspace_path}?project=#{project.full_path}")
            expect(page).to have_css('button', text: project.name_with_namespace)
          end
   

2. Run the test using this command: CHROME_HEADLESS=0 bundle exec rspec ee/spec/features/remote_development/workspaces_dropdown_group_spec.rb

3. Click "Edit" in the repository view

4. You should see the Workspaces popover displaying one workspace.

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

• I have evaluated the MR acceptance checklist for this MR.