Merge pull request #6663 from opf/fix/28474/add-border-to-focused-row

[28474] Add border to selected/checked row

app/assets/stylesheets/content/_tables.sass

@@ -158,8 +158,17 @@ th.hidden
   display: none
 
 tr.context-menu-selection,
-tr.-checked
-  background-color: $table-row-highlighting-color
+tr.-checked,
+tr.-checked.-bright-row
+  background-color: $table-row-highlighting-color !important
+  outline: $table-row-highlighting-outline-color auto 4px
+
+  td
+    border-top: 1px solid $table-row-highlighting-color !important
+    border-bottom: 1px solid $table-row-highlighting-color !important
+    color: $body-font-color !important
+    a
+      color: $body-font-color !important
 
 #custom-options-table
   .custom-option-value

frontend/src/app/components/wp-table/configuration-modal/tabs/display-settings-tab.component.html

@@ -37,7 +37,7 @@
                  value="grouped"
                  name="display_mode_switch">
           <op-icon icon-classes="icon-group-by" [attr.icon-title]="text.label_group_by"></op-icon>
-          {{ text.label_group_by }}
+          {{ text.label_group_by }}&nbsp;
           <select (change)="updateGroup($event.target.value)"
                   id="selected_grouping"
                   name="selected_grouping"

frontend/src/app/components/wp-table/configuration-modal/tabs/highlighting-tab.component.html

@@ -21,7 +21,7 @@
                  (change)="updateMode('entire-row')"
                  [value]="true"
                  name="entire_row_switch">
-          {{ text.highlighting_mode.entire_row_by }}
+          {{ text.highlighting_mode.entire_row_by }} 
           <select (change)="updateMode($event.target.value)"
                   id="selected_attribute"
                   name="selected_attribute"

lib/open_project/design.rb

@@ -175,6 +175,7 @@ module OpenProject
       'relations-save-button--disabled-color'                => "$gray-dark",
       'table-row-border-color'                               => "#E7E7E7",
       'table-row-highlighting-color'                         => "#CCE6F7",
+      'table-row-highlighting-outline-color'                 => "#00A6FF",
       'table-row-relations-row-background-color'             => "rgba(220,235,244, 0.6)",
       'table-row-hierarchies-row-font-color'                 => "#6C7A89",
       'table-header-border-color'                            => "#D7D7D7",