mirror of
https://github.com/ONLYOFFICE/web-apps.git
synced 2026-07-24 11:10:56 +08:00
Logo display edits
This commit is contained in:
@ -49,10 +49,18 @@
|
||||
transition: padding-top .3s ease-in;
|
||||
}
|
||||
|
||||
.custom-logo-image {
|
||||
width: 100px;
|
||||
height: 14px;
|
||||
overflow: hidden;
|
||||
.main-logo {
|
||||
max-width: 100%;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.custom-logo-image {
|
||||
max-width: 100%;
|
||||
height: 14px;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.subnavbar {
|
||||
|
||||
@ -58,25 +58,22 @@ const MainPage = inject('storeDocumentInfo', 'users', 'storeAppOptions', 'storeV
|
||||
const isShowPlaceholder = !appOptions.isDocReady && (!customization || !(customization.loaderName || customization.loaderLogo));
|
||||
|
||||
let isBranding = true,
|
||||
isHideCustomLogo = false,
|
||||
isHideLogo = true,
|
||||
customLogoImage = '',
|
||||
customLogoUrl = '',
|
||||
isWithLogo = true;
|
||||
customLogoUrl = '';
|
||||
|
||||
if(!appOptions.isDisconnected) {
|
||||
const { logo } = customization;
|
||||
isBranding = appOptions.canBranding || appOptions.canBrandingExt;
|
||||
|
||||
if(logo && isBranding) {
|
||||
isHideCustomLogo = logo.visible === false;
|
||||
isHideLogo = logo.visible === false;
|
||||
|
||||
if(logo.image || logo.imageDark) {
|
||||
customLogoImage = colorTheme.type === 'dark' ? logo.imageDark ?? logo.image : logo.image ?? logo.imageDark;
|
||||
customLogoUrl = logo.url;
|
||||
}
|
||||
}
|
||||
|
||||
isWithLogo = customLogoImage && !isHideCustomLogo || !customLogoImage
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
@ -236,14 +233,14 @@ const MainPage = inject('storeDocumentInfo', 'users', 'storeAppOptions', 'storeV
|
||||
showPanels: state.addShowOptions,
|
||||
isBranding
|
||||
}}>
|
||||
<Page name="home" className={`editor${isWithLogo ? ' page-with-logo' : ''}`}>
|
||||
<Navbar id='editor-navbar' className={`main-navbar${isWithLogo ? ' navbar-with-logo' : ''}`}>
|
||||
<Page name="home" className={`editor${!isHideLogo || !isBranding ? ' page-with-logo' : ''}`}>
|
||||
<Navbar id='editor-navbar' className={`main-navbar${!isHideLogo || !isBranding ? ' navbar-with-logo' : ''}`}>
|
||||
<div className="main-logo" onClick={() => {
|
||||
window.open(`${customLogoImage && customLogoUrl && !isHideCustomLogo ? customLogoUrl : __PUBLISHER_URL__}`, "_blank");
|
||||
window.open(`${customLogoImage && customLogoUrl && !isHideLogo ? customLogoUrl : __PUBLISHER_URL__}`, "_blank");
|
||||
}}>
|
||||
{customLogoImage && !isHideCustomLogo ?
|
||||
{customLogoImage && !isHideLogo ?
|
||||
<img className='custom-logo-image' src={customLogoImage} />
|
||||
: isWithLogo ?
|
||||
: !customLogoImage ?
|
||||
<Icon icon="icon-logo"></Icon>
|
||||
: null}
|
||||
</div>
|
||||
|
||||
@ -129,25 +129,22 @@ class MainPage extends Component {
|
||||
const isShowPlaceholder = !appOptions.isDocReady && (!customization || !(customization.loaderName || customization.loaderLogo));
|
||||
|
||||
let isBranding = true,
|
||||
isHideCustomLogo = false,
|
||||
isHideLogo = true,
|
||||
customLogoImage = '',
|
||||
customLogoUrl = '',
|
||||
isWithLogo = true;
|
||||
customLogoUrl = '';
|
||||
|
||||
if(!appOptions.isDisconnected) {
|
||||
const { logo } = customization;
|
||||
isBranding = appOptions.canBranding || appOptions.canBrandingExt;
|
||||
|
||||
if(logo && isBranding) {
|
||||
isHideCustomLogo = logo.visible === false;
|
||||
isHideLogo = logo.visible === false;
|
||||
|
||||
if(logo.image || logo.imageDark) {
|
||||
customLogoImage = colorTheme.type === 'dark' ? logo.imageDark ?? logo.image : logo.image ?? logo.imageDark;
|
||||
customLogoUrl = logo.url;
|
||||
}
|
||||
}
|
||||
|
||||
isWithLogo = customLogoImage && !isHideCustomLogo || !customLogoImage
|
||||
}
|
||||
|
||||
return (
|
||||
@ -161,15 +158,15 @@ class MainPage extends Component {
|
||||
{!this.state.previewVisible ? null :
|
||||
<Preview closeOptions={this.handleOptionsViewClosed.bind(this)} />
|
||||
}
|
||||
<Page name="home" className={`editor${isWithLogo ? ' page-with-logo' : ''}`}>
|
||||
<Page name="home" className={`editor${!isHideLogo || !isBranding ? ' page-with-logo' : ''}`}>
|
||||
{/* Top Navbar */}
|
||||
<Navbar id='editor-navbar' className={`main-navbar${isWithLogo ? ' navbar-with-logo' : ''}`}>
|
||||
<Navbar id='editor-navbar' className={`main-navbar${!isHideLogo || !isBranding ? ' navbar-with-logo' : ''}`}>
|
||||
<div className="main-logo" onClick={() => {
|
||||
window.open(`${customLogoImage && customLogoUrl && !isHideCustomLogo ? customLogoUrl : __PUBLISHER_URL__}`, "_blank");
|
||||
window.open(`${customLogoImage && customLogoUrl && !isHideLogo ? customLogoUrl : __PUBLISHER_URL__}`, "_blank");
|
||||
}}>
|
||||
{customLogoImage && !isHideCustomLogo ?
|
||||
{customLogoImage && !isHideLogo ?
|
||||
<img className='custom-logo-image' src={customLogoImage} />
|
||||
: isWithLogo ?
|
||||
: !customLogoImage ?
|
||||
<Icon icon="icon-logo"></Icon>
|
||||
: null}
|
||||
</div>
|
||||
|
||||
@ -125,25 +125,22 @@ class MainPage extends Component {
|
||||
const isShowPlaceholder = !appOptions.isDocReady && (!customization || !(customization.loaderName || customization.loaderLogo));
|
||||
|
||||
let isBranding = true,
|
||||
isHideCustomLogo = false,
|
||||
isHideLogo = true,
|
||||
customLogoImage = '',
|
||||
customLogoUrl = '',
|
||||
isWithLogo = true;
|
||||
customLogoUrl = '';
|
||||
|
||||
if(!appOptions.isDisconnected) {
|
||||
const { logo } = customization;
|
||||
isBranding = appOptions.canBranding || appOptions.canBrandingExt;
|
||||
|
||||
if(logo && isBranding) {
|
||||
isHideCustomLogo = logo.visible === false;
|
||||
isHideLogo = logo.visible === false;
|
||||
|
||||
if(logo.image || logo.imageDark) {
|
||||
customLogoImage = colorTheme.type === 'dark' ? logo.imageDark ?? logo.image : logo.image ?? logo.imageDark;
|
||||
customLogoUrl = logo.url;
|
||||
}
|
||||
}
|
||||
|
||||
isWithLogo = customLogoImage && !isHideCustomLogo || !customLogoImage
|
||||
}
|
||||
|
||||
return (
|
||||
@ -156,15 +153,15 @@ class MainPage extends Component {
|
||||
wsProps,
|
||||
isBranding
|
||||
}}>
|
||||
<Page name="home" className={`editor${isWithLogo ? ' page-with-logo' : ''}`}>
|
||||
<Page name="home" className={`editor${!isHideLogo || !isBranding ? ' page-with-logo' : ''}`}>
|
||||
{/* Top Navbar */}
|
||||
<Navbar id='editor-navbar' className={`main-navbar${isWithLogo ? ' navbar-with-logo' : ''}`}>
|
||||
<Navbar id='editor-navbar' className={`main-navbar${!isHideLogo || !isBranding ? ' navbar-with-logo' : ''}`}>
|
||||
<div className="main-logo" onClick={() => {
|
||||
window.open(`${customLogoImage && customLogoUrl && !isHideCustomLogo ? customLogoUrl : __PUBLISHER_URL__}`, "_blank");
|
||||
window.open(`${customLogoImage && customLogoUrl && !isHideLogo ? customLogoUrl : __PUBLISHER_URL__}`, "_blank");
|
||||
}}>
|
||||
{customLogoImage && !isHideCustomLogo ?
|
||||
{customLogoImage && !isHideLogo ?
|
||||
<img className='custom-logo-image' src={customLogoImage} />
|
||||
: isWithLogo ?
|
||||
: !customLogoImage ?
|
||||
<Icon icon="icon-logo"></Icon>
|
||||
: null}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user