chore: fix footer overflow
This commit is contained in:
@@ -354,7 +354,7 @@ class Footer extends AbstractComponent<Props, State> {
|
|||||||
id="footer-bar"
|
id="footer-bar"
|
||||||
className="z-footer-bar hidden h-8 w-full select-none items-center justify-between border-t border-border bg-contrast px-3 text-text md:flex"
|
className="z-footer-bar hidden h-8 w-full select-none items-center justify-between border-t border-border bg-contrast px-3 text-text md:flex"
|
||||||
>
|
>
|
||||||
<div className="left flex h-full">
|
<div className="left flex h-full flex-shrink-0">
|
||||||
<div className="sk-app-bar-item relative z-footer-bar-item ml-0 select-none">
|
<div className="sk-app-bar-item relative z-footer-bar-item ml-0 select-none">
|
||||||
<AccountMenuButton
|
<AccountMenuButton
|
||||||
application={this.application}
|
application={this.application}
|
||||||
@@ -393,14 +393,14 @@ class Footer extends AbstractComponent<Props, State> {
|
|||||||
</Fragment>
|
</Fragment>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
<div className="center">
|
<div className="center max-h-full overflow-hidden px-4">
|
||||||
{this.state.arbitraryStatusMessage && (
|
{this.state.arbitraryStatusMessage && (
|
||||||
<div className="relative z-footer-bar-item flex select-none items-center text-xs font-bold text-neutral">
|
<div className="relative z-footer-bar-item max-h-full select-none items-center overflow-hidden text-ellipsis whitespace-nowrap text-xs font-bold text-neutral">
|
||||||
{this.state.arbitraryStatusMessage}
|
{this.state.arbitraryStatusMessage}
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
<div className="right flex h-full">
|
<div className="right flex h-full flex-shrink-0">
|
||||||
{this.state.dataUpgradeAvailable && (
|
{this.state.dataUpgradeAvailable && (
|
||||||
<div
|
<div
|
||||||
onClick={this.securityUpdateClickHandler}
|
onClick={this.securityUpdateClickHandler}
|
||||||
@@ -418,7 +418,7 @@ class Footer extends AbstractComponent<Props, State> {
|
|||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{(this.state.outOfSync || this.state.showSyncResolution) && (
|
{(this.state.outOfSync || this.state.showSyncResolution) && (
|
||||||
<div className="relative z-footer-bar-item ml-3 flex select-none items-center">
|
<div className="relative z-footer-bar-item ml-3 flex flex-shrink-0 select-none items-center">
|
||||||
{this.state.outOfSync && (
|
{this.state.outOfSync && (
|
||||||
<div onClick={this.syncResolutionClickHandler} className="text-xs font-bold text-warning">
|
<div onClick={this.syncResolutionClickHandler} className="text-xs font-bold text-warning">
|
||||||
Potentially Out of Sync
|
Potentially Out of Sync
|
||||||
@@ -430,7 +430,7 @@ class Footer extends AbstractComponent<Props, State> {
|
|||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{this.state.offline && (
|
{this.state.offline && (
|
||||||
<div className="relative z-footer-bar-item ml-3 flex select-none items-center text-xs font-bold">
|
<div className="relative z-footer-bar-item ml-3 flex flex-shrink-0 select-none items-center text-xs font-bold">
|
||||||
Offline
|
Offline
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|||||||
Reference in New Issue
Block a user