feat: added '0' vertical offset for header block (#751)

gravity-ui · Jan 9, 2024 · 1101da9 · 1101da9
1 parent 27afd6e
commit 1101da9
Show file tree

Hide file tree

Showing 4 changed files with 4 additions and 3 deletions.
diff --git a/src/blocks/Header/__stories__/Header.mdx b/src/blocks/Header/__stories__/Header.mdx
@@ -44,7 +44,7 @@ There could be only one one Header block on the page.
 
 `theme?: default | dark` — Sets the text color (black by default, white for the dark background).
 
-`verticalOffset?: 's' | 'm' | 'l' | 'xl'` — Top and bottom offsets from the text. (Values: 's' - 48px, 'm' - 80px, 'l' - 112px, 'xl' - 144px.)
+`verticalOffset?: '0' | 's' | 'm' | 'l' | 'xl'` — Top and bottom offsets from the text. (Values: '0' - 0px, 's' - 48px, 'm' - 80px, 'l' - 112px, 'xl' - 144px.)
 </StoryTemplate>
 
 `mediaView?: full | fit` — full is default value, the media content covers all widht and height. Fit - media content has real sizes and locates in the middle
diff --git a/src/blocks/Header/__stories__/Header.stories.tsx b/src/blocks/Header/__stories__/Header.stories.tsx
@@ -80,6 +80,7 @@ const FitTemplate: StoryFn<HeaderBlockModel> = (args) => (
 
 const VerticalOffsetTemplate: StoryFn<HeaderBlockModel> = (args) => (
     <Fragment>
+        <DefaultTemplate {...args} title={getVerticalOffsetTitle('«0»')} verticalOffset="0" />
         <DefaultTemplate {...args} title={getVerticalOffsetTitle('«S»')} verticalOffset="s" />
         <DefaultTemplate {...args} title={getVerticalOffsetTitle('«M»')} verticalOffset="m" />
         <DefaultTemplate {...args} title={getVerticalOffsetTitle('«L»')} verticalOffset="l" />

diff --git a/src/blocks/Header/schema.ts b/src/blocks/Header/schema.ts
@@ -67,7 +67,7 @@ export const HeaderProperties = {
     },
     verticalOffset: {
         type: 'string',
-        enum: ['s', 'm', 'l', 'xl'],
+        enum: ['0', 's', 'm', 'l', 'xl'],
     },
     background: withTheme(HeaderBackgroundProps),
     theme: {

diff --git a/src/models/constructor-items/blocks.ts b/src/models/constructor-items/blocks.ts
@@ -156,7 +156,7 @@ export interface HeaderBlockProps {
     mediaView?: 'fit' | 'full';
     background?: ThemedHeaderBlockBackground;
     theme?: 'light' | 'dark';
-    verticalOffset?: 's' | 'm' | 'l' | 'xl';
+    verticalOffset?: '0' | 's' | 'm' | 'l' | 'xl';
     breadcrumbs?: HeaderBreadCrumbsProps;
     status?: JSX.Element;
     renderTitle?: (title: string) => React.ReactNode;