Merge pull request #5473 from aignatov-bio/ai-sci-8518-multiple-css-fixes

Multiple small css fixes [SCI-8518]]SCI-8529]

app/assets/javascripts/label_templates/label_templates_datatable.js

@@ -24,10 +24,10 @@
   }
 
   function renderNameHTML(data, type, row) {
-    return `${data.icon_image_tag}<a
+    return `<div class="flex gap-2">${data.icon_image_tag}<a
       href='${row.DT_RowAttr['data-edit-url']}'
       class='label-info-link'
-    >${data.name}</a>`;
+    >${data.name}</a></div>`;
   }
 
   function addAttributesToRow(row, data) {

app/assets/stylesheets/label_templates/index.scss

@@ -82,6 +82,10 @@
       .dataTables_scrollBody {
         height: 100%;
 
+        td {
+          white-space: nowrap;
+        }
+
         td:nth-child(2) {
           text-align: center;
         }
@@ -106,6 +110,12 @@
 
 .label-template-name {
   vertical-align: middle;
+
+  .label-info-link {
+    max-width: 16rem;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
 }
 
 .label-template-icon {

app/assets/stylesheets/my_modules/protocols/index.scss

@@ -7,6 +7,14 @@
 @import "constants";
 @import "mixins";
 
+.my-module-header {
+  .title-row {
+    .my_module-name {
+      max-width: calc(100% - 38rem);
+    }
+  }
+}
+
 .content-pane.my-modules-protocols-index {
   background-color: $color-alto;
   padding: 0 1rem 1rem !important;

app/assets/stylesheets/protocols/protocol.scss

@@ -6,18 +6,16 @@
 
 .content-pane.protocols-show {
   background-color: $color-alto;
-  margin: 0 -16px;
   min-height: calc(100vh - var(--navbar-height));
   overflow: hidden;
   padding: 0 0 10px;
-  width: calc(100% + 31px);
 
   .title-row h1 {
     max-width: 100%;
   }
 
   .content-header {
-    padding: 0 2em;
+    padding: 0 1.5rem;
   }
 
   .protocol-breadcrumbs {
@@ -106,11 +104,9 @@
       margin-bottom: 2em;
 
       .data-block {
+        display: flex;
+        gap: .5rem;
         margin-bottom: 16px;
-
-        > :nth-child(2) {
-          margin-left: 8px;
-        }
       }
 
       .authors-data {

app/views/my_modules/_header.html.erb

@@ -1,4 +1,4 @@
-<div class="content-header sticky-header">
+<div class="content-header sticky-header my-module-header">
   <div class="title-row">
     <i class="sn-icon sn-icon-navigator sci--layout--navigator-open cursor-pointer p-1.5 border rounded border-sn-light-grey mr-4"></i>
     <h1 class="my_module-name" data-toggle="tooltip" data-placement="bottom" title="<%= @my_module.name %>">