CareUI: bg-white for secondary variant ButtonV2 (ohcnetwork#4626)

* Secondary button to have `bg-white` * consultation form, justify end cancel submit buttons
yogeshbhutkar · Jan 24, 2023 · a5ea73e · a5ea73e
1 parent e93d8eb
commit a5ea73e
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 4 deletions.
diff --git a/src/Components/Common/components/ButtonV2.tsx b/src/Components/Common/components/ButtonV2.tsx
@@ -151,7 +151,6 @@ export const Submit = ({ label = "Submit", ...props }: CommonButtonProps) => {
       id="submit"
       type="submit"
       className="w-full md:w-auto"
-      // Voluntarily setting children this way, so that it's overridable when using.
       children={
         <>
           <CareIcon className="care-l-check-circle text-lg" />
@@ -170,8 +169,8 @@ export const Cancel = ({ label = "Cancel", ...props }: CommonButtonProps) => {
       id="cancel"
       type="button"
       variant="secondary"
+      border
       className="w-full md:w-auto"
-      // Voluntarily setting children this way, so that it's overridable when using.
       children={
         <>
           <CareIcon className="care-l-times-circle text-lg" />

diff --git a/src/Components/Facility/ConsultationForm.tsx b/src/Components/Facility/ConsultationForm.tsx
@@ -1026,7 +1026,7 @@ export const ConsultationForm = (props: any) => {
         </div>
         {/* End of Telemedicine fields */}
 
-        <div className="mt-6 flex flex-col sm:flex-row gap-3 justify-between">
+        <div className="mt-6 flex flex-col sm:flex-row gap-3 justify-end">
           <Cancel
             onClick={() =>
               navigate(`/facility/${facilityId}/patient/${patientId}`)

diff --git a/src/style/CAREUI.css b/src/style/CAREUI.css
@@ -102,7 +102,7 @@
 .button-primary-ghost { @apply accent-primary-500 hover:bg-primary-100 text-primary-500 !important }
 .button-primary-border { @apply border border-primary-500 }
 
-.button-secondary-default { @apply accent-secondary-200 bg-secondary-300 hover:bg-secondary-200 text-secondary-800 !important }
+.button-secondary-default { @apply accent-secondary-200 bg-white hover:bg-secondary-200 text-secondary-800 !important }
 .button-secondary-ghost { @apply accent-secondary-200 hover:bg-secondary-100 text-secondary-700 !important }
 .button-secondary-border { @apply border border-secondary-300 }