Optimize project header overview

src/api/app/views/webui/project/_basic_info.html.haml

@@ -1,19 +1,12 @@
 .basic-info.in-place-editing
-  - if project.categories.any?
-    - project.categories.each do |category|
-      = category_badge(category)
-  .mb-3
-    = render partial: 'webui/shared/label_global_list', locals: { project: project }
-  - if project.url.present?
-    = link_to(project.url, project.url, class: 'mb-3 d-block')
   .mb-4#description-text
     - if project.description.blank?
       %i No description set
     - else
       = render partial: 'webui/shared/collapsible_text', locals: { text: project.description,
                                                                    render_markdown: Flipper.enabled?('foster_collaboration', User.session) }
   - if policy(project).update?
-    .pt-4
+    .pt-2
       = link_to(edit_project_path(project), class: 'ps-0', remote: true, title: 'Edit') do
         %i.fas.fa-edit.text-secondary
         %span.nav-item-name Edit

src/api/app/views/webui/project/_side_links.html.haml

@@ -1,4 +1,4 @@
-%ul.side_links.list-unstyled
+.d-flex.side_links.justify-content-start.flex-wrap
   - if project.maintenance?
     = render partial: 'webui/project/side_links/maintenance_project', locals: { open_maintenance_incidents: open_maintenance_incidents,
                                                                                 project: project,
@@ -27,29 +27,29 @@
                                                                      outgoing_requests_size: outgoing_requests_size }
 
   - if project.defines_remote_instance?
-    %li
+    .me-3.text-nowrap
       %i.fas.fa-link
       Links against the remote OBS instance at:
       = link_to_if(project.remoteurl, project.remoteurl, project.remoteurl)
 
   - if linking_projects.present?
-    %li
+    .me-3.text-nowrap
       = link_to('#', data: { 'bs-toggle': 'modal', 'bs-target': '#linking-projects-modal' }) do
         %i.fa.fa-info-circle.text-info
         = pluralize(linking_projects.size, 'linking project')
 
   - if project_maintenance_project
-    %li
+    .me-3.text-nowrap
       %i.fa.fa-check-circle.text-success
       Maintained by
       = link_to(project_show_path(project_maintenance_project)) do
         = project_maintenance_project
 
   - if project.locked?
-    %li
+    .me-3.text-nowrap
       %i.fa.fa-lock
       is locked
   - reports_component = ReportsNoticeComponent.new(reportable: project, user: User.session)
   - if reports_component.render?
-    %li
+    .me-3.text-nowrap
       = render reports_component

src/api/app/views/webui/project/show.html.haml

@@ -10,30 +10,38 @@
 .card.mb-3
   = render partial: 'tabs', locals: { project: @project }
   .card-body
-    .d-flex.justify-content-between.mb-2
+    .d-flex.justify-content-between
       %h3#project-title
         = @project.title.presence || @project
+        - if @project.categories.any?
+          %small
+            - @project.categories.each do |category|
+              = category_badge(category)
       - if User.session
         .d-inline.ms-1#watchlist-icon-wrapper
           = render WatchlistIconComponent.new(user: User.session,
                                               project: @project,
                                               current_object: @project)
