perf(logo): optimize logo code
| | |
| | | "scripts": { |
| | | "bootstrap": "yarn install", |
| | | "serve": "esno ./build/script/preserve.ts && cross-env NODE_ENV=development vite", |
| | | "build": " rimraf dist && cross-env NODE_ENV=production vite build && esno ./build/script/postBuild.ts", |
| | | "build": "cross-env NODE_ENV=production vite build && esno ./build/script/postBuild.ts", |
| | | "build:site": "cross-env SITE=true npm run build ", |
| | | "build:no-cache": "yarn clean:cache && npm run build", |
| | | "typecheck": "typecheck .", |
| | |
| | | |
| | | &.is-link, |
| | | a { |
| | | font-weight: 700; |
| | | font-weight: 500; |
| | | color: @text-color-base; |
| | | text-decoration: none; |
| | | transition: color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); |
| | |
| | | const searchClass = computed(() => { |
| | | const cls: string[] = []; |
| | | cls.push(props.theme ? `menu-search-input__search--${props.theme}` : ''); |
| | | // cls.push(props.collapsed ? 'hide-search-icon' : ''); |
| | | cls.push(props.collapsed ? 'hide-search-icon' : ''); |
| | | return cls; |
| | | }); |
| | | |
| | |
| | | .menu-search-input { |
| | | margin: 12px 8px; |
| | | |
| | | // &.hide-search-icon { |
| | | // .ant-input, |
| | | // .ant-input-suffix { |
| | | // opacity: 0; |
| | | // } |
| | | // } |
| | | &.hide-search-icon { |
| | | .ant-input, |
| | | .ant-input-suffix { |
| | | opacity: 0; |
| | | transition: all 0.5s; |
| | | } |
| | | } |
| | | |
| | | &__search--dark { |
| | | .ant-input-affix-wrapper, |
| | |
| | | <template> |
| | | <div class="app-logo" @click="handleGoHome" :style="wrapStyle"> |
| | | <div class="app-logo anticon" @click="handleGoHome" :style="wrapStyle"> |
| | | <img :src="logo" /> |
| | | <div v-if="show" class="logo-title ml-2 ellipsis">{{ globSetting.title }}</div> |
| | | </div> |
| | |
| | | align-items: center; |
| | | padding-left: 16px; |
| | | cursor: pointer; |
| | | justify-content: center; |
| | | // justify-content: center; |
| | | |
| | | .logo-title { |
| | | display: none; |
| | | font-size: 16px; |
| | | font-size: 18px; |
| | | font-weight: 400; |
| | | opacity: 0; |
| | | transition: all 0.5s; |
| | | .respond-to(medium,{ |
| | | display: block; |
| | | opacity: 1; |
| | | }); |
| | | } |
| | | } |
| | |
| | | return () => { |
| | | const { |
| | | showLogo, |
| | | menuSetting: { type: menuType, mode, theme, collapsed, collapsedShowTitle }, |
| | | menuSetting: { |
| | | type: menuType, |
| | | mode, |
| | | theme, |
| | | collapsed, |
| | | collapsedShowTitle, |
| | | collapsedShowSearch, |
| | | }, |
| | | } = unref(getProjectConfigRef); |
| | | |
| | | const isSidebarType = menuType === MenuTypeEnum.SIDEBAR; |
| | |
| | | collapsedShowTitle={collapsedShowTitle} |
| | | theme={themeData} |
| | | showLogo={isShowLogo} |
| | | search={unref(showSearchRef) && !collapsed} |
| | | search={unref(showSearchRef) && (collapsedShowSearch ? true : !collapsed)} |
| | | items={unref(menusRef)} |
| | | flatItems={unref(flatMenusRef)} |
| | | onClickSearchInput={handleClickSearchInput} |
| | |
| | | {{ |
| | | header: () => |
| | | isShowLogo && ( |
| | | <Logo |
| | | showTitle={!collapsed} |
| | | class={[`layout-menu__logo`, collapsed ? 'justify-center' : '', themeData]} |
| | | /> |
| | | <Logo showTitle={!collapsed} class={[`layout-menu__logo`, themeData]} /> |
| | | ), |
| | | }} |
| | | </BasicMenu> |
| | |
| | | .layout-menu { |
| | | &__logo { |
| | | height: @header-height; |
| | | padding: 10px 4px; |
| | | padding: 10px 4px 10px 10px; |
| | | |
| | | img { |
| | | width: @logo-width; |
| | |
| | | split: false, |
| | | // 顶部菜单布局 |
| | | topMenuAlign: 'center', |
| | | // 折叠菜单时候隐藏搜索框 |
| | | collapsedShowSearch: true, |
| | | }, |
| | | // 消息配置 |
| | | messageSetting: { |
| | |
| | | type: MenuTypeEnum; |
| | | theme: MenuThemeEnum; |
| | | topMenuAlign: 'start' | 'center' | 'end'; |
| | | collapsedShowSearch: boolean; |
| | | } |
| | | |
| | | export interface MultiTabsSetting { |
| | |
| | | <div class="login-form mx-6"> |
| | | <div class="login-form__content px-2 py-10"> |
| | | <header> |
| | | <img src="/@/assets/images/logo.png" class="mr-4" /> |
| | | <img :src="logo" class="mr-4" /> |
| | | <h1>{{ title }}</h1> |
| | | </header> |
| | | |
| | |
| | | // import { appStore } from '/@/store/modules/app'; |
| | | import { useMessage } from '/@/hooks/web/useMessage'; |
| | | import { useSetting } from '/@/hooks/core/useSetting'; |
| | | import logo from '/@/assets/images/logo.png'; |
| | | |
| | | export default defineComponent({ |
| | | components: { |
| | |
| | | autoLogin: autoLoginRef, |
| | | // openLoginVerify: openLoginVerifyRef, |
| | | title: globSetting && globSetting.title, |
| | | logo, |
| | | }; |
| | | }, |
| | | }); |
| | |
| | | string.prototype.trimstart "^1.0.1" |
| | | |
| | | es-module-lexer@^0.3.25: |
| | | version "0.3.25" |
| | | resolved "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-0.3.25.tgz#24a1abcb9c5dc96923a8e42be033b801f788de06" |
| | | integrity sha512-H9VoFD5H9zEfiOX2LeTWDwMvAbLqcAyA2PIb40TOAvGpScOjit02oTGWgIh+M0rx2eJOKyJVM9wtpKFVgnyC3A== |
| | | version "0.3.26" |
| | | resolved "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-0.3.26.tgz#7b507044e97d5b03b01d4392c74ffeb9c177a83b" |
| | | integrity sha512-Va0Q/xqtrss45hWzP8CZJwzGSZJjDM5/MJRE3IXXnUCcVLElR9BRaE9F62BopysASyc4nM3uwhSW7FFB9nlWAA== |
| | | |
| | | es-to-primitive@^1.2.1: |
| | | version "1.2.1" |
| | |
| | | source-map-support "^0.5.19" |
| | | strip-json-comments "^3.1.1" |
| | | |
| | | esbuild@^0.7.17, esbuild@^0.7.19, esbuild@^0.7.21: |
| | | esbuild@^0.7.17, esbuild@^0.7.19: |
| | | version "0.7.21" |
| | | resolved "https://registry.npmjs.org/esbuild/-/esbuild-0.7.21.tgz#e93f9d7e673cd5fcab2aab7774d489a0f680d657" |
| | | integrity sha512-qEnJdj+6Mdpt5kZwwCqO6PDNXSHNDDOPbnF4pduS3nub1v5GfgZfi8ysZ2DN4Q65WWgx6hz1a237ZETEHZpR0Q== |
| | | |
| | | esbuild@^0.7.21: |
| | | version "0.7.22" |
| | | resolved "https://registry.npmjs.org/esbuild/-/esbuild-0.7.22.tgz#9149b903f8128b7c45a754046c24199d76bbe08e" |
| | | integrity sha512-B43SYg8LGWYTCv9Gs0RnuLNwjzpuWOoCaZHTWEDEf5AfrnuDMerPVMdCEu7xOdhFvQ+UqfP2MGU9lxEy0JzccA== |
| | | |
| | | escalade@^3.1.0, escalade@^3.1.1: |
| | | version "3.1.1" |
| | |
| | | resolved "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz#2de9b68f6528d5644ef5c59526a1b4a07306169f" |
| | | integrity sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw== |
| | | |
| | | execa@^4.0.3: |
| | | version "4.0.3" |
| | | resolved "https://registry.npmjs.org/execa/-/execa-4.0.3.tgz#0a34dabbad6d66100bd6f2c576c8669403f317f2" |
| | | integrity sha512-WFDXGHckXPWZX19t1kCsXzOpqX9LWYNqn4C+HqZlk/V0imTkzJZqf87ZBhvpHaftERYknpk0fjSylnXVlVgI0A== |
| | | dependencies: |
| | | cross-spawn "^7.0.0" |
| | | get-stream "^5.0.0" |
| | | human-signals "^1.1.1" |
| | | is-stream "^2.0.0" |
| | | merge-stream "^2.0.0" |
| | | npm-run-path "^4.0.0" |
| | | onetime "^5.1.0" |
| | | signal-exit "^3.0.2" |
| | | strip-final-newline "^2.0.0" |
| | | |
| | | execa@^4.1.0: |
| | | execa@^4.0.3, execa@^4.1.0: |
| | | version "4.1.0" |
| | | resolved "https://registry.npmjs.org/execa/-/execa-4.1.0.tgz#4e5491ad1572f2f17a77d388c6c857135b22847a" |
| | | integrity sha512-j5W0//W7f8UxAn8hXVnwG8tLwdiUy4FJLcSupCg6maBYZDpyBvTApK7KyuI4bKj8KOh1r2YH+6ucuYtJv1bTZA== |
| | |
| | | merge-stream "^2.0.0" |
| | | supports-color "^6.1.0" |
| | | |
| | | jest-worker@^26.0.0, jest-worker@^26.2.1: |
| | | jest-worker@^26.0.0: |
| | | version "26.6.1" |
| | | resolved "https://registry.npmjs.org/jest-worker/-/jest-worker-26.6.1.tgz#c2ae8cde6802cc14056043f997469ec170d9c32a" |
| | | integrity sha512-R5IE3qSGz+QynJx8y+ICEkdI2OJ3RJjRQVEyCcFAd3yVhQSEtquziPO29Mlzgn07LOVE8u8jhJ1FqcwegiXWOw== |
| | | dependencies: |
| | | "@types/node" "*" |
| | | merge-stream "^2.0.0" |
| | | supports-color "^7.0.0" |
| | | |
| | | jest-worker@^26.2.1: |
| | | version "26.6.2" |
| | | resolved "https://registry.npmjs.org/jest-worker/-/jest-worker-26.6.2.tgz#7f72cbc4d643c365e27b9fd775f9d0eaa9c7a8ed" |
| | | integrity sha512-KWYVV1c4i+jbMpaBC+U++4Va0cp8OisU185o73T1vo99hqi7w8tSJfUXYswwqqrjzwxa6KpRK54WhPvwf5w6PQ== |
| | | dependencies: |
| | | "@types/node" "*" |
| | | merge-stream "^2.0.0" |
| | |
| | | yargs "^16.0.3" |
| | | |
| | | rollup-plugin-vue@^6.0.0-beta.10: |
| | | version "6.0.0-beta.10" |
| | | resolved "https://registry.npmjs.org/rollup-plugin-vue/-/rollup-plugin-vue-6.0.0-beta.10.tgz#66d9b9a8dd2d085267d1cc398ea0113360879ac1" |
| | | integrity sha512-8TZJmROiSRjWoHRR6id0/ktOBOUGuI302xDBq4YBiA/tnnXdoY3oFGtvRWzT5ldX0jTJ8QX40rrJOw2SvcWwxQ== |
| | | version "6.0.0-beta.11" |
| | | resolved "https://registry.npmjs.org/rollup-plugin-vue/-/rollup-plugin-vue-6.0.0-beta.11.tgz#fdbc6b7484a361ef8c5e8009cef4a6bd45435013" |
| | | integrity sha512-osqLkFc7N76TOI0CeW0BOujlMFsMIoytyTRVUivaeYSMponNfk1iSuqyoeciUB3EjFqyL/dTTFPi+7rhaAm73w== |
| | | dependencies: |
| | | debug "^4.1.1" |
| | | hash-sum "^2.0.0" |