Client: Components: Fixed styles for hotkeys panel.

packages/client/src/components/panels/HotkeysPanel/StyledHotkeys.js

@@ -44,9 +44,19 @@ const StyledHotkeysPanel = styled.div`
   }
 
   .hotkeys_header {
-    padding: 0 16px;
     border-bottom: ${(props) => props.theme.filesPanels.sharing.borderBottom};
 
+    ${(props) =>
+      props.theme.interfaceDirection === "rtl"
+        ? css`
+            padding-right: 16px;
+            padding-left: 37px;
+          `
+        : css`
+            padding-left: 16px;
+            padding-right: 37px;
+          `}
+
     .hotkeys_heading {
       font-weight: 700;
       font-size: 18px;

packages/client/src/components/panels/HotkeysPanel/index.js

@@ -92,7 +92,9 @@ const HotkeyPanel = ({
         withoutBodyScroll={true}
       >
         <div className="hotkeys_header">
-          <Heading className="hotkeys_heading">{t("Common:Hotkeys")}</Heading>
+          <Heading className="hotkeys_heading" truncate>
+            {t("Common:Hotkeys")}
+          </Heading>
         </div>
         <StyledScrollbar ref={scrollRef}>
           <Heading className="hotkeys_sub-header">