@bothub-chat/ui/dist/components/header/styled.js

Bothub UI Components

import{styled as e,css as i}from"styled-components";import{Container as t}from"../container/index.js";import{adaptive as a}from"../../adaptive/index.js";const d=e.div.withConfig({displayName:"styled__HeaderOffset",componentId:"sc-1m73u3z-0"})(["display:flex;min-width:",";width:100%;height:",";background:",";@media (max-width:","){height:",";}"],(({theme:e})=>e.mobile.minWidth),(({theme:e})=>e.header.height),(({theme:e})=>e.colors.base.black),(({theme:e})=>e.mobile.maxWidth),(({theme:e})=>e.header.mobile.height)),n=e.header.withConfig({displayName:"styled__HeaderStyled",componentId:"sc-1m73u3z-1"})(["z-index:",";width:100%;"," ",""],(({theme:e})=>e.zIndex.header),(({theme:e,$variant:t})=>{switch(t){case"main":{const t=a({merge:!0,desktop:i`
            height: ${e.header.height};
          `,mobile:i`
            height: ${e.header.mobile.height};
          `});return i`
          position: fixed;
          top: 0px;
          left: 0px;
          right: 0px;
          ${t}
        `}case"admin":case"dashboard":{const t=a({variant:"dashboard",merge:!0,desktop:i`
            height: ${e.dashboard.header.height};
          `,tablet:i`
            height: ${e.dashboard.header.tablet.height};
            z-index: ${e.zIndex.modal};
          `,mobile:i`
            height: ${e.dashboard.header.mobile.height};
          `});return i`
          position: relative;
          ${t}
        `}}}),(({$variant:e})=>"admin"===e&&a({variant:"dashboard",mobile:i`
        padding: 0;
      `}))),o=e.div.withConfig({displayName:"styled__HeaderContent",componentId:"sc-1m73u3z-2"})(["display:flex;flex-direction:column;position:relative;height:inherit;z-index:",";"," ",""],(({theme:e})=>e.zIndex.header),(({theme:e,$variant:t})=>{switch(t){case"main":return i`
          border-bottom: 1px solid ${e.colors.grayScale.gray3};
          backdrop-filter: blur(9px);
          -webkit-backdrop-filter: blur(9px);
          background-color: rgba(18, 24, 37, 0.4);
        `;case"admin":case"dashboard":{const t=a({variant:"dashboard",desktop:i`
            border-radius: 17px;
            padding: 0px 26.5px;
          `,tablet:i`
            border-radius: 17px;
            padding: 0px 18px;
          `,mobile:i`
            padding: 0px 16px;
          `});return i`
          transition: background-color 0.3s;
          background-color: ${e.colors.grayScale.gray4};
          ${t}
        `}}}),(({$variant:e})=>"admin"===e&&a({variant:"dashboard",mobile:i`
        border-radius: 18px;
      `}))),r=e(t).withConfig({displayName:"styled__HeaderContainer",componentId:"sc-1m73u3z-3"})(["display:flex;justify-content:space-between;align-items:center;height:inherit;position:relative;"]),s=e.div.withConfig({displayName:"styled__HeaderContainerContent",componentId:"sc-1m73u3z-4"})(["display:flex;align-items:center;width:100%;height:inherit;box-sizing:border-box;position:relative;",""],(({$screenSize:e,$variant:t})=>a({variant:"dashboard",desktop:i`
        display: ${"desktop"===e?"flex":"none"};
        justify-content: space-between;
      `,tablet:i`
        display: ${"tablet"===e?"flex":"none"};
        border-radius: 0;
        padding: 8px;
        justify-content: space-between;
        z-index: ${({theme:e})=>e.zIndex.modal};
      `,mobile:i`
        display: ${"admin"!==t&&"mobile"===e||"admin"===t&&"tablet"===e?"flex":"none"};
        border-radius: 0;
        padding: 8px;
        justify-content: space-between;
        z-index: ${({theme:e})=>e.zIndex.modal};
      `}))),l=e.div.withConfig({displayName:"styled__HeaderLeft",componentId:"sc-1m73u3z-5"})(["display:flex;align-items:center;position:relative;gap:18px;",""],a({variant:"dashboard",tablet:i`
      flex: 1;
    `})),h=e.div.withConfig({displayName:"styled__HeaderCenter",componentId:"sc-1m73u3z-6"})(["display:flex;align-items:center;",""],a({variant:"dashboard",tablet:i`
      flex: 1;
      justify-content: center;
    `})),p=e.div.withConfig({displayName:"styled__HeaderRight",componentId:"sc-1m73u3z-7"})(["display:flex;align-items:center;gap:24px;",""],a({variant:"dashboard",tablet:i`
      gap: 8px;
      flex: 1;
      justify-content: end;
    `})),m=e.a.withConfig({displayName:"styled__HeaderLogoLink",componentId:"sc-1m73u3z-8"})(["display:inline-flex;transition:0.35s opacity;&:hover{opacity:0.7;}"]);export{h as HeaderCenter,r as HeaderContainer,s as HeaderContainerContent,o as HeaderContent,l as HeaderLeft,m as HeaderLogoLink,d as HeaderOffset,p as HeaderRight,n as HeaderStyled};