@antv/dumi-theme-antv 0.2.2 → 0.3.0-beta.1

package/src/components/Dark.tsx

@@ -1,78 +0,0 @@
-import type { FC } from 'react';
-import React from 'react';
-import { usePrefersColor } from 'dumi/theme';
-import './Dark.less';
-
-interface darkProps {
-  darkSwitch: boolean;
-  isSideMenu: boolean;
-  onDarkSwitchClick?: (ev) => void;
-};
-
-const Dark: FC<darkProps> = ({ darkSwitch, onDarkSwitchClick, isSideMenu }) => {
-  const allState = ['dark', 'light', 'auto'];
-  const [color, setColor] = usePrefersColor();
-  const prefersColor = color;
-
-  const sunSvg = <svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4026" width="22" height="22"><path d="M915.2 476.16h-43.968c-24.704 0-44.736 16-44.736 35.84s20.032 35.904 44.736 35.904H915.2c24.768 0 44.8-16.064 44.8-35.904s-20.032-35.84-44.8-35.84zM512 265.6c-136.704 0-246.464 109.824-246.464 246.4 0 136.704 109.76 246.464 246.464 246.464S758.4 648.704 758.4 512c0-136.576-109.696-246.4-246.4-246.4z m0 425.6c-99.008 0-179.2-80.128-179.2-179.2 0-98.944 80.192-179.2 179.2-179.2S691.2 413.056 691.2 512c0 99.072-80.192 179.2-179.2 179.2zM197.44 512c0-19.84-19.136-35.84-43.904-35.84H108.8c-24.768 0-44.8 16-44.8 35.84s20.032 35.904 44.8 35.904h44.736c24.768 0 43.904-16.064 43.904-35.904zM512 198.464c19.776 0 35.84-20.032 35.84-44.8v-44.8C547.84 84.032 531.84 64 512 64s-35.904 20.032-35.904 44.8v44.8c0 24.768 16.128 44.864 35.904 44.864z m0 627.136c-19.776 0-35.904 20.032-35.904 44.8v44.736C476.096 940.032 492.16 960 512 960s35.84-20.032 35.84-44.8v-44.736c0-24.768-16.064-44.864-35.84-44.864z m329.92-592.832c17.472-17.536 20.288-43.072 6.4-57.024-14.016-14.016-39.488-11.2-57.024 6.336-4.736 4.864-26.496 26.496-31.36 31.36-17.472 17.472-20.288 43.008-6.336 57.024 13.952 14.016 39.488 11.2 57.024-6.336 4.8-4.864 26.496-26.56 31.296-31.36zM213.376 759.936c-4.864 4.8-26.56 26.624-31.36 31.36-17.472 17.472-20.288 42.944-6.4 56.96 14.016 13.952 39.552 11.2 57.024-6.336 4.8-4.736 26.56-26.496 31.36-31.36 17.472-17.472 20.288-43.008 6.336-56.96-14.016-13.952-39.552-11.072-56.96 6.336z m19.328-577.92c-17.536-17.536-43.008-20.352-57.024-6.336-14.08 14.016-11.136 39.488 6.336 57.024 4.864 4.864 26.496 26.56 31.36 31.424 17.536 17.408 43.008 20.288 56.96 6.336 14.016-14.016 11.264-39.488-6.336-57.024-4.736-4.864-26.496-26.56-31.296-31.424z m527.168 628.608c4.864 4.864 26.624 26.624 31.36 31.424 17.536 17.408 43.072 20.224 57.088 6.336 13.952-14.016 11.072-39.552-6.4-57.024-4.864-4.8-26.56-26.496-31.36-31.36-17.472-17.408-43.072-20.288-57.024-6.336-13.952 14.016-11.008 39.488 6.336 56.96z" p-id="4027"></path></svg>;
-  const moonSvg = <svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3854" width="22" height="22"><path d="M991.816611 674.909091a69.166545 69.166545 0 0 0-51.665455-23.272727 70.795636 70.795636 0 0 0-27.438545 5.585454A415.674182 415.674182 0 0 1 754.993338 698.181818c-209.594182 0-393.472-184.785455-393.472-395.636363 0-52.363636 38.539636-119.621818 69.515637-173.614546 4.887273-8.610909 9.634909-16.756364 14.103272-24.901818A69.818182 69.818182 0 0 0 384.631156 0a70.842182 70.842182 0 0 0-27.438545 5.585455C161.678429 90.298182 14.362065 307.898182 14.362065 512c0 282.298182 238.824727 512 532.38691 512a522.286545 522.286545 0 0 0 453.957818-268.334545A69.818182 69.818182 0 0 0 991.816611 674.909091zM546.679156 954.181818c-248.785455 0-462.941091-192-462.941091-442.181818 0-186.647273 140.637091-372.829091 300.939637-442.181818-36.817455 65.629091-92.578909 151.970909-92.578909 232.727273 0 250.181818 214.109091 465.454545 462.917818 465.454545a488.331636 488.331636 0 0 0 185.181091-46.545455 453.003636 453.003636 0 0 1-393.565091 232.727273z m103.656728-669.323636l-14.266182 83.781818a34.909091 34.909091 0 0 0 50.362182 36.770909l74.775272-39.563636 74.752 39.563636a36.142545 36.142545 0 0 0 16.174546 3.956364 34.909091 34.909091 0 0 0 34.210909-40.727273l-14.289455-83.781818 60.509091-59.345455a35.025455 35.025455 0 0 0-19.223272-59.578182l-83.61891-12.101818-37.376-76.101818a34.56 34.56 0 0 0-62.254545 0l-37.376 76.101818-83.618909 12.101818a34.909091 34.909091 0 0 0-19.246546 59.578182z m70.423272-64.698182a34.280727 34.280727 0 0 0 26.135273-19.083636l14.312727-29.090909 14.336 29.090909a34.257455 34.257455 0 0 0 26.135273 19.083636l32.046546 4.887273-23.272728 22.574545a35.234909 35.234909 0 0 0-10.007272 30.952727l5.46909 32.116364-28.625454-15.127273a34.490182 34.490182 0 0 0-32.302546 0l-28.695272 15.127273 5.469091-32.116364a35.141818 35.141818 0 0 0-9.984-30.952727l-23.272728-22.574545z" p-id="3855"></path></svg>;
-  const autoSvg = <svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11002" width="22" height="22"><path d="M127.658667 492.885333c0-51.882667 10.24-101.717333 30.378666-149.162666s47.786667-88.064 81.92-122.538667 75.093333-61.781333 122.538667-81.92 96.938667-30.378667 149.162667-30.378667 101.717333 10.24 149.162666 30.378667 88.405333 47.786667 122.88 81.92 61.781333 75.093333 81.92 122.538667 30.378667 96.938667 30.378667 149.162666-10.24 101.717333-30.378667 149.162667-47.786667 88.405333-81.92 122.88-75.093333 61.781333-122.88 81.92-97.28 30.378667-149.162666 30.378667-101.717333-10.24-149.162667-30.378667-88.064-47.786667-122.538667-81.92-61.781333-75.093333-81.92-122.88-30.378667-96.938667-30.378666-149.162667z m329.045333 0c0 130.048 13.994667 244.394667 41.984 343.381334h12.970667c46.762667 0 91.136-9.216 133.461333-27.306667s78.848-42.666667 109.568-73.386667 54.954667-67.242667 73.386667-109.568 27.306667-86.698667 27.306666-133.461333c0-46.421333-9.216-90.794667-27.306666-133.12s-42.666667-78.848-73.386667-109.568-67.242667-54.954667-109.568-73.386667-86.698667-27.306667-133.461333-27.306666h-11.605334c-28.672 123.562667-43.349333 237.909333-43.349333 343.722666z" p-id="11003"></path></svg>;
-
-  const list = allState.filter(state => state !== prefersColor);
-
-  const changeColor = (ev, toColor) => {
-    if (!isSideMenu && onDarkSwitchClick) {
-      onDarkSwitchClick(ev);
-    }
-    if (toColor === prefersColor) return;
-    setColor(toColor);
-  };
-
-  const getSvg = (baseColor) => {
-    switch (baseColor) {
-      case 'dark':
-        return (
-          <button key="dumi-dark-btn-moon" title="Dark theme" onClick={ev => changeColor(ev, baseColor)} className={`__dumi-default-dark-moon ${baseColor === prefersColor ? '__dumi-default-dark-switch-active' : ''}`}>
-            {moonSvg}
-          </button>
-        );
-      case 'light':
-        return (
-          <button key="dumi-dark-btn-sun" title="Light theme" onClick={ev => changeColor(ev, baseColor)} className={`__dumi-default-dark-sun ${baseColor === prefersColor ? '__dumi-default-dark-switch-active' : ''}`}>
-            {sunSvg}
-          </button>
-        );
-      case 'auto':
-        return (
-          <button key="dumi-dark-btn-auto" title="Default to system" onClick={ev => changeColor(ev, baseColor)} className={`__dumi-default-dark-auto ${baseColor === prefersColor ? '__dumi-default-dark-switch-active' : ''}`}>
-            {autoSvg}
-          </button>
-        )
-      default:
-    }
-  };
-
-  return (
-    <div className="__dumi-default-dark">
-      <div
-        className={`__dumi-default-dark-switch ${!isSideMenu && darkSwitch ? "__dumi-default-dark-switch-open" : ""}`}>
-        {isSideMenu ? (
-          allState.map(item => (
-            getSvg(item)
-          ))
-        ) : getSvg(prefersColor)}
-      </div>
-      {!isSideMenu && darkSwitch && (
-        <div className="__dumi-default-dark-switch-list">
-          {
-            list.map(item => (
-              getSvg(item)
-            ))
-          }
-        </div>
-      )}
-    </div>
-  )
-};
-
-export default Dark;

