feat: added case without logo

Author: olaslo

src/components/AsideHeader/AsideHeader.scss

@@ -197,6 +197,12 @@ $block: '.#{variables.$ns}aside-header';
         display: flex;
         align-items: center;
         justify-content: space-between;
+
+        &_without-logo {
+            padding-bottom: var(--g-spacing-2);
+            margin-bottom: var(--g-spacing-2);
+            border-bottom: solid 1px var(--g-color-line-generic);
+        }
     }
 
     &__logo-button &__logo-icon-place {
@@ -264,4 +270,13 @@ $block: '.#{variables.$ns}aside-header';
             padding-left: var(--gn-aside-header-min-width);
         }
     }
+
+    &__pin-button {
+        margin-right: 10px;
+        margin-left: auto;
+
+        &_compact {
+            margin-right: auto;
+        }
+    }
 }

src/components/AsideHeader/components/CollapseButton/CollapseButton.scss

@@ -3,9 +3,6 @@
 $block: '.#{variables.$ns}collapse-button';
 
 #{$block} {
-    margin-right: 2px;
-    margin-left: auto;
-
     &_compact {
         #{$block}__icon {
             transform: rotate(180deg);

src/components/AsideHeader/components/CollapseButton/CollapseButton.tsx

@@ -34,7 +34,7 @@ export const CollapseButton = ({className}: CollapseButtonProps) => {
         <Button
             view="flat-secondary"
             size="l"
-            className={b({compact: compact}, className)}
+            className={b({compact}, className)}
             onClick={onCollapseButtonClick}
             aria-label={buttonTitle}
         >

src/components/AsideHeader/components/Header.tsx

@@ -28,6 +28,8 @@ export const Header = () => {
         hideCollapseButton,
     } = useAsideHeaderInnerContext();
 
+    const compact = !isExpanded;
+
     const items = useGroupedMenuItems(subheaderItems || DEFAULT_SUBHEADER_ITEMS);
 
     const onLogoClick = useCallback(
@@ -40,25 +42,25 @@ export const Header = () => {
 
     return (
         <div className={b('header', {['with-decoration']: headerDecoration})}>
-            <div className={b('logo-container')}>
+            <div className={b('logo-container', {'without-logo': !logo})}>
                 {logo && (
                     <Logo
                         {...logo}
                         onClick={onLogoClick}
-                        compact={!isExpanded}
+                        compact={compact}
                         buttonClassName={b('logo-button')}
                         iconPlaceClassName={b('logo-icon-place')}
                     />
                 )}
 
-                {!hideCollapseButton && isExpanded && <CollapseButton />}
+                {!hideCollapseButton && <CollapseButton className={b('pin-button', {compact})} />}
             </div>
 
             <CompositeBar
                 compositeId={HEADER_COMPOSITE_ID}
                 menuItemClassName={b('menu-item')}
                 type="subheader"
-                compact={!isExpanded}
+                compact={compact}
                 items={items}
                 onItemClick={onItemClick}
             />