(feat) Minimal tweaks to the vitals and biometrics header and tiles

openmrs · Oct 11, 2024 · f8937d4 · f8937d4
1 parent d1833f1
commit f8937d4
Show file tree

Hide file tree

Showing 5 changed files with 8 additions and 7 deletions.
diff --git a/packages/esm-patient-vitals-app/src/biometrics/biometrics-base.component.tsx b/packages/esm-patient-vitals-app/src/biometrics/biometrics-base.component.tsx
@@ -1,16 +1,16 @@
 import React, { useCallback, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Button, ContentSwitcher, DataTableSkeleton, IconSwitch, InlineLoading } from '@carbon/react';
-import { Add, ChartLineSmooth, Table } from '@carbon/react/icons';
+import { Add, Analytics, Table } from '@carbon/react/icons';
 import { formatDatetime, parseDate, useConfig, useLayoutType } from '@openmrs/esm-framework';
 import { CardHeader, EmptyState, ErrorState, useVisitOrOfflineVisit } from '@openmrs/esm-patient-common-lib';
 import { launchVitalsAndBiometricsForm } from '../utils';
 import { useVitalsConceptMetadata, useVitalsAndBiometrics, withUnit } from '../common';
 import { type ConfigObject } from '../config-schema';
 import BiometricsChart from './biometrics-chart.component';
 import PaginatedBiometrics from './paginated-biometrics.component';
-import styles from './biometrics-base.scss';
 import type { BiometricsTableHeader, BiometricsTableRow } from './types';
+import styles from './biometrics-base.scss';
 
 interface BiometricsBaseProps {
   pageSize: number;
@@ -101,7 +101,7 @@ const BiometricsBase: React.FC<BiometricsBaseProps> = ({ patientUuid, pageSize,
                 <Table size={16} />
               </IconSwitch>
               <IconSwitch name="chartView" text="Chart view">
-                <ChartLineSmooth size={16} />
+                <Analytics size={16} />
               </IconSwitch>
             </ContentSwitcher>
             <>

diff --git a/packages/esm-patient-vitals-app/src/vitals-and-biometrics-header/vitals-header-item.scss b/packages/esm-patient-vitals-app/src/vitals-and-biometrics-header/vitals-header-item.scss
@@ -7,7 +7,7 @@
   display: flex;
   flex-flow: row wrap;
   flex-direction: column;
-  margin: layout.$spacing-03 0;
+  margin: layout.$spacing-03 0 0;
   min-inline-size: max-content;
 }
 

diff --git a/packages/esm-patient-vitals-app/src/vitals-and-biometrics-header/vitals-header.scss b/packages/esm-patient-vitals-app/src/vitals-and-biometrics-header/vitals-header.scss
@@ -32,7 +32,7 @@
 .heading {
   @include type.type-style('heading-compact-02');
   margin-right: layout.$spacing-03;
-  color: $text-02;
+  color: $ui-05 !important;
 }
 
 .rowContainer {

diff --git a/packages/esm-patient-vitals-app/src/vitals/paginated-vitals.scss b/packages/esm-patient-vitals-app/src/vitals/paginated-vitals.scss
@@ -74,6 +74,7 @@
 .high,
 .low {
   @include type.type-style('heading-compact-01');
+  color: colors.$gray-100 !important;
 }
 
 .criticallyLow::after {

diff --git a/packages/esm-patient-vitals-app/src/vitals/vitals-overview.component.tsx b/packages/esm-patient-vitals-app/src/vitals/vitals-overview.component.tsx
@@ -2,7 +2,7 @@ import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next';
 import { useReactToPrint } from 'react-to-print';
 import { Button, ContentSwitcher, DataTableSkeleton, IconSwitch, InlineLoading } from '@carbon/react';
-import { Add, ChartLineSmooth, Table, Printer } from '@carbon/react/icons';
+import { Add, Analytics, Table, Printer } from '@carbon/react/icons';
 import { CardHeader, EmptyState, ErrorState, useVisitOrOfflineVisit } from '@openmrs/esm-patient-common-lib';
 import {
   age,
@@ -198,7 +198,7 @@ const VitalsOverview: React.FC<VitalsOverviewProps> = ({ patientUuid, pageSize,
                       <Table size={16} />
                     </IconSwitch>
                     <IconSwitch name="chartView" text="Chart view">
-                      <ChartLineSmooth size={16} />
+                      <Analytics size={16} />
                     </IconSwitch>
                   </ContentSwitcher>
                   <>