fm453/nocobase
1
0
Fork 0
mirror of https://gitee.com/nocobase/nocobase.git synced 2025-07-02 03:02:19 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: make logo container width adaptive based on content type (#7075)

Browse Source 
* feat: make logo container width adaptive based on content type

* feat: add a minimum width to the text title
This commit is contained in:
chenyongxin 2025-06-16 17:41:59 +08:00 committed by GitHub
parent 0e669c0bd3
commit f1d9ea0336
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 14 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
packages/core/client/src/route-switch/antd/admin-layout/index.tsx
View File

@ -177,7 +177,6 @@ const layoutContentClass = css`
`; `;
const className1 = css` const className1 = css`
width: 168px;
height: var(--nb-header-height); height: var(--nb-header-height);
margin-right: 4px; margin-right: 4px;
display: inline-flex; display: inline-flex;
@ -186,6 +185,15 @@ const className1 = css`
padding: 0; padding: 0;
align-items: center; align-items: center;
`; `;
const className1WithFixedWidth = css`
${className1}
width: 168px;
`;
const className1WithAutoWidth = css`
${className1}
width: auto;
min-width: 168px;
`;
const className2 = css` const className2 = css`
object-fit: contain; object-fit: contain;
width: 100%; width: 100%;
@ -263,7 +271,8 @@ const NocoBaseLogo = () => {
const { token } = useToken(); const { token } = useToken();
const fontSizeStyle = useMemo(() => ({ fontSize: token.fontSizeHeading3 }), [token.fontSizeHeading3]); const fontSizeStyle = useMemo(() => ({ fontSize: token.fontSizeHeading3 }), [token.fontSizeHeading3]);
const logo = result?.data?.data?.logo?.url ? ( const hasLogo = result?.data?.data?.logo?.url;
const logo = hasLogo ? (
<img className={className2} src={result?.data?.data?.logo?.url} /> <img className={className2} src={result?.data?.data?.logo?.url} />
) : ( ) : (
<span style={fontSizeStyle} className={className3}> <span style={fontSizeStyle} className={className3}>
@ -271,7 +280,9 @@ const NocoBaseLogo = () => {
</span> </span>
); );
return <div className={className1}>{result?.loading ? null : logo}</div>; return (
<div className={hasLogo ? className1WithFixedWidth : className1WithAutoWidth}>{result?.loading ? null : logo}</div>
);
}; };
/** /**