fix: sidebar and shortcut modal (#493)

* fix: shortcut modal cmd and ctrl fix

* fix: sidebar collapse state ordering
This commit is contained in:
Anmol Singh Bhatia 2023-03-22 19:08:04 +05:30 committed by GitHub
parent 031f6443a0
commit f615f8ac0c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 22 additions and 9 deletions

View File

@ -52,6 +52,7 @@ export const ShortcutsModal: React.FC<Props> = ({ isOpen, setIsOpen }) => {
? true ? true
: false : false
); );
const { platform } = (window.navigator as any).userAgentData;
useEffect(() => { useEffect(() => {
if (!isOpen) setQuery(""); if (!isOpen) setQuery("");
@ -126,12 +127,18 @@ export const ShortcutsModal: React.FC<Props> = ({ isOpen, setIsOpen }) => {
{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">
{key === "Ctrl" ? ( {key === "Ctrl" ? (
platform === "Windows" ? (
<kbd className="rounded-sm border border-gray-200 bg-gray-100 px-2 py-1 text-sm font-medium text-gray-800">
{key}
</kbd>
) : (
<span className="flex h-full items-center rounded-sm border border-gray-200 bg-gray-100 p-2"> <span className="flex h-full items-center rounded-sm border border-gray-200 bg-gray-100 p-2">
<MacCommandIcon /> <MacCommandIcon />
</span> </span>
)
) : ( ) : (
<kbd className="rounded-sm border border-gray-200 bg-gray-100 px-2 py-1 text-sm font-medium text-gray-800"> <kbd className="rounded-sm border border-gray-200 bg-gray-100 px-2 py-1 text-sm font-medium text-gray-800">
{key === "Ctrl" ? <MacCommandIcon /> : key} {key}
</kbd> </kbd>
)} )}
</span> </span>
@ -165,12 +172,18 @@ 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" ? (
platform === "Windows" ? (
<kbd className="rounded-sm border border-gray-200 bg-gray-100 px-2 py-1 text-sm font-medium text-gray-800">
{key}
</kbd>
) : (
<span className="flex h-full items-center rounded-sm border border-gray-200 bg-gray-100 p-2"> <span className="flex h-full items-center rounded-sm border border-gray-200 bg-gray-100 p-2">
<MacCommandIcon /> <MacCommandIcon />
</span> </span>
)
) : ( ) : (
<kbd className="rounded-sm border border-gray-200 bg-gray-100 px-2 py-1 text-sm font-medium text-gray-800"> <kbd className="rounded-sm border border-gray-200 bg-gray-100 px-2 py-1 text-sm font-medium text-gray-800">
{key === "Ctrl" ? <MacCommandIcon /> : key} {key}
</kbd> </kbd>
)} )}
</span> </span>

View File

@ -57,7 +57,7 @@ export const WorkspaceHelpSection: FC<WorkspaceHelpSectionProps> = (props) => {
return ( return (
<div <div
className={`flex w-full items-center justify-between self-baseline border-t bg-white px-6 py-2 ${ className={`flex w-full items-center justify-between self-baseline border-t bg-white px-6 py-2 ${
sidebarCollapse ? "flex-col-reverse" : "" sidebarCollapse ? "flex-col" : ""
}`} }`}
> >
<button <button