yudao
/
admin-vben
mirror of https://gitee.com/yudaocode/yudao-ui-admin-vben.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

style: header style

pull/34/MERGE
xingyu 2023-09-11 13:55:36 +08:00
parent ee8db14788
commit 8e6f2de94b
3 changed files with 14 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/layouts/default/header/components/user-dropdown/index.vue
View File

@ -94,15 +94,11 @@ function handleMenuClick(e: MenuInfo) {
<template #overlay> <template #overlay>
<Menu @click="handleMenuClick"> <Menu @click="handleMenuClick">
<MenuItem key="profile" :text="t('layout.header.accountCenter')" icon="ion:person-outline" /> <MenuItem key="profile" :text="t('layout.header.accountCenter')" icon="ion:person-outline" />
<MenuItem <MenuItem v-if="getShowDoc" key="doc" :text="t('layout.header.dropdownItemDoc')"
v-if="getShowDoc" key="doc" :text="t('layout.header.dropdownItemDoc')" icon="ion:document-text-outline" />
icon="ion:document-text-outline"
/>
<MenuDivider v-if="getShowDoc" /> <MenuDivider v-if="getShowDoc" />
<MenuItem <MenuItem v-if="getUseLockPage" key="lock" :text="t('layout.header.tooltipLock')"
v-if="getUseLockPage" key="lock" :text="t('layout.header.tooltipLock')" icon="ion:lock-closed-outline" />
icon="ion:lock-closed-outline"
/>
<MenuItem key="logout" :text="t('layout.header.dropdownItemLoginOut')" icon="ion:power-outline" /> <MenuItem key="logout" :text="t('layout.header.dropdownItemLoginOut')" icon="ion:power-outline" />
</Menu> </Menu>
</template> </template>
@ -124,6 +120,7 @@ function handleMenuClick(e: MenuInfo) {
&__avatar { &__avatar {
margin-right: 5px; margin-right: 5px;
border-radius: 50%;
} }
&__name { &__name {

5
src/layouts/default/header/index.less
View File

@ -55,7 +55,6 @@
&-logo { &-logo {
min-width: 192px; min-width: 192px;
height: @header-height; height: @header-height;
padding: 0 10px;
font-size: 14px; font-size: 14px;
img { img {
@ -116,7 +115,7 @@
display: flex !important; display: flex !important;
align-items: center; align-items: center;
height: @header-height; height: @header-height;
padding: 0 2px; padding: 0 8px;
font-size: 1.2em; font-size: 1.2em;
cursor: pointer; cursor: pointer;
@ -146,7 +145,6 @@
.@{header-prefix-cls}-action { .@{header-prefix-cls}-action {
&__item { &__item {
.app-iconify { .app-iconify {
padding: 0 10px;
font-size: 16px !important; font-size: 16px !important;
} }
@ -170,7 +168,6 @@
.@{header-prefix-cls}-action { .@{header-prefix-cls}-action {
&__item { &__item {
.app-iconify { .app-iconify {
padding: 0 10px;
font-size: 16px !important; font-size: 16px !important;
} }

17
src/layouts/default/header/index.vue
View File

@ -87,12 +87,10 @@ const getMenuMode = computed(() => {
<!-- left start --> <!-- left start -->
<div :class="`${prefixCls}-left`"> <div :class="`${prefixCls}-left`">
<!-- logo --> <!-- logo -->
<AppLogo v-if="getShowHeaderLogo || getIsMobile" :class="`${prefixCls}-logo`" :theme="getHeaderTheme" :style="getLogoWidth" /> <AppLogo v-if="getShowHeaderLogo || getIsMobile" :class="`${prefixCls}-logo`" :theme="getHeaderTheme"
<LayoutTrigger :style="getLogoWidth" />
v-if="(getShowContent && getShowHeaderTrigger && !getSplit && !getIsMixSidebar) || getIsMobile" <LayoutTrigger v-if="(getShowContent && getShowHeaderTrigger && !getSplit && !getIsMixSidebar) || getIsMobile"
:theme="getHeaderTheme" :theme="getHeaderTheme" :sider="false" />
:sider="false"
/>
<LayoutBreadcrumb v-if="getShowContent && getShowBread" :theme="getHeaderTheme" /> <LayoutBreadcrumb v-if="getShowContent && getShowBread" :theme="getHeaderTheme" />
</div> </div>
<!-- left end --> <!-- left end -->
@ -105,7 +103,7 @@ const getMenuMode = computed(() => {
<!-- action --> <!-- action -->
<div :class="`${prefixCls}-action`"> <div :class="`${prefixCls}-action`">
<AppSearch v-if="getShowSearch" :class="`${prefixCls}-action__item `" /> <AppSearch v-if="getShowSearch" :class="`${prefixCls}-action__item search-item`" />
<ErrorAction v-if="getUseErrorHandle" :class="`${prefixCls}-action__item error-action`" /> <ErrorAction v-if="getUseErrorHandle" :class="`${prefixCls}-action__item error-action`" />
@ -113,9 +111,10 @@ const getMenuMode = computed(() => {
<FullScreen v-if="getShowFullScreen" :class="`${prefixCls}-action__item fullscreen-item`" /> <FullScreen v-if="getShowFullScreen" :class="`${prefixCls}-action__item fullscreen-item`" />
<AppSizePicker :show-text="false" :class="`${prefixCls}-action__item`" /> <AppSizePicker :show-text="false" :class="`${prefixCls}-action__item size-item`" />
<AppLocalePicker v-if="getShowLocalePicker" :reload="true" :show-text="false" :class="`${prefixCls}-action__item`" /> <AppLocalePicker v-if="getShowLocalePicker" :reload="true" :show-text="false"
:class="`${prefixCls}-action__item locale-item`" />
<UserDropDown :theme="getHeaderTheme" /> <UserDropDown :theme="getHeaderTheme" />