style: shortcut modal theming

This commit is contained in:
anmolsinghbhatia 2023-05-01 14:19:54 +05:30
parent a71fc669c7
commit fe68661c25

View File

@ -123,7 +123,9 @@ export const ShortcutsModal: React.FC<Props> = ({ isOpen, setIsOpen }) => {
<div key={shortcut.keys} className="flex w-full flex-col"> <div key={shortcut.keys} className="flex w-full flex-col">
<div className="flex flex-col gap-y-3"> <div className="flex flex-col gap-y-3">
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<p className="text-sm text-brand-secondary">{shortcut.description}</p> <p className="text-sm text-brand-secondary">
{shortcut.description}
</p>
<div className="flex items-center gap-x-2.5"> <div className="flex items-center gap-x-2.5">
{shortcut.keys.split(",").map((key, index) => ( {shortcut.keys.split(",").map((key, index) => (
<span key={index} className="flex items-center gap-1"> <span key={index} className="flex items-center gap-1">
@ -132,7 +134,7 @@ export const ShortcutsModal: React.FC<Props> = ({ isOpen, setIsOpen }) => {
<MacCommandIcon /> <MacCommandIcon />
</span> </span>
) : ( ) : (
<kbd className="rounded-sm border border-brand-base bg-brand-surface-1 px-2 py-1 text-sm font-medium text-gray-800"> <kbd className="rounded-sm border border-brand-base bg-brand-surface-1 px-2 py-1 text-sm font-medium text-brand-base">
{key === "Ctrl" ? <MacCommandIcon /> : key} {key === "Ctrl" ? <MacCommandIcon /> : key}
</kbd> </kbd>
)} )}
@ -167,7 +169,7 @@ export const ShortcutsModal: React.FC<Props> = ({ isOpen, setIsOpen }) => {
{keys.split(",").map((key, index) => ( {keys.split(",").map((key, index) => (
<span key={index} className="flex items-center gap-1"> <span key={index} className="flex items-center gap-1">
{key === "Ctrl" ? ( {key === "Ctrl" ? (
<span className="flex h-full items-center rounded-sm border border-brand-base text-brand-secondary bg-brand-surface-1 p-2"> <span className="flex h-full items-center rounded-sm border border-brand-base bg-brand-surface-1 p-2 text-brand-secondary">
<MacCommandIcon /> <MacCommandIcon />
</span> </span>
) : ( ) : (