style: 调整LOGO样式

This commit is contained in:
TsMask
2023-10-27 15:58:04 +08:00
parent 5d30d738ca
commit 2012837024
2 changed files with 10 additions and 10 deletions

View File

@@ -203,7 +203,7 @@ document.addEventListener('visibilitychange', function () {
</template> </template>
<template v-if="appStore.logoType === 'brand'"> <template v-if="appStore.logoType === 'brand'">
<img <img
class="logo-brand" :class="{'logo-brand': proConfig.layout !== 'side'}"
:src="appStore.getLOGOBrand" :src="appStore.getLOGOBrand"
:alt="t('common.title')" :alt="t('common.title')"
:title="appStore.appName" :title="appStore.appName"
@@ -281,17 +281,17 @@ document.addEventListener('visibilitychange', function () {
.logo-brand { .logo-brand {
height: 48px; height: 48px;
width: 224px; width: 174px;
vertical-align: middle; vertical-align: middle;
border-style: none; border-style: none;
margin-right: 12px; margin-right: 16px;
} }
.title { .title {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
width: 180px; width: 130px;
} }
.footer { .footer {

View File

@@ -164,7 +164,7 @@ onMounted(() => {
<a-col :lg="12" :md="12" :xs="24" style="margin-bottom: 30px"> <a-col :lg="12" :md="12" :xs="24" style="margin-bottom: 30px">
<div class="header"> <div class="header">
<div class="header-brand" v-show="state.type === 'brand'"> <div class="header-brand" v-show="state.type === 'brand'">
<img :width="224" :height="48" :src="state.brand" /> <img :width="174" :height="48" :src="state.brand" />
</div> </div>
<div class="header-icon" v-show="state.type === 'icon'"> <div class="header-icon" v-show="state.type === 'icon'">
<img :src="state.icon" /> <img :src="state.icon" />
@@ -219,7 +219,7 @@ onMounted(() => {
<a-typography-title :level="5">全图</a-typography-title> <a-typography-title :level="5">全图</a-typography-title>
<a-typography-paragraph> <a-typography-paragraph>
将整张图片展示到系统LOGO区域请使用透明背景尺寸比例大小 将整张图片展示到系统LOGO区域请使用透明背景尺寸比例大小
<a-typography-text mark>224x48</a-typography-text> <a-typography-text mark>174x48</a-typography-text>
</a-typography-paragraph> </a-typography-paragraph>
<a-typography-title :level="5">小图</a-typography-title> <a-typography-title :level="5">小图</a-typography-title>
<a-typography-paragraph> <a-typography-paragraph>
@@ -242,7 +242,7 @@ onMounted(() => {
margin-bottom: 24px; margin-bottom: 24px;
&-brand { &-brand {
width: 224px; width: 174px;
height: 48px; height: 48px;
margin-right: 12px; margin-right: 12px;
border: 1px var(--ant-primary-color) solid; border: 1px var(--ant-primary-color) solid;
@@ -250,10 +250,10 @@ onMounted(() => {
&-icon { &-icon {
display: flex; display: flex;
align-content: center; align-content: center;
min-width: 192px; min-width: 174px;
height: 100%; height: 100%;
align-items: center; align-items: center;
margin-right: 12px; margin-right: 16px;
border: 1px var(--ant-primary-color) solid; border: 1px var(--ant-primary-color) solid;
& > img { & > img {
@@ -266,7 +266,7 @@ onMounted(() => {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
width: 180px; width: 130px;
color: #fff; color: #fff;
margin: 0 0 0 12px; margin: 0 0 0 12px;
font-weight: 600; font-weight: 600;