-    .row
-      .col-md-8
-        = render partial: 'basic_info', locals: { project: @project }
-      .col-md-4
-        = render partial: 'side_links', locals: { open_maintenance_incidents: @open_maintenance_incidents,
-                                                  project: @project,
-                                                  maintained_projects: @maintained_projects,
-                                                  nr_of_problem_packages: @nr_of_problem_packages,
-                                                  open_release_requests: @open_release_requests,
-                                                  release_targets: @release_targets,
-                                                  requests: @requests,
-                                                  package: @package,
-                                                  linking_projects: @linking_projects,
-                                                  project_maintenance_project: @project_maintenance_project,
-                                                  incoming_requests_size: @incoming_requests_size,
-                                                  outgoing_requests_size: @outgoing_requests_size }
+    - if @project.url.present?
+      = link_to(@project.url, @project.url, class: 'd-block')
+    .mt-2
+      = render partial: 'webui/shared/label_global_list', locals: { project: @project }
+    .mt-2
+      = render partial: 'basic_info', locals: { project: @project }
+  .card-footer
+    = render partial: 'side_links', locals: { open_maintenance_incidents: @open_maintenance_incidents,
+                                              project: @project,
+                                              maintained_projects: @maintained_projects,
+                                              nr_of_problem_packages: @nr_of_problem_packages,
+                                              open_release_requests: @open_release_requests,
+                                              release_targets: @release_targets,
+                                              requests: @requests,
+                                              package: @package,
+                                              linking_projects: @linking_projects,
+                                              project_maintenance_project: @project_maintenance_project,
+                                              incoming_requests_size: @incoming_requests_size,
+                                              outgoing_requests_size: @outgoing_requests_size }
+
 .overview
   .build-results
     = render partial: 'webui/shared/buildresult_box', locals: { project: @project.name }

src/api/app/views/webui/project/side_links/_incident_project.html.haml

@@ -1,10 +1,10 @@
 - unless project.patchinfos.exists?
-  %li
+  .me-3.text-nowrap
     %i.fa.fa-exclamation-circle.text-danger
     = link_to_if(User.possibly_nobody.can_modify?(project), 'Patchinfo missing',
                   patchinfo_path(project: project, package: 'patchinfo'), method: :post)
 - if open_release_requests.present?
-  %li
+  .me-3.text-nowrap
     :ruby
       path = if open_release_requests.length == 1
                request_show_path(open_release_requests.first)

src/api/app/views/webui/project/side_links/_maintenance_project.html.haml

@@ -1,11 +1,11 @@
-%li
+.me-3.text-nowrap
   - if open_maintenance_incidents.empty?
     %i.fa.fa-check-circle.text-success
   - else
     %i.fa.fa-exclamation-circle.text-danger
   = link_to(project_maintenance_incidents_path(project)) do
     = pluralize(open_maintenance_incidents.size, 'open incident')
-%li
+.me-3.text-nowrap
   - if maintained_projects.empty?
     %i.fa.fa-exclamation-circle.text-danger
   - else

src/api/app/views/webui/project/side_links/_patchinfo_present.html.haml

@@ -1,4 +1,4 @@
-%li
+.me-3.text-nowrap
   %i.fa.fa-band-aid.text-success
   = link_to(show_patchinfo_path(project, 'patchinfo')) do
     Patchinfo present

src/api/app/views/webui/project/side_links/_project_monitor.html.haml

@@ -1,4 +1,4 @@
-%li
+.me-3.text-nowrap
   %i.fa.fa-exclamation-circle.text-danger
   = link_to(project_monitor_path(project, succeeded: 0, blocked: 0, finished: 0, signing: 0, dispatching: 0, scheduled: 0, building: 0)) do
     = pluralize(nr_of_problem_packages, 'build error')

src/api/app/views/webui/project/side_links/_release_targets.html.haml

@@ -1,4 +1,4 @@
-%li
+.me-3.text-nowrap
   %i.fa.fa-info-circle.text-info
   = link_to(project_meta_path(project)) do
     = pluralize(release_targets.length, 'Release Target')

src/api/app/views/webui/project/side_links/_requests.html.haml

@@ -1,4 +1,4 @@
-%li
+.me-3.text-nowrap
   :ruby
     path = if requests.size == 1
              request_show_path(requests.first)

src/api/app/views/webui/shared/_collapsible_text.html.haml

@@ -1,6 +1,6 @@
 -# NOTE: look into app/assets/stylesheets/webui/collapsible-text.scss
 - if text.present?
-  .obs-collapsible-textbox.vanilla-textbox-to-collapse{ class: "#{extra_css_classes if defined?(extra_css_classes)}" }
+  .obs-collapsible-textbox.full-width.vanilla-textbox-to-collapse{ class: "#{extra_css_classes if defined?(extra_css_classes)}" }
     .obs-collapsible-text
       - if local_assigns[:render_markdown]
         = render_as_markdown(text)