diff --git a/src/components/flow/Cell/index.tsx b/src/components/flow/Cell/index.tsx index 729ed21f..bb2a154a 100644 --- a/src/components/flow/Cell/index.tsx +++ b/src/components/flow/Cell/index.tsx @@ -23,7 +23,7 @@ const Cell: FC = ({
= ({ // gridColumnEnd: `span ${width}`, }} > - {is_text &&
{TEXTS.LOREM_IPSUM}
} - { title &&
{title}
} + {is_text &&
+
{title}
+ {TEXTS.LOREM_IPSUM} +
} + {title &&
{title}
}
); diff --git a/src/components/flow/Cell/styles.scss b/src/components/flow/Cell/styles.scss index 38165284..2403bd68 100644 --- a/src/components/flow/Cell/styles.scss +++ b/src/components/flow/Cell/styles.scss @@ -14,34 +14,64 @@ } } + &:global(.is_text) { + .title { + display: none; + } + } + @include outer_shadow(); } .text { - line-height: 1.6em; - font-size: 18px; - font: $font_18_regular; + font: $font_16_regular; + line-height: 1.3em; + letter-spacing: 0.5px; position: absolute; top: 0; left: 0; padding: $gap; + background: $content_bg; + height: 100%; + overflow: hidden; + + &::after { + content: ' '; + position: absolute; + bottom: 0; + left: 0; + width: 100%; + height: 100px; + pointer-events: none; + touch-action: none; + background: linear-gradient(transparentize($content_bg, 1), $content_bg 70px); + z-index: 1; + border-radius: 0 0 $radius $radius; + } } -.title { +.title, .text_title { font: $font_cell_title; text-transform: uppercase; - height: 1em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; - padding: 0 $gap; + + box-sizing: border-box; +} + +.title { + padding: 0 $gap; position: absolute; bottom: $gap; left: 0; width: 100%; - box-sizing: border-box; +} + +.text_title { + margin-bottom: $gap / 2; } :global { diff --git a/src/components/main/Header/style.scss b/src/components/main/Header/style.scss index 2e96d1da..30204ba2 100644 --- a/src/components/main/Header/style.scss +++ b/src/components/main/Header/style.scss @@ -3,8 +3,7 @@ align-items: center; justify-content: flex-end; font-weight: 500; - height: 96px; - margin-top: -20px; + height: 80px; } .spacer { diff --git a/src/containers/App.tsx b/src/containers/App.tsx index 73414de2..bcde7474 100644 --- a/src/containers/App.tsx +++ b/src/containers/App.tsx @@ -23,13 +23,10 @@ type IProps = typeof mapDispatchToProps & ReturnType & { const Component: FC = ({ is_shown }) => ( - - - - - - + + + @@ -39,7 +36,6 @@ const Component: FC = ({ is_shown }) => ( - );