feat: add IBM Plex font

Author: Elessar1802

index.css

@@ -2,6 +2,7 @@
 @import url('https://fonts.googleapis.com/css2?family=Inconsolata&display=swap');
 @import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@300;400;700;900&display=swap');
 @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:[email protected]&display=swap');
 
 /*
  * Although this is duplicated but this would help us with consistent loader in case

src/components/ResourceBrowser/ResourceList/ResourceFilterOptions.tsx

@@ -35,6 +35,7 @@ import {
     SegmentedControlProps,
     SelectPicker,
     SelectPickerOptionType,
+    SelectPickerProps,
     useAsync,
     useRegisterShortcut,
 } from '@devtron-labs/devtron-fe-common-lib'
@@ -181,6 +182,14 @@ const ResourceFilterOptions = ({
     const getResourcesToExport = (): Promise<Record<ResourceRecommenderHeaderType, string>[]> =>
         Promise.resolve(getResourceRecommendationsCSVData(filteredRows.map((row) => row.data)))
 
+    const onNamespaceFilterKeyDown: SelectPickerProps['onKeyDown'] = (e) => {
+        if (e.key === 'Escape' || e.key === 'Esc') {
+            e.preventDefault()
+            namespaceFilterRef.current?.blurInput()
+            namespaceFilterRef.current?.blur()
+        }
+    }
+
     return (
         <>
             {typeof renderRefreshBar === 'function' && renderRefreshBar()}
@@ -217,6 +226,7 @@ const ResourceFilterOptions = ({
                             handleSearchChange={handleOnChangeSearchText}
                             initialSearchText={searchText}
                             keyboardShortcut="/"
+                            containerClassName="w-250"
                         />
                     </div>
                 </div>
@@ -284,6 +294,7 @@ const ResourceFilterOptions = ({
                             icon={<NamespaceIcon className="fcn-6" />}
                             disabledTippyContent={NAMESPACE_NOT_APPLICABLE_TEXT}
                             shouldMenuAlignRight
+                            onKeyDown={onNamespaceFilterKeyDown}
                             keyboardShortcut="N"
                         />
                     </div>

src/css/base.scss

@@ -5182,3 +5182,7 @@ details[open] {
         contain: paint;
     }
 }
+
+kbd {
+    font-family: 'IBM Plex Sans';
+}

src/css/formulae.scss

@@ -246,6 +246,10 @@ $color-suffix: 00;
     font-family: 'Merriweather';
 }
 
+.font-ibm-plex-sans {
+    font-family: 'IBM Plex Sans';
+}
+
 .font-ibm-plex-mono {
     font-family: 'IBM Plex Mono';
 }