@astral/ui 4.99.2 → 4.100.0

package/node/components/NewStepper/Step/styles.js

@@ -90,7 +90,7 @@ exports.Wrapper = styled_1.styled.div `
 
           border-left: none;
 
-          ${({ theme }) => theme.breakpoints.down('sm')} {
+          ${({ theme }) => theme.breakpoints.down('mobile')} {
             padding-left: ${({ theme }) => theme.spacing(7)};
           }
         }
@@ -144,7 +144,7 @@ exports.Wrapper = styled_1.styled.div `
     }
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     &.${constants_4.stepClassnames.connectorArrow} {
       & .${constants_4.stepClassnames.content} {
         padding: ${({ theme }) => theme.spacing(2, 0)};
@@ -181,7 +181,7 @@ exports.IconWrapper = styled_1.styled.div `
       color: ${({ theme }) => theme.palette.warning[800]};
     }
 
-    ${({ theme }) => theme.breakpoints.down('sm')} {
+    ${({ theme }) => theme.breakpoints.down('mobile')} {
       width: 24px;
       height: 24px;
     }
@@ -193,7 +193,7 @@ exports.ArrowConnector = (0, styled_1.styled)(NextOutlineMd_1.NextOutlineMd) `
 
   color: ${({ theme }) => theme.palette.grey[400]};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     width: 24px;
     height: 24px;
   }
@@ -221,7 +221,7 @@ exports.LineConnector = styled_1.styled.div `
     border-top: unset;
     border-left: 2px solid ${({ theme }) => theme.palette.components.border.default};
 
-    ${({ theme }) => theme.breakpoints.down('sm')} {
+    ${({ theme }) => theme.breakpoints.down('mobile')} {
       margin-left: 11px;
     }
   }
@@ -239,7 +239,7 @@ exports.LabelWrapper = styled_1.styled.div `
 })};
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     white-space: nowrap;
   }
 `;
@@ -248,7 +248,7 @@ exports.StepContentWrapper = styled_1.styled.div `
   flex-direction: column;
   gap: ${({ theme }) => theme.spacing(1)};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     gap: ${({ theme }) => theme.microSpacing(1)};
   }
 `;
@@ -268,7 +268,7 @@ exports.StyledButton = (0, styled_1.styled)(Button_1.Button) `
   background: transparent;
   border: 0;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     gap: ${({ theme }) => theme.microSpacing(1)};
 
     height: auto;

package/node/components/NewStepper/styles.js

@@ -31,7 +31,7 @@ exports.Wrapper = styled_1.styled.div `
     }
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     /* Убираем видимую полосу прокрутки в firefox */
     scrollbar-width: none;
 

package/node/components/NotFoundPage/styles.js

@@ -16,7 +16,7 @@ exports.Wrapper = styled_1.styled.div `
   text-align: center;
 `;
 exports.Header = (0, styled_1.styled)(Typography_1.Typography) `
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     font-size: ${({ theme }) => theme.typography.h4.fontSize};
     line-height: ${({ theme }) => theme.typography.h4.lineHeight};
   }
@@ -24,7 +24,7 @@ exports.Header = (0, styled_1.styled)(Typography_1.Typography) `
 exports.Subheader = (0, styled_1.styled)(Typography_1.Typography) `
   margin-top: ${({ theme }) => theme.spacing(-2)};
   margin-bottom: ${({ theme }) => theme.spacing(2)};
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     font-size: ${({ theme }) => theme.typography.subtitle1.fontSize};
     line-height: ${({ theme }) => theme.typography.subtitle1.lineHeight};
   }
@@ -33,13 +33,13 @@ exports.Image = styled_1.styled.img `
   width: 500px;
   height: 232px;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     width: 326px;
     height: 166px;
   }
 `;
 exports.StyledPageContent = (0, styled_1.styled)(PageContent_1.PageContent) `
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     margin-top: ${({ theme }) => theme.spacing(4)};
   }
 `;

package/node/components/Notification/NotificationContainer/styles.js

@@ -38,7 +38,7 @@ const leaveInMobile = (0, styled_1.keyframes) `
 exports.Wrapper = (0, styled_1.styled)('div', {
     shouldForwardProp: (prop) => !['$isBanner'].includes(prop),
 }) `
