diff --git a/packages/app/src/components/quick-search/style.ts b/packages/app/src/components/quick-search/style.ts
index 024f5e249b..86870c5b36 100644
--- a/packages/app/src/components/quick-search/style.ts
+++ b/packages/app/src/components/quick-search/style.ts
@@ -13,7 +13,7 @@ export const StyledContent = styled('div')(({ theme }) => {
     letterSpacing: '0.06em',
     '[cmdk-group-heading]': {
       margin: '5px 16px',
-      fontSize: theme.font.sm,
+      fontSize: theme.font.base,
       fontWeight: '500',
     },
     '[aria-selected="true"]': {
@@ -28,7 +28,7 @@ export const StyledJumpTo = styled('div')(({ theme }) => {
     ...displayFlex('center', 'start'),
     flexDirection: 'column',
     padding: '10px 10px 10px 0',
-    fontSize: theme.font.sm,
+    fontSize: theme.font.base,
     strong: {
       fontWeight: '500',
       marginBottom: '10px',
@@ -41,7 +41,7 @@ export const StyledNotFound = styled('div')(({ theme }) => {
     ...displayFlex('center', 'center'),
     flexDirection: 'column',
     padding: '5px 16px',
-    fontSize: theme.font.sm,
+    fontSize: theme.font.base,
     span: {
       width: '100%',
       fontWeight: '500',
@@ -75,7 +75,7 @@ export const StyledInputContent = styled('div')(({ theme }) => {
 export const StyledShortcut = styled('div')(({ theme }) => {
   return {
     color: theme.colors.placeHolderColor,
-    fontSize: theme.font.sm,
+    fontSize: theme.font.base,
     whiteSpace: 'nowrap',
   };
 });
@@ -109,7 +109,7 @@ export const StyledModalDivider = styled('div')(({ theme }) => {
 
 export const StyledModalFooter = styled('div')(({ theme }) => {
   return {
-    fontSize: theme.font.sm,
+    fontSize: theme.font.base,
     lineHeight: '22px',
     marginBottom: '8px',
     textAlign: 'center',
@@ -127,7 +127,7 @@ export const StyledModalFooterContent = styled.button(({ theme }) => {
   return {
     width: '612px',
     height: '32px',
-    fontSize: theme.font.sm,
+    fontSize: theme.font.base,
     lineHeight: '22px',
     textAlign: 'center',
     ...displayFlex('center', 'center'),
@@ -144,7 +144,7 @@ export const StyledListItem = styled.button(({ theme }) => {
   return {
     width: '612px',
     height: '32px',
-    fontSize: theme.font.sm,
+    fontSize: theme.font.base,
     color: 'inherit',
     paddingLeft: '12px',
     borderRadius: '5px',
diff --git a/packages/component/src/styles/helper.ts b/packages/component/src/styles/helper.ts
index 20e397f741..3e4ad4a642 100644
--- a/packages/component/src/styles/helper.ts
+++ b/packages/component/src/styles/helper.ts
@@ -60,8 +60,8 @@ export const absoluteCenter = ({
     position: 'absolute',
     left: left ? left : horizontal ? '50%' : 'auto',
     top: top ? top : vertical ? '50%' : 'auto',
-    right: right ? right : horizontal ? 'auto' : 'auto',
-    bottom: bottom ? bottom : vertical ? 'auto' : 'auto',
+    right: right ? right : 'auto',
+    bottom: bottom ? bottom : 'auto',
     transform: `translate(${horizontal ? '-50%' : '0'}, ${
       vertical ? '-50%' : '0'
     })`,
@@ -92,8 +92,8 @@ export const fixedCenter = ({
     position: 'fixed',
     left: left ? left : horizontal ? '50%' : 'auto',
     top: top ? top : vertical ? '50%' : 'auto',
-    right: right ? right : horizontal ? 'auto' : 'auto',
-    bottom: bottom ? bottom : vertical ? 'auto' : 'auto',
+    right: right ? right : 'auto',
+    bottom: bottom ? bottom : 'auto',
     transform: `translate(${horizontal ? '-50%' : '0'}, ${
       vertical ? '-50%' : '0'
     })`,