package/src/components/LocaleSelect.less

@@ -1,59 +0,0 @@
-@import (reference) '../style/variables.less';
-
-.@{prefix}-locale-select {
-  position: relative;
-  display: inline-block;
-  border: 1px solid @c-btn-border;
-  border-radius: 14px;
-  transition: background 0.2s;
-
-  [data-prefers-color=dark] & {
-    border: 1px solid @c-btn-border-dark;
-  }
-
-  @media @mobile {
-    margin-top: 6px;
-  }
-
-  &:hover {
-    background-color: #fafafa;
-    [data-prefers-color=dark] & {
-      background-color: rgba(255, 255, 255, 0.1);
-    }
-  }
-
-  &:not([data-locale-count='1']):not([data-locale-count='2'])::after {
-    content: '';
-    position: absolute;
-    top: 50%;
-    right: 10px;
-    margin-top: -3px;
-    width: 0;
-    height: 0;
-    border: 4px solid transparent;
-    border-top: 6px solid #7b7f8d;
-    pointer-events: none;
-  }
-
-  a,
-  span,
-  select {
-    padding: 0 24px 0 16px;
-    height: 28px;
-    text-align: center;
-    text-decoration: none;
-    line-height: 28px;
-    appearance: none;
-    border: 0;
-    font-size: 16px;
-    color: #7b7f8d;
-    background: transparent;
-    outline: none;
-    cursor: pointer;
-  }
-
-  a,
-  span {
-    padding-right: 16px;
-  }
-}