-  ${({ theme }) => theme.breakpoints.up('sm')} {
+  ${({ theme }) => theme.breakpoints.up('mobile')} {
     ${({ $isBanner, theme }) => $isBanner &&
     `
         position: fixed;
@@ -50,7 +50,7 @@ exports.Wrapper = (0, styled_1.styled)('div', {
   }
 
   .Toastify__toast-container {
-    ${({ theme }) => theme.breakpoints.down('sm')} {
+    ${({ theme }) => theme.breakpoints.down('mobile')} {
       padding: ${({ theme }) => theme.spacing(4)};
     }
   }
@@ -59,7 +59,7 @@ exports.Wrapper = (0, styled_1.styled)('div', {
     animation: ${leaveIn} ease-in-out ${({ theme }) => theme.transitions.duration.standard}ms;
     animation-fill-mode: both;
 
-    ${({ theme }) => theme.breakpoints.down('sm')} {
+    ${({ theme }) => theme.breakpoints.down('mobile')} {
       animation: ${leaveInMobile} ease-in-out ${({ theme }) => theme.transitions.duration.standard}ms;
       animation-fill-mode: both;
     }
@@ -89,14 +89,14 @@ exports.Wrapper = (0, styled_1.styled)('div', {
       width: 100%;
       height: 3px;
     }
-      ${({ theme }) => theme.breakpoints.up('sm')} {
+      ${({ theme }) => theme.breakpoints.up('mobile')} {
       min-height: ${constants_1.NOTIFY_HEIGHT};
     }
-    ${({ theme }) => theme.breakpoints.down('sm')} {
+    ${({ theme }) => theme.breakpoints.down('mobile')} {
       min-height: ${constants_1.NOTIFY_HEIGHT_MOBILE};
     }
 
-    ${({ theme }) => theme.breakpoints.down('sm')} {
+    ${({ theme }) => theme.breakpoints.down('mobile')} {
       margin-bottom: ${({ theme }) => theme.spacing(3)};
     }
 
@@ -140,7 +140,7 @@ exports.Inner = (0, styled_1.styled)(react_toastify_next_1.ToastContainer, {
     shouldForwardProp: (prop) => !['$isBanner'].includes(prop),
 }) `
   min-width: 400px;
-  ${({ theme }) => theme.breakpoints.up('sm')} {
+  ${({ theme }) => theme.breakpoints.up('mobile')} {
     ${({ $isBanner, theme }) => $isBanner &&
     `
         position: relative !important;
@@ -153,7 +153,7 @@ exports.Inner = (0, styled_1.styled)(react_toastify_next_1.ToastContainer, {
       `}
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     width: 100%;
     min-width: unset;
     max-width: unset;

package/node/components/Notification/NotificationStackContainer/styles.js

@@ -57,7 +57,7 @@ exports.Wrapper = styled_1.styled.div `
 
   width: 432px;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     inset: 0 0 auto;
 
     width: 100%;
@@ -83,13 +83,13 @@ exports.Wrapper = styled_1.styled.div `
     }
     /* stylelint-enable plugin/no-unsupported-browser-features */
 
-    ${({ theme }) => theme.breakpoints.up('sm')} {
+    ${({ theme }) => theme.breakpoints.up('mobile')} {
       .${constants_1.notifyClassnames.stackHost} .Toastify {
         overflow: hidden;
       }
     }
 
-    ${({ theme }) => theme.breakpoints.down('sm')} {
+    ${({ theme }) => theme.breakpoints.down('mobile')} {
       justify-content: flex-start;
 
       height: auto;
@@ -192,10 +192,10 @@ exports.Wrapper = styled_1.styled.div `
       width: 100%;
       height: 3px;
     }
-    ${({ theme }) => theme.breakpoints.up('sm')} {
+    ${({ theme }) => theme.breakpoints.up('mobile')} {
       min-height: ${constants_1.NOTIFY_HEIGHT};
     }
-    ${({ theme }) => theme.breakpoints.down('sm')} {
+    ${({ theme }) => theme.breakpoints.down('mobile')} {
       min-height: ${constants_1.NOTIFY_HEIGHT_MOBILE};
     }
 
@@ -245,7 +245,7 @@ exports.Wrapper = styled_1.styled.div `
   }
 
   /* Стили для уведомлений в стеке */
-  ${({ theme }) => theme.breakpoints.up('sm')} { 
+  ${({ theme }) => theme.breakpoints.up('mobile')} { 
     .${constants_1.notifyClassnames.stack} .${constants_1.notifyClassnames.root} {
       position: relative;
       transform: scale(var(--s));
@@ -281,7 +281,7 @@ exports.Wrapper = styled_1.styled.div `
   }
 
   /* Мобильный стек в свёрнутом виде: последний в DOM (самый новый) — сверху; остальные без участия в раскладке */
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     &:not(.${constants_1.notifyClassnames.container}) {
       .${constants_1.notifyClassnames.stack} {
         position: relative;
@@ -413,7 +413,7 @@ exports.Inner = (0, styled_1.styled)(react_toastify_next_1.ToastContainer) `
   }
 
   /* Только устройства с реальным hover и ≥sm — иначе на touch :hover залипает и ломает мобильный стек */
-  ${({ theme }) => theme.breakpoints.up('sm')} {
+  ${({ theme }) => theme.breakpoints.up('mobile')} {
     @media (hover: hover) and (pointer: fine) {
       &:hover {
         overflow: hidden auto;
@@ -447,7 +447,7 @@ exports.Inner = (0, styled_1.styled)(react_toastify_next_1.ToastContainer) `
     }
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     min-width: unset;
     max-width: 100%;
     padding-right: ${({ theme }) => theme.spacing(2)} !important;
@@ -496,7 +496,7 @@ exports.CloseButton = (0, styled_1.styled)(Button_1.Button) `
     opacity: 0;
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     width: calc(100% - ${({ theme }) => theme.spacing(4)});
     margin: ${({ theme }) => theme.spacing(0, 5, 2, 5)};
   }

package/node/components/Notification/NotificationTemplate/styles.js

@@ -21,7 +21,7 @@ exports.Wrapper = styled_1.styled.article `
 
   background: ${({ theme }) => theme.palette.background.default};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     padding: ${({ theme }) => theme.spacing(2, 3)};
   }
 `;
@@ -32,7 +32,7 @@ exports.Header = styled_1.styled.header `
   width: 100%;
   min-height: 24px;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     .${constants_1.buttonClassnames.root} {
       width: 24px;
       height: 24px;
@@ -55,7 +55,7 @@ exports.IconWrapper = styled_1.styled.div `
 
   margin-right: ${({ theme }) => theme.spacing(2)};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     .${constants_2.svgIconClassnames.root} {
       width: 24px;
       height: 24px;

package/node/components/NotificationList/ListItem/styles.js

@@ -43,7 +43,7 @@ exports.Wrapper = styled_1.styled.li `
     background-color: ${({ theme }) => theme.palette.grey[300]};
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     grid-template-columns: 8px 1fr;
 
     padding: ${({ theme }) => theme.spacing(4)};

package/node/components/NotificationList/SettingsButton/styles.js

@@ -11,7 +11,7 @@ exports.Wrapper = styled_1.styled.div `
   margin-right: ${({ theme }) => theme.spacing(1)};
 `;
 exports.StyledDivider = (0, styled_1.styled)(Divider_1.Divider) `
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
   }
 `;

package/node/components/NotificationList/styles.js

@@ -20,7 +20,7 @@ exports.TabsWrapper = (0, styled_1.styled)(SideDialogContent_1.SideDialogContent
   max-height: 50px;
   padding: ${({ theme }) => theme.spacing(3, 6, 0)};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     min-height: unset;
     max-height: unset;
     padding: ${({ theme }) => theme.spacing(3, 4, 0)};
@@ -33,12 +33,12 @@ exports.ContentWrapper = (0, styled_1.styled)(SideDialogContent_1.SideDialogCont
   padding-right: ${({ theme }) => `calc(${theme.spacing(6)} - ${constants_2.SCROLLBAR_SIZE})`};
   padding-bottom: ${({ theme }) => theme.spacing(1)};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     padding: ${({ theme }) => theme.spacing(0)};
   }
 `;
 exports.StyledSideDialogActions = (0, styled_1.styled)(SideDialogActions_1.SideDialogActions) `
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     border-top-left-radius: ${({ theme }) => theme.shape.large};
     border-top-right-radius: ${({ theme }) => theme.shape.large};
 
@@ -51,7 +51,7 @@ exports.StyledSideDialogActions = (0, styled_1.styled)(SideDialogActions_1.SideD
   }
 `;
 exports.StyledSideDialog = (0, styled_1.styled)(SideDialog_1.SideDialog) `
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     & .${Drawer_1.drawerClasses.paper} {
       height: calc(100vh - ${constants_1.OFFSET_TOP_SCREEN});
 

package/node/components/PageAside/MobileAsideButton/styles.js

@@ -9,7 +9,7 @@ const styled_1 = require("../../styled");
 exports.StyledButton = (0, styled_1.styled)(Button_1.Button) `
   display: none;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: flex;
     order: 3;
 

package/node/components/PageAside/styles.js

@@ -26,14 +26,14 @@ exports.Wrapper = styled_1.styled.aside `
     padding: ${({ theme }) => theme.spacing(4)};
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
   }
 `;
 exports.MobileAsideHeader = styled_1.styled.div `
   display: none;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: block;
     order: 3;
 
@@ -55,7 +55,7 @@ exports.StyledDivider = (0, styled_1.styled)(Divider_1.Divider) `
 exports.MobileAsideNavigation = styled_1.styled.div `
   display: none;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: block;
   }
 `;

package/node/components/PageAsideBlock/styles.js

@@ -21,7 +21,7 @@ exports.Wrapper = styled_1.styled.div `
     }
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     padding: ${({ theme }) => theme.spacing(4, 0)};
 
     :first-of-type {
@@ -46,7 +46,7 @@ exports.StyledDivider = (0, styled_1.styled)(Divider_2.Divider, {
     width: ${({ $isFullWidth, theme }) => ($isFullWidth ? `calc(100% + ${theme.spacing(10)})` : '100%')};
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     left: ${({ $isFullWidth, theme }) => $isFullWidth ? `${theme.spacing(-4)}` : '0'};
 
     width: ${({ $isFullWidth, theme }) => $isFullWidth ? `calc(100% + ${theme.spacing(8)})` : '100%'};

package/node/components/PageAsideNavigation/PageAsideNavigationItem/styles.js

@@ -61,7 +61,7 @@ exports.Wrapper = styled_1.styled.li `
   }
 
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     height: 40px;
     -webkit-tap-highlight-color: transparent;
     
@@ -110,7 +110,7 @@ exports.IconWrapper = styled_1.styled.div `
     height: 20px;
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
   }
 `;

package/node/components/PageAsideNavigation/styles.js

@@ -7,7 +7,7 @@ exports.Wrapper = styled_1.styled.div `
   flex-direction: column;
   gap: ${({ theme }) => theme.spacing(10)};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     gap: ${({ theme }) => theme.spacing(3)};
 
     width: 100%;
@@ -27,7 +27,7 @@ exports.NavigationList = styled_1.styled.ul `
 
   list-style: none;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     /* Убираем видимую полосу прокрутки в firefox */
     scrollbar-width: none;
 
@@ -45,7 +45,7 @@ exports.NavigationList = styled_1.styled.ul `
   }
 `;
 exports.AddonNavigationWrapper = styled_1.styled.div `
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     padding: ${({ theme }) => theme.spacing(0, 4)};
   }
 `;

package/node/components/PageContent/PageContentHeader/Description/styles.js

@@ -7,7 +7,7 @@ exports.SkeletonWrapper = styled_1.styled.div `
 
   padding: ${({ theme }) => theme.spacing(1, 0)};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
   }
 `;

package/node/components/PageContent/PageContentHeader/PageContentHeaderActions/MobilePageContentHeaderActions/styles.js

@@ -19,7 +19,7 @@ exports.AddonInfoWrapper = styled_1.styled.div `
   gap: ${({ theme }) => theme.spacing(3)};
 `;
 exports.StyledIconButton = (0, styled_1.styled)(IconButton_1.IconButton) `
-  ${({ theme }) => theme.breakpoints.up('sm')} {
+  ${({ theme }) => theme.breakpoints.up('mobile')} {
     display: none;
   }
 `;
@@ -33,12 +33,12 @@ exports.ActionsWrapper = styled_1.styled.div `
   }
 `;
 exports.StyledMainActions = (0, styled_1.styled)(PageActions_1.MainActions) `
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     padding-bottom: 0;
   }
 `;
 exports.StyledSkeleton = (0, styled_1.styled)(Skeleton_1.Skeleton) `
-  ${({ theme }) => theme.breakpoints.up('sm')} {
+  ${({ theme }) => theme.breakpoints.up('mobile')} {
     display: none;
   }
 `;

package/node/components/PageContent/PageContentHeader/PageContentHeaderActions/PageContentHeaderActionsSkeleton/styles.js

@@ -9,7 +9,7 @@ exports.StyledSkeleton = (0, styled_1.styled)(Skeleton_1.Skeleton) `
   width: 180px;
   height: 32px;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     width: 40px;
     height: 40px;
   }

package/node/components/PageContent/PageContentHeader/Title/styles.js

@@ -14,7 +14,7 @@ exports.StyledSkeleton = (0, styled_1.styled)(Skeleton_1.Skeleton) `
   width: 200px;
   height: 20px;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     width: 100%;
   }
 `;

package/node/components/PageContent/PageContentHeader/styles.js

@@ -13,7 +13,7 @@ exports.Wrapper = styled_1.styled.header `
 
   border-bottom: 1px solid ${({ theme }) => theme.palette.components.border.default};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     gap: ${({ theme }) => theme.spacing(5)};
 
     height: 48px;
@@ -28,7 +28,7 @@ exports.TitleBlock = styled_1.styled.div `
   display: flex;
   flex-direction: column;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     width: 100%;
 
     & .${constants_1.pageContentHeaderClassnames.description} {

package/node/components/PageContent/styles.js

@@ -21,7 +21,7 @@ exports.Wrapper = (0, styled_1.styled)('article', {
     ? `1px solid ${theme.palette.components.border.default}`
     : 'none'};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     overflow: unset;
     flex-grow: 1;
     order: 4;
@@ -76,7 +76,7 @@ exports.Content = styled_1.styled.div `
     }
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     scrollbar-gutter: unset;
 
     overflow: hidden;
@@ -115,14 +115,14 @@ exports.Content = styled_1.styled.div `
 
     padding-right: 0;
 
-    ${({ theme }) => theme.breakpoints.down('sm')} {
+    ${({ theme }) => theme.breakpoints.down('mobile')} {
       scrollbar-gutter: auto;
 
       padding: ${({ theme }) => theme.spacing(4, 4, 3)};
     }
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     &&.${constants_3.pageContentClassnames.withPdfViewer} {
       margin: 0;
       padding-top: 0;

package/node/components/PageHeader/HeaderContent/Description/styles.js

@@ -10,7 +10,7 @@ exports.StyledTypography = (0, styled_1.styled)(Typography_1.Typography) `
 
   padding-top: ${({ theme }) => theme.spacing(1)};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
   }
 `;
@@ -20,7 +20,7 @@ exports.StyledSkeleton = (0, styled_1.styled)(Skeleton_1.Skeleton) `
 
   margin: ${({ theme }) => theme.spacing(1, 0)};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
   }
 `;

package/node/components/PageHeader/HeaderContent/styles.js

@@ -13,7 +13,7 @@ exports.BreadcrumbsWrapper = styled_1.styled.div `
     display: none;
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
   }
 `;
@@ -27,7 +27,7 @@ exports.TabsWrapper = styled_1.styled.div `
     display: none;
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     padding: ${({ theme }) => theme.spacing(0, 0, 4, 0)};
 
     .${Tabs_1.tabsClassnames.root} {
@@ -45,14 +45,14 @@ exports.PageSubheader = styled_1.styled.div `
     display: none;
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     padding: ${({ theme }) => theme.spacing(0, 4, 4, 4)};
   }
 `;
 exports.DesktopTitleWrapper = styled_1.styled.div `
   display: contents;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
 
     min-height: 48px;

package/node/components/PageHeader/MobilePageActions/styles.js

@@ -35,7 +35,7 @@ const PageActions_1 = require("../PageActions");
 exports.Wrapper = styled_1.styled.div `
   display: none;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     position: sticky;
     z-index: ${({ theme }) => theme.zIndex.speedDial};
     bottom: 0;
@@ -60,7 +60,7 @@ exports.Wrapper = styled_1.styled.div `
   }
 `;
 exports.ShowMoreButton = (0, styled_1.styled)(Button_1.default) `
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: flex;
 
     height: 40px;
@@ -91,7 +91,7 @@ exports.SecondaryActionsWrapper = (0, styled_1.styled)('div') `
 exports.StyledMainActions = (0, styled_1.styled)(PageActions_1.MainActions, {
     shouldForwardProp: (prop) => !['$isVisibleShowMoreButton'].includes(prop),
 }) `
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     padding-bottom: ${({ theme, $isVisibleShowMoreButton }) => $isVisibleShowMoreButton ? theme.spacing(2) : 0};
   }
 `;

package/node/components/PageHeader/PageActions/MainActions/styles.js

@@ -8,7 +8,7 @@ exports.Wrapper = styled_1.styled.div `
   display: flex;
   gap: ${({ theme, $spacing }) => theme.spacing($spacing)};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     flex-wrap: wrap;
     gap: ${({ theme }) => theme.spacing(2)};
     order: -1;

package/node/components/PageHeader/PageActions/SecondaryActions/styles.js

@@ -9,14 +9,14 @@ exports.StyledMobileButton = (0, styled_1.styled)(Button_1.Button) `
 
   width: 100%;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: flex;
   }
 `;
 exports.StyledSecondaryActions = (0, styled_1.styled)(ActionGroup_1.SecondaryActions) `
   display: flex;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
   }
 `;