random-mirrors/cosmos-explorer
1
0
Fork 0
mirror of https://github.com/Azure/cosmos-explorer.git synced 2025-12-20 17:30:46 +00:00
Code Issues Packages Projects Releases Wiki Activity

Format fixed.

Browse Source
This commit is contained in:
Satyapriya Bai
2025-04-21 19:16:01 +05:30
parent 0a73c20ec9
commit e3aa31ae9b
3 changed files with 18 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
src/Explorer/Sidebar.tsx
View File

@@ -121,7 +121,7 @@ const useSidebarStyles = makeStyles({
minHeightZoom: { minHeightZoom: {
minHeight: "400px", minHeight: "400px",
} },
}); });
interface GlobalCommandsProps { interface GlobalCommandsProps {
@@ -347,12 +347,16 @@ export const SidebarContainer: React.FC<SidebarProps> = ({ explorer }) => {
ref={allotment} ref={allotment}
onChange={onChange} onChange={onChange}
onDragEnd={onDragEnd} onDragEnd={onDragEnd}
className={`resourceTreeAndTabs ${styles.accessibleContent} ${isZoomed ? styles.accessibleContentZoom : ''}`} className={`resourceTreeAndTabs ${styles.accessibleContent} ${isZoomed ? styles.accessibleContentZoom : ""}`}
> >
{/* Collections Tree - Start */} {/* Collections Tree - Start */}
{hasSidebar && ( {hasSidebar && (
// When collapsed, we force the pane to 24 pixels wide and make it non-resizable. // When collapsed, we force the pane to 24 pixels wide and make it non-resizable.
<Allotment.Pane className={`${styles.minHeightResponsive} ${isZoomed ? styles.minHeightZoom : ''}`} minSize={24} preferredSize={250}> <Allotment.Pane
className={`${styles.minHeightResponsive} ${isZoomed ? styles.minHeightZoom : ""}`}
minSize={24}
preferredSize={250}
>
<CosmosFluentProvider className={mergeClasses(styles.sidebar)}> <CosmosFluentProvider className={mergeClasses(styles.sidebar)}>
<div className={styles.sidebarContainer}> <div className={styles.sidebarContainer}>
{loading && ( {loading && (
@@ -408,7 +412,10 @@ export const SidebarContainer: React.FC<SidebarProps> = ({ explorer }) => {
</CosmosFluentProvider> </CosmosFluentProvider>
</Allotment.Pane> </Allotment.Pane>
)} )}
<Allotment.Pane className={`${styles.minHeightResponsive} ${isZoomed ? styles.minHeightZoom : ''}`} minSize={200}> <Allotment.Pane
className={`${styles.minHeightResponsive} ${isZoomed ? styles.minHeightZoom : ""}`}
minSize={200}
>
<Tabs explorer={explorer} /> <Tabs explorer={explorer} />
</Allotment.Pane> </Allotment.Pane>
</Allotment> </Allotment>

6
src/Explorer/Tabs/QueryTab/QueryResultSection.tsx
View File

@@ -29,7 +29,11 @@ const ExecuteQueryCallToAction: React.FC = () => {
<div data-test="QueryTab/ResultsPane/ExecuteCTA" className={styles.executeCallToAction}> <div data-test="QueryTab/ResultsPane/ExecuteCTA" className={styles.executeCallToAction}>
<div> <div>
<p> <p>
<img className={`${styles.responsiveImg} ${isZoomed ? styles.zoomedImageSize : ''}`} src={RunQuery} aria-hidden="true" /> <img
className={`${styles.responsiveImg} ${isZoomed ? styles.zoomedImageSize : ""}`}
src={RunQuery}
aria-hidden="true"
/>
</p> </p>
<p>Execute a query to see the results</p> <p>Execute a query to see the results</p>
</div> </div>

1
src/Explorer/Tabs/QueryTab/Styles.ts
View File

@@ -107,5 +107,4 @@ export const useQueryTabStyles = makeStyles({
zoomedImageSize: { zoomedImageSize: {
width: "60px", width: "60px",
}, },
}); });