package/src/components/LocaleSelect.tsx

@@ -1,53 +0,0 @@
-import type { FC } from 'react';
-import React, { useContext } from 'react';
-// @ts-ignore
-import { history } from 'dumi';
-import { context, Link } from 'dumi/theme';
-import './LocaleSelect.less';
-
-const LocaleSelect: FC<{ location: any }> = ({ location }) => {
-  const {
-    base,
-    locale,
-    config: { locales },
-  } = useContext(context);
-  const firstDiffLocale = locales.find(({ name }) => name !== locale);
-
-  function getLocaleTogglePath(target: string) {
-    const baseWithoutLocale = base.replace(`/${locale}`, '');
-    const pathnameWithoutLocale = location.pathname.replace(new RegExp(`^${base}(/|$)`), `${baseWithoutLocale}$1`) || '/';
-
-    // append locale prefix to path if it is not the default locale
-    if (target !== locales[0].name) {
-      // compatiable with integrate route prefix /~docs
-      const routePrefix = `${baseWithoutLocale}/${target}`.replace(/\/\//, '/');
-      const pathnameWithoutBase = location.pathname.replace(
-        // to avoid stripped the first /
-        base.replace(/^\/$/, '//'),
-        '',
-      );
-
-      return `${routePrefix}${pathnameWithoutBase}`.replace(/\/$/, '');
-    }
-
-    return pathnameWithoutLocale;
-  }
-
-  return firstDiffLocale ? (
-    <div className="__dumi-default-locale-select" data-locale-count={locales.length}>
-      {locales.length > 2 ? (
-        <select value={locale} onChange={ev => history.push(getLocaleTogglePath(ev.target.value))}>
-          {locales.map(localeItem => (
-            <option value={localeItem.name} key={localeItem.name}>
-              {localeItem.label}
-            </option>
-          ))}
-        </select>
-      ) : (
-        <Link to={getLocaleTogglePath(firstDiffLocale.name)}>{firstDiffLocale.label}</Link>
-      )}
-    </div>
-  ) : null;
-};
-
-export default LocaleSelect;

package/src/components/Navbar.less

@@ -1,180 +0,0 @@
-@import (reference) "../style/variables.less";
-
-.@{prefix}-navbar {
-  position: fixed;
-  z-index: 101;
-  top: 0;
-  left: 0;
-  right: 0;
-  display: none;
-  align-items: center;
-  justify-content: space-between;
-  padding: 0 58px;
-  height: @s-nav-height;
-  white-space: nowrap;
-  background: #fff;
-  box-shadow: 0 8px 24px -2px rgba(0, 0, 0, 0.05);
-
-  @media @mobile {
-    display: flex;
-    justify-content: center;
-    height: @s-mobile-nav-height;
-  }
-
-  &-toggle {
-    position: absolute;
-    top: 14px;
-    left: 16px;
-    display: none;
-    width: 22px;
-    height: 22px;
-    border: 0;
-    outline: none;
-    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFgAAAA4CAYAAAB5YT9uAAAAAXNSR0IArs4c6QAAASVJREFUeAHt3DuOwjAUBVAHscWZjaSkAIqU2QjskV80QwpsF3ArdGiw3hW3OGnQM2Iof6/dfr7+n71/LjAdx+HRsvm8SkNPAHBPJ5ABDiD2KgD3dAIZ4ABirwJwTyeQAQ4g9ioA93QC2fbZsSm/z7MDAQIECBAgQIAAAQIECBAgQIAAAQKvAsvV8mO8O8yn19jkXYHpMC7byXVdeS0/75b5XFvAwr1tE0kARxjbJYDbNpEEcISxXQK4bRNJAEcY2yWA2zaRZP0ePJRzpFEJAQIECBAgQIAAAQIECBAgQIAAgW8VWK/tj7Nb5eBTnvbjsp1c15WX4ncRQeB7lb8zyHrW29xo1F1iU8AxynoR4LpLbAo4RlkvAlx3iU0BxyjrRYDrLrHpDVSAEEPXScHTAAAAAElFTkSuQmCC")
-      no-repeat center / contain;
-
-    @media @mobile {
-      display: block;
-    }
-  }
-
-  &-logo {
-    display: inline-block;
-    height: 40px;
-    color: #080e29;
-    font-weight: 500;
-    text-decoration: none;
-    font-size: 24px;
-    line-height: 40px;
-
-    &:not([data-plaintext]) {
-      padding-left: 56px;
-      background: url(@img-logo) no-repeat 0 / contain;
-    }
-
-    &:active,
-    &:hover {
-      color: #080e29;
-    }
-
-    @media @mobile {
-      height: 28px;
-      line-height: 28px;
-
-      &:not([data-plaintext]) {
-        padding-left: 36px;
-      }
-    }
-  }
-
-  nav {
-    > span {
-      position: relative;
-      margin-left: 40px;
-      display: inline-block;
-      height: @s-nav-height;
-      cursor: pointer;
-      font-size: 14px;
-      line-height: @s-nav-height;
-      text-decoration: none;
-      letter-spacing: 0;
-
-      > a {
-        color: #4d5164;
-        text-decoration: none;
-
-        &:hover,
-        &.active {
-          color: @c-primary;
-        }
-
-        &::before {
-          content: "";
-          position: absolute;
-          top: 0;
-          bottom: 0;
-          right: -18px;
-          left: -18px;
-        }
-
-        &.active::after {
-          content: "";
-          position: absolute;
-          bottom: 0;
-          left: -2px;
-          right: -2px;
-          height: 2px;
-          background-color: @c-primary;
-          border-radius: 1px;
-        }
-      }
-
-      + *:not(a) {
-        margin-left: 40px;
-      }
-
-      // second nav
-      > ul {
-        list-style: none;
-        position: absolute;
-        top: 100%;
-        left: 50%;
-        margin: 0;
-        min-width: 100px;
-        padding: 8px 18px;
-        line-height: 2;
-        background-color: #fff;
-        box-shadow: 0 8px 24px -2px rgba(0, 0, 0, 0.08);
-        transform: translate(-50%);
-        transform-origin: top;
-        border-radius: 1px;
-        transition: all 0.2s;
-
-        a {
-          position: relative;
-          display: block;
-          color: @c-text;
-
-          &:hover,
-          &.active {
-            color: @c-primary;
-          }
-        }
-      }
-
-      &:not(:hover) > ul {
-        visibility: hidden;
-        pointer-events: none;
-        transform: translate(-50%) scaleY(0.9);
-        opacity: 0;
-      }
-    }
-
-    .@{prefix}-search + .@{prefix}-locale-select {
-      margin-left: 40px;
-    }
-
-    @media @mobile {
-      > a,
-      > span,
-      > div {
-        display: none;
-      }
-    }
-  }
-
-  &[data-mode="site"] {
-    display: flex;
-  }
-
-  .arrow {
-    width: 14px;
-    margin-left: 2px;
-    position: relative;
-    top: -2px;
-    transition: all 0.3s;
-    &.open {
-      transform: rotate(180deg);
-    }
-  }
-}

package/src/components/Navbar.tsx

@@ -1,152 +0,0 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-/* eslint-disable jsx-a11y/control-has-associated-label */
-import { context, Link, NavLink } from 'dumi/theme';
-import type { FC, MouseEvent } from 'react';
-import React, { useContext } from 'react';
-import { useMedia } from 'react-use';
-import Logo from '../antv/Header/Logo';
-import Products from '../antv/Products';
-import LocaleSelect from './LocaleSelect';
-import './Navbar.less';
-
-
-
-interface INavbarProps {
-  location: any;
-  navPrefix?: React.ReactNode;
-  onMobileMenuClick: (ev: MouseEvent<HTMLButtonElement>) => void;
-}
-
-const Navbar: FC<INavbarProps> = ({ onMobileMenuClick, navPrefix, location }) => {
-  const {
-    base,
-    config: { mode, title, logo },
-    nav: navItems,
-    //@ts-ignore
-  } = useContext(context);
-
-  const isWide = useMedia('(min-width: 767.99px)', true);
-
-  const [productMenuVisible, setProductMenuVisible] = React.useState(false);
-  let productMenuHovering = false;
-  const onProductMouseEnter = (e: React.MouseEvent) => {
-    productMenuHovering = true;
-    e.persist();
-    setTimeout(() => {
-      // eslint-disable-next-line no-undef
-      if (e.target instanceof Element && e.target.matches(':hover')) {
-        setProductMenuVisible(true);
-      }
-    }, 200);
-  };
-  const onProductMouseLeave = (e: React.MouseEvent) => {
-    e.persist();
-    productMenuHovering = false;
-    setTimeout(() => {
-      if (productMenuHovering) {
-        return;
-      }
-      setProductMenuVisible(false);
-    }, 200);
-  };
-  const onToggleProductMenuVisible = () => {
-    setProductMenuVisible(!productMenuVisible);
-  };
-
-  const productItemProps = isWide
-    ? {
-        onMouseEnter: onProductMouseEnter,
-        onMouseLeave: onProductMouseLeave,
-      }
-    : {
-        onClick: onToggleProductMenuVisible,
-      };
-
-  return (
-    <div className="__dumi-default-navbar" data-mode={mode}>
-      {/* menu toogle button (only for mobile) */}
-      <button className="__dumi-default-navbar-toggle" onClick={onMobileMenuClick} />
-      {/* logo & title */}
-      <div
-        className="__dumi-default-navbar-logo"
-        style={{
-          background: 'none',
-          height: '28px',
-          lineHeight: '28px',
-          paddingLeft: '0px',
-        }}
-      >
-      <a href={'https://antv.vision/'}>  
-         <Logo style={{ height: '28px', lineHeight: '28px' }} /> 
-      </a> 
-        <span
-          style={{
-            fontSize: '16px',
-            width: '1px',
-            height: '24px',
-            backgroundColor: '#ccc',
-            display: ' inline-block',
-            margin: '0 20px',
-          }}
-        />
-        <Link  to={base}>
-        <span style={{ fontSize: '16px', color: '#0d1a26', display: 'inline-block', verticalAlign: 'top' }}>
-          {title}
-        </span>
-        </Link>
-       
-      </div>
-
-      <nav>
-        {navPrefix}
-        {/* nav */}
-        {navItems.map(nav => {
-          const child = Boolean(nav.children?.length) && (
-            <ul>
-              {nav.children.map(item => (
-                <li key={item.path}>
-                  <NavLink to={item.path}>{item.title}</NavLink>
-                </li>
-              ))}
-            </ul>
-          );
-
-          return (
-            <span key={nav.title || nav.path}>
-              {nav.path ? (
-                <NavLink to={nav.path} key={nav.path}>
-                  {nav.title}
-                </NavLink>
-              ) : (
-                nav.title
-              )}
-              {child}
-            </span>
-          );
-        })}
-        <span {...productItemProps}>
-          所有产品
-          <img
-            src="https://gw.alipayobjects.com/zos/antfincdn/FLrTNDvlna/antv.png"
-            alt="antv logo arrow"
-            className={`arrow ${productMenuVisible && 'open'}`}
-          />
-          <div
-            style={{
-              position: 'fixed',
-              top: ' 0px',
-              left: '0px',
-              width: ' 100%',
-              right: '0px',
-            }}
-          >
-            <Products show={productMenuVisible} rootDomain="ant.vison" language="zh" />
-          </div>
-        </span>
-        <LocaleSelect location={location} />
-      </nav>
-    </div>
-  );
-};
-
-export default Navbar;

package/src/components/SearchBar.less

@@ -1,165 +0,0 @@
-@import (reference) '../style/variables.less';
-
-.@{prefix}-search {
-  margin-left: 20px;
-  position: relative;
-  display: inline-block;
-
-  &-input {
-    width: 200px;
-    height: 32px;
-    padding: 0 38px 0 14px;
-    color: @c-heading;
-    font-size: 14px;
-    border: 0;
-    outline: none;
-    transition: all 0.2s;
-    border-radius: 16px;
-    background: url('data:image/png;base64,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')
-      #f5f6f7 no-repeat right 14px center / 16px;
-    appearance: none;
-
-    [data-prefers-color=dark] & {
-      color: @c-secondary-dark;
-      background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAABpRJREFUaAXNWWts01UUv+f+264DVEABqY8IjhhCCCGKRoMaE0HACKJxsI3WDwqd67qHEoiPT2qCEpJ1bB1vElpJZYnyMMEgfCCQEUFIDOGDihLiY7yUGAHb9XGP59+t3b3/de2/XYvtl/855557zvndc+6zwAr4tW0KPQQithQRZjEUVcCgChkbw4CFGcMwIPxJZk8zzk5qFkuP1137QwFuTHUBU1qk1N3dXdl7LVKPyGoZ4mNm+w3oneKMb7bbxu5xu1/6N8++WdVzAkBE7usKukCwj5Dh/Vmt5WgEgL8oS2ubG5w7iaakjfyXFUD7lsCDGMMvadQfHbmrQQsA7BjjfFVLg/PHQWlh1LAA2v2BuQLZF1QuE42mB0bvNGOwj3NxinGtN1Exulez3hJwizuYiDsSgs1myF6mDD5F/bnRBmXiBkO+uNXrPDqkLQ9BRgDtnYHlVC4BGnmrbItGLoYMtmoV/JOmlSt+l9uGozdtCkyMxNk7VDFNZM8u65G9CAeobvK4vpLl+dBDAGzsCj6dSOARWk1ssiEa9UNWgEaPx/mzLDdL+/2hB2IYa6OMvKr2gbjG+YtNnhXfqHJznAKgq2v31D6ROEllc4/aHda3NDrfJRBClefP+ToDH1CvDwnIoG+Aqzawz/J4qi/nazFdm7rBvkQ8ZAweOK9v9brWFiN4PbiWRtfHCFA3MI/646V5FsPwZxRDOh6zQLSU4riJVS4KvjHFJ7+cbWj1uNYpsiIwhw7uPbdg0VJ9GX1OMjf129NnL1Lb95IsJ5lMo9/fPSYqIj9R3U9O9aAROtzscS4o1sin7Ka+esZ9/uBeGrQlKRkFc94xqXJ6dXV1IiXL9U2mLMbCLjl4Wh7jjIO3VMHrQSVLSLO2UNB9qSApJdP+uNZXneLNfPtrDmGFrExL3o5ibDKyzUx061s1FwlKl9wGQjTJfC6a+/3BKkrnk7KijVvWy3wpaY1ZNySzMeCEsvD49u3d48365HEhFsrKtLmcbWiouyDLSkl7vTW9NIDfST74zb7wPInPSnLaWWeqGrBP5UvPAfD9shfasZ+X+Ww0zQFUASCcydahJG2Iik+a2FPM+tEn8cOyssawV+ZvB60xbvQ5waxfKiGW3sz6O1mNxszaKljPZuOXDJ2HnIAN7Wm2fxlNs4xZLBpl8H/+GU6t2aLhFK2y6/WJqCNbh1K0RaMifQLotw+mq0DPwC9KUGLwOKHIS8jQEU4BQHcRU3cNPSROJ8OzSmyAcxT+NjAJFMqVlV45fjPrllMKFAA0qdOHK7NGRqoHiItlGwh4Quaz0dxCNy1FAXGmfrFRZCVk6CR8L53snki5oGNFYpTVeiDF5/rygStij6wYFfE1Ml9KOoaR1frRWvJx3O2u1R/GTP2Syyhw2CVrk7036C3oEVlWClq/JxsvUfRatCcfX0kAVmYP0bFW2kzQggmxkUYm2Z6PwXx0YyLmozlXke4DcGHyJPvONG+CSAZIl+mbRKw26M/3dQbXGWRFY8n2e7RcviIb1ICvpdtYVJblouXaY20dgaN0uHtW7kTltarF49omy0ZK+/y7ljGEkKH2e1q9r8/N17ZSIjYOb5KB67IRFLjV1xFYV6xyokF6P0PwSZeBQGC07NsMrWRA76A/bImEOKzUJslJ8Wtuq/A2uZerO7cZL6STfGeNsjZj2cjd6TJ1bPydsMjlct2S5dnoIQB05TZ/sIY2lyCNunJSJQcxeu/cwu3ap2afFjs6Qo4ExN7WVxvjoGQKLF8QGQHohqlsXqD58Dk5HWt0pN9hSX6GAx5AAae4FS5bES9xbhHhBHMgE/eBwNmIYgnpzjHUutHcED4fEMMC0K22b949TcTj9HbDZgzxMjJBDzn+lQahZjgzZkEok9horLm+7vwo64zZ9ILcSNv9VWN73jyt8xrXXtNXm+ZGVx0d2oZd3SjFz1z/Bw/mmthZMyAHuGPH/jtuhP+uJ9kyMq6cHmW9DLSgMjrBAEOOCZXb5XVeL632zuAWmtgrM/RLinJlwjQA2UHHtsAUEYHFCGI6gZlC2ZlKZfYgGYvQvLlCpXGVRreXAj+CFdr+lpW1V+T+Mm0GBK2Bx+++iy3MtDoVBEAOoBj0SECUBQB9EMyCsHH7Iv3okxq4sgFQKIiyAlAIiLIDkC+IsgRgFgQtsQfKFkAuEBT8ZQ21+WUNYFgQtKNXcG2e/jdA2QMwgqAN8lylDea73U7pCqxrlfkvuU/4A2voyWecHOp/C76d7/ws9hcAAAAASUVORK5CYII=')
-      #ffffff1f no-repeat right 14px center / 16px;
-    }
-
-    &:focus {
-      box-shadow: 0 0 0 1px fade(@c-primary, 20%) inset;
-    }
-
-    &:not(:focus) + ul:not(:hover) {
-      visibility: hidden;
-    }
-  }
-
-  > ul {
-    list-style: none;
-    position: absolute;
-    top: 100%;
-    left: 0;
-    z-index: 10;
-    margin: 8px 0 0;
-    min-width: 280px;
-    max-width: 400px;
-    max-height: 230px;
-    padding: 6px 0;
-    background-color: #fff;
-    border: 1px solid @c-border;
-    border-radius: 1px;
-    box-shadow: 0 2px 20px 0 rgba(0, 0, 0, 0.05);
-    box-sizing: border-box;
-    overflow-y: auto;
-
-    [data-prefers-color=dark] & {
-      border: none;
-      background-color: @c-bg-dark;
-      box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.48), 0 6px 16px 0 rgba(0, 0, 0, 0.32), 0 9px 28px 8px rgba(0, 0, 0, 0.2);
-    }
-
-    &:empty {
-      display: none;
-    }
-
-    li {
-      font-size: 15px;
-
-      a {
-        display: block;
-        padding: 6px 20px;
-        color: @c-secondary;
-        text-decoration: none;
-        line-height: 1.5715;
-        transition: background-color 0.3s;
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
-
-        [data-prefers-color=dark] & {
-          color: @c-secondary-dark;
-        }
-
-        &:hover {
-          color: @c-primary;
-          background-color: @c-light-bg;
-
-          [data-prefers-color=dark] & {
-            color: @c-primary-dark;
-            background-color: @c-light-bg-dark;
-          }
-        }
-      }
-
-      span:first-child:not(.@{prefix}-search-highlight) {
-        position: relative;
-        display: inline-block;
-        max-width: 50%;
-        padding-right: 26px;
-        vertical-align: bottom;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        opacity: 0.8;
-
-        &::after {
-          content: '>';
-          position: absolute;
-          top: 50%;
-          right: 6px;
-          opacity: 0.6;
-          transform: translateY(-54%);
-        }
-      }
-    }
-  }
-
-  &-empty {
-    margin: 6px 0;
-    opacity: 0.6;
-    fill: @c-text;
-    [data-prefers-color=dark] & {
-      fill: @c-text-dark;
-    }
-  }
-
-  &-highlight {
-    padding: 2px 0;
-    color: #736b2d;
-    vertical-align: bottom;
-    background: #fff9cb;
-
-    [data-prefers-color=dark] & {
-      color: @c-text;
-    }
-  }
-
-  @media only screen and (max-width: 1024px) {
-    margin-right: -14px;
-
-    > input:not(:focus) {
-      color: transparent;
-      width: 32px;
-      padding-right: 0;
-      box-shadow: none;
-      cursor: pointer;
-      background-position: right 8px center;
-
-      + ul {
-        transition: 0.1s visibility;
-        visibility: hidden;
-      }
-    }
-  }
-
-  @media @mobile {
-    position: absolute;
-    top: 9px;
-    right: 24px;
-    display: block !important;
-
-    > ul {
-      right: 0;
-      left: auto;
-    }
-  }
-}