Adjust hover over and carry changes into IR generation display

OHDSI · Nov 11, 2024 · 3074d36 · 3074d36
1 parent 81f7bf4
commit 3074d36
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 6 deletions.
diff --git a/js/pages/cohort-definitions/cohort-definition-manager.css b/js/pages/cohort-definitions/cohort-definition-manager.css
@@ -111,9 +111,12 @@ table.sources-table tr {
 table.sources-table tr:hover {
     background-color: #f2f2f2; 
 }
+table.sources-table tr:hover td {
+    border-top: solid 1px #ccc;      
+    border-bottom: solid 1px #ccc;      
+}
 table.sources-table tbody td {
     padding: 0 10px 4px;
-    border-bottom: solid 1px #ccc;
 }
 .generation-buttons {
     white-space: nowrap;

diff --git a/js/pages/incidence-rates/components/iranalysis/components/results.js b/js/pages/incidence-rates/components/iranalysis/components/results.js
@@ -116,6 +116,10 @@ define([
 			this.showOnlySourcesWithResults = ko.observable(false);
 			this.sourcesTableOptions = commonUtils.getTableOptions('S');
 			this.sourcesColumns = [{
+				sortable: false,
+				className: 'generation-buttons-column',
+				render: () => `<span data-bind="template: { name: 'generation-buttons', data: $data }"></span>`
+			}, {
 				title: ko.i18n('cohortDefinitions.cohortDefinitionManager.panels.sourceName', 'Source Name'),
 				render: (s,p,d) => `${d.source.sourceName}`
 			}, {
@@ -144,10 +148,6 @@ define([
 			}, {
 				title: ko.i18n('ir.results.duration', 'Duration'),
 				render: (s,p,d) => d.info() ? `${this.msToTime(d.info().executionInfo.executionDuration)}` : `n/a`
-			}, {
-				sortable: false,
-				className: 'generation-buttons-column',
-				render: () => `<span data-bind="template: { name: 'generation-buttons', data: $data }"></span>`
 			}];
 		}
 

diff --git a/js/pages/incidence-rates/components/iranalysis/components/results.less b/js/pages/incidence-rates/components/iranalysis/components/results.less
@@ -25,8 +25,18 @@
     tbody tr td {
       padding: 0 10px 4px;
     }
+    tr {
+      transition: background-color 0.3s ease; /* Smooth transition for hover effect */
+    }
+    tr:hover {
+      background-color: #f2f2f2; 
+    }
+    tr:hover td {
+      border-top: solid 1px #ccc;      
+      border-bottom: solid 1px #ccc;      
+    }
     .generation-buttons-column {
-      text-align: right;
+      text-align: left;
     }
     .generation-buttons {
       white-space: nowrap;