refactor: increase memory cell background size

exuanbo · Dec 21, 2023 · d43431f · d43431f
1 parent 69c6e14
commit d43431f
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 10 deletions.
diff --git a/src/common/utils/classNames.ts b/src/common/utils/classNames.ts
@@ -5,7 +5,7 @@
 
 import type { Nullable } from './types'
 
-export type ClassItem = Nullable<string | Record<string, Nullable<boolean>>>
+export type ClassItem = Nullable<string | Record<string, Nullable<boolean>> | false>
 
 export const classNames = (...items: ClassItem[]): string => {
   let className = ''

diff --git a/src/features/memory/Memory.tsx b/src/features/memory/Memory.tsx
@@ -51,16 +51,16 @@ const Memory: FC = () => {
                 {row.map((value, colIndex) => {
                   const address = rowIndex * 0x10 + colIndex
                   return (
-                    <td
-                      key={colIndex}
-                      className={classNames('text-center', {
-                        'bg-blue-50': sp < address && address <= MAX_SP && isDataView,
-                      })}>
+                    <td key={colIndex} className="text-center">
                       <span
-                        className={classNames('px-1', {
-                          'rounded bg-green-100': address === ip,
-                          'rounded bg-blue-100': address === sp && isDataView,
-                        })}>
+                        className={classNames(
+                          'inline-block w-full rounded',
+                          { 'bg-green-100': address === ip },
+                          isDataView && {
+                            'bg-blue-100': address === sp,
+                            'bg-blue-50': address > sp && address <= MAX_SP,
+                          },
+                        )}>
                         {memoryView === MemoryView.Hexadecimal
                           ? (invariant(typeof value === 'number'), decToHex(value))
                           : value}