function Header()

in components/header.tsx [160:223]

• 64 lines of code
• 1 McCabe index (conditional complexity)

function Header() {
  const [css, theme] = useStyletron();
  return (
    <header
      className={css({
        width: "100%",
        display: "flex",
        flexWrap: "wrap",
        alignItems: "center",
        background: theme.colors.backgroundPrimary,
        height: "124px",
        paddingLeft: theme.sizing.scale800,
        paddingRight: theme.sizing.scale800,
        [theme.mediaQuery.medium]: {
          position: "fixed",
          top: "0",
          zIndex: "1",
          height: "60px",
          flexWrap: "nowrap",
        },
      })}
    >
      <div
        className={css({
          order: 1,
          marginRight: "auto",
          [theme.mediaQuery.medium]: {
            flex: "1",
            marginRight: "0",
          },
        })}
      >
        <Home />
      </div>
      <div
        className={css({
          order: 3,
          width: "100%",
          alignSelf: "baseline",
          [theme.mediaQuery.medium]: {
            order: 2,
            flex: "1",
            alignSelf: "initial",
          },
        })}
      >
        <Search />
      </div>
      <div
        className={css({
          order: 2,
          display: "flex",
          justifyContent: "flex-end",
          [theme.mediaQuery.medium]: {
            order: 3,
            flex: "1",
          },
        })}
      >
        <Links />
      </div>
    </header>
  );
}