mt-ui-components-vue3/lib/ProLayout/TopHeader/index.style.js

玛果添实UI组件库(Vue3)

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _antdStyle = require("antd-style");
var useStyles = (0, _antdStyle.createStyles)(function (_ref) {
  var token = _ref.token;
  return {
    "@{pro-layout-global-header-prefix-cls}": {
      position: "relative",
      display: "flex",
      alignItems: "center",
      height: "100%",
      padding: "0 16px",
      background: token["pro-layout-header-bg"],
      boxShadow: token["pro-layout-header-box-shadow"],
      "> *": {
        height: "100%"
      },
      "&-collapsed-button": {
        display: "flex",
        alignItems: "center",
        marginLeft: "16px",
        fontSize: "20px"
      },
      "&-layout": {
        "&-mix": {
          backgroundColor: token["layout-sider-background"]
        }
      },
      "&-logo": {
        position: "relative",
        overflow: "hidden",
        a: {
          display: "flex",
          alignItems: "center",
          height: "100%",
          img: {
            height: "28px"
          },
          h1: {
            height: "32px",
            margin: "0 0 0 12px",
            color: token.colorPrimary,
            fontWeight: "600",
            fontSize: "18px",
            lineHeight: "32px"
          }
        }
      }
    },
    "@{pro-layout-global-header-prefix-cls}-logo": {
      h1: {
        color: token["btn-primary-color"]
      }
    },
    anticon: {
      marginRight: "8px",
      color: token["btn-primary-color"]
    },
    "@{ant-prefix}-dropdown-menu-item": {
      minWidth: "160px"
    },
    dark: {
      height: token["pro-layout-header-height"]
    },
    action: {
      color: "rgba(255, 255, 255, 0.85)",
      "> i": {
        color: "rgba(255, 255, 255, 0.85)"
      },
      "&:hover, &.opened": {
        background: token.colorPrimary
      }
    },
    "@{ant-prefix}-badge": {
      color: "unset"
    },
    "@{top-nav-header-prefix-cls}": {
      position: "relative",
      width: "100%",
      height: "100%",
      boxShadow: "0 1px 4px 0 rgba(0, 21, 41, 0.12)",
      transition: "background 0.3s, width 0.2s",
      "&-main": {
        display: "flex",
        height: "100%",
        paddingLeft: "16px",
        "&-left": {
          display: "flex",
          minWidth: "192px"
        }
      },
      "&-logo": {
        position: "relative",
        minWidth: "165px",
        height: "100%",
        overflow: "hidden",
        img: {
          display: "inline-block",
          height: "32px",
          verticalAlign: "middle"
        },
        h1: {
          display: "inline-block",
          margin: "0 0 0 12px",
          color: token["btn-primary-color"],
          fontWeight: "600",
          fontSize: "16px",
          verticalAlign: "top"
        }
      },
      "&-menu": {
        minWidth: "0"
      }
    },
    "@{ant-prefix}-menu": {
      background: "transparent"
    },
    "@{top-nav-header-prefix-cls}-logo": {
      h1: {
        color: token.colorTextHeading
      }
    },
    "@{ant-prefix}-menu.@{ant-prefix}-menu-horizontal": {
      height: "100%",
      border: "none"
    },
    "@{ant-prefix}-menu-item": {
      height: "100%"
    },
    light: {
      backgroundColor: token.colorBgContainer
    }
  };
});
var _default = useStyles;
exports.default = _default;