random-mirrors/cosmos-explorer
1
0
Fork 0
mirror of https://github.com/Azure/cosmos-explorer.git synced 2025-10-13 15:28:05 +01:00
Code Issues Packages Projects Releases Wiki Activity

3556812

Browse Source
This commit is contained in:
Satyapriya Bai 2025-02-17 12:28:55 +05:30
parent 20151c155b
commit a569dcf32d
2 changed files with 25 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/Explorer/Menus/NotificationConsole/NotificationConsole.less
View File

@ -1,6 +1,6 @@
@import "../../../../less/Common/Constants";
@ConsoleHeaderHeight: 32px;
// @ConsoleHeaderHeight: 32px;
@ConsoleContentsPaneHeight: 220px;
@ConsoleStatusMaxWidth: 672px;
@ -22,7 +22,7 @@
justify-content: space-between;
align-items: center;
flex-shrink: 0;
height: @ConsoleHeaderHeight;
// height: @ConsoleHeaderHeight;
width: 100%;
background-color: @NotificationLow;
border-top: @ButtonBorderWidth @BaseMedium solid;
@ -38,6 +38,9 @@
}
.statusBar {
width: 100%;
padding: 6px 0px;
.dataTypeIcons {
cursor: pointer;
margin: 0px @DefaultSpace 0px @MediumSpace;
@ -76,11 +79,14 @@
max-width: @ConsoleStatusMaxWidth;
}
}
&:focus {
outline: none;
}
}
.expandCollapseButton {
cursor: pointer;
padding-right: 5px;
padding: 6px 5px 6px 0px;
img {
width: @ExpandCollapseIconSize;

31
src/Explorer/Menus/NotificationConsole/NotificationConsoleComponent.tsx
View File

@ -81,9 +81,9 @@ export class NotificationConsoleComponent extends React.Component<
}
}
public setElememntRef = (element: HTMLElement): void => {
this.consoleHeaderElement = element;
};
// public setElememntRef = (element: HTMLElement): void => {
// this.consoleHeaderElement = element;
// };
public render(): JSX.Element {
const numInProgress = this.state.allConsoleData.filter(
@ -98,15 +98,14 @@ export class NotificationConsoleComponent extends React.Component<
return (
<div className="notificationConsoleContainer">
<div
className="notificationConsoleHeader"
id="notificationConsoleHeader"
ref={this.setElememntRef}
onClick={() => this.expandCollapseConsole()}
onKeyDown={(event: React.KeyboardEvent<HTMLDivElement>) => this.onExpandCollapseKeyPress(event)}
tabIndex={0}
>
<div className="statusBar">
<div className="notificationConsoleHeader" id="notificationConsoleHeader">
<div
className="statusBar"
// ref={this.setElememntRef}
onClick={() => this.expandCollapseConsole()}
onKeyDown={(event: React.KeyboardEvent<HTMLDivElement>) => this.onExpandCollapseKeyPress(event)}
tabIndex={0}
>
<span className="dataTypeIcons">
<span className="notificationConsoleHeaderIconWithData">
<img src={LoadingIcon} alt="In progress items" />
@ -136,6 +135,8 @@ export class NotificationConsoleComponent extends React.Component<
tabIndex={0}
aria-label="Console"
aria-expanded={this.props.isConsoleExpanded}
onClick={() => this.expandCollapseConsole()}
onKeyDown={(event: React.KeyboardEvent<HTMLDivElement>) => this.onExpandCollapseKeyPress(event)}
>
<img
src={this.props.isConsoleExpanded ? ChevronDownIcon : ChevronUpIcon}
@ -259,9 +260,9 @@ export class NotificationConsoleComponent extends React.Component<
}
private onConsoleWasExpanded = (): void => {
if (this.props.isConsoleExpanded && this.consoleHeaderElement) {
this.consoleHeaderElement.focus();
}
// if (this.props.isConsoleExpanded && this.consoleHeaderElement) {
// this.consoleHeaderElement.focus();
// }
useNotificationConsole.getState().setConsoleAnimationFinished(true);
};