Add ContrastChecker

WebDevStudios · Sep 9, 2020 · 5e48cf6 · 5e48cf6
1 parent 9d029ee
commit 5e48cf6
Showing 1 changed file with 12 additions and 2 deletions.
diff --git a/src/blocks/accordions/edit.js b/src/blocks/accordions/edit.js
@@ -1,5 +1,6 @@
-import { useEffect } from '@wordpress/element';
+import { useEffect, Platform } from '@wordpress/element';
 import {
+	ContrastChecker,
 	InnerBlocks,
 	PanelColorSettings,
 	InspectorControls,
@@ -103,7 +104,16 @@ function Edit( props ) {
 							label: __( 'Background Color', 'wdsblocks' ),
 						},
 					] }
-				/>
+				>
+					{ 'web' === Platform.OS &&
+						!! fontColor?.color &&
+						!! backgroundColor?.color && (
+							<ContrastChecker
+								backgroundColor={ backgroundColor.color }
+								textColor={ fontColor.color }
+							/>
+						) }
+				</PanelColorSettings>
 				<PanelBody title={ __( 'Settings', 'wdsblocks' ) }>
 					<BaseControl
 						label={ __( 'Expand First Accordion', 'wdsblocks' ) }