fixed mobile appearance of dialogs

src/components/dialogs/BetterScrollDialog/styles.module.scss

@@ -11,7 +11,7 @@
   box-sizing: border-box;
 
   @include tablet {
-    padding: 70px 5px 5px 5px;
+    padding: 20px 0 0 0;
   }
 }
 

src/components/editors/EditorButtons/index.tsx

@@ -6,10 +6,12 @@ import { Padder } from '~/components/containers/Padder';
 import { EditorActionsPanel } from '~/components/editors/EditorActionsPanel';
 import { Button } from '~/components/input/Button';
 import { InputText } from '~/components/input/InputText';
+import { useWindowSize } from '~/hooks/dom/useWindowSize';
 import { useNodeFormContext } from '~/hooks/node/useNodeFormFormik';
 
 const EditorButtons: FC = () => {
   const { values, handleChange, isSubmitting } = useNodeFormContext();
+  const { isMobile } = useWindowSize();
 
   return (
     <Padder style={{ position: 'relative' }}>
@@ -28,7 +30,7 @@ const EditorButtons: FC = () => {
         </Filler>
 
         <Button
-          title="Сохранить"
+          title={isMobile ? undefined : 'Сохранить'}
           iconRight="check"
           color={values.is_promoted ? 'primary' : 'lab'}
           disabled={isSubmitting}

src/components/editors/ImageGrid/index.tsx

@@ -12,7 +12,7 @@ interface IProps {
 }
 
 const ImageGrid: FC<IProps> = ({ files, setFiles, locked }) => {
-  const { innerWidth } = useWindowSize();
+  const { isMobile } = useWindowSize();
 
   const onMove = useCallback(
     (newFiles: IFile[]) => {
@@ -34,7 +34,7 @@ const ImageGrid: FC<IProps> = ({ files, setFiles, locked }) => {
       onSortEnd={onMove}
       items={files}
       locked={locked}
-      size={innerWidth > 768 ? 220 : (innerWidth - 60) / 2}
+      size={!isMobile ? 220 : (innerWidth - 60) / 2}
     />
   );
 };

src/components/flow/FlowCell/index.tsx

@@ -39,7 +39,7 @@ const FlowCell: FC<Props> = ({
   canEdit = false,
   onChangeCellView,
 }) => {
-  const { innerWidth } = useWindowSize();
+  const { isMobile } = useWindowSize();
 
   const withText =
     ((!!flow.display && flow.display !== 'single') || !image) && flow.show_description && !!text;
@@ -54,11 +54,11 @@ const FlowCell: FC<Props> = ({
   const { isActive: isMenuActive, activate, ref, deactivate } = useClickOutsideFocus();
 
   const shadeSize = useMemo(() => {
-    const min = innerWidth < 768 ? 10 : 15;
-    const max = innerWidth < 768 ? 20 : 50;
+    const min = isMobile ? 10 : 15;
+    const max = isMobile ? 20 : 50;
 
     return withText ? min : max;
-  }, [withText, innerWidth]);
+  }, [withText, isMobile]);
 
   return (
     <div className={classNames(styles.cell, styles[flow.display || 'single'])} ref={ref as any}>

src/components/flow/FlowSwiperHero/index.tsx

@@ -34,13 +34,13 @@ const lazy = {
 };
 
 export const FlowSwiperHero: FC<Props> = ({ heroes }) => {
-  const { innerWidth } = useWindowSize();
+  const { isMobile } = useWindowSize();
   const { push } = useNavigation();
 
   const [controlledSwiper, setControlledSwiper] = useState<SwiperClass | undefined>(undefined);
   const [currentIndex, setCurrentIndex] = useState(heroes.length);
-  const preset = useMemo(() => (innerWidth <= 768 ? ImagePresets.cover : ImagePresets.small_hero), [
-    innerWidth,
+  const preset = useMemo(() => (isMobile ? ImagePresets.cover : ImagePresets.small_hero), [
+    isMobile,
   ]);
 
   const onNext = useCallback(() => {