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

Improve sidebar UI layout when narrow (#1938)

Browse Source 
* improve how the sidebar reacts to being a smol lil' guy

* fix snapshots

* shrink minimum sizes to allow small screens to work in some way
This commit is contained in:
Ashley Stanton-Nurse
2024-08-21 09:55:57 -07:00
committed by GitHub
parent 5a5e155205
commit d3722f2c99
3 changed files with 57 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/Explorer/Controls/TreeComponent/Styles.ts
View File

@@ -25,7 +25,9 @@ export const useTreeStyles = makeStyles({
height: `var(${treeIconWidth})`,
},
treeItem: {},
nodeLabel: {},
nodeLabel: {
whiteSpace: "nowrap", // Don't wrap text, there will be a scrollbar.
},
treeItemLayout: {
fontSize: tokens.fontSizeBase300,
height: tokens.layoutRowHeight,

50
src/Explorer/Controls/TreeComponent/__snapshots__/TreeNodeComponent.test.tsx.snap
View File

@@ -19,7 +19,7 @@ exports[`TreeNodeComponent does not render children if the node is loading 1`] =
}
>
<span
className=""
className="___1h29e9h_0000000 fz5stix"
>
rootLabel
</span>
@@ -183,7 +183,7 @@ exports[`TreeNodeComponent fully renders a tree 1`] = `
class="fui-TreeItemLayout__main rklbe47"
>
<span
class=""
class="___1h29e9h_0000000 fz5stix"
>
rootLabel
</span>
@@ -235,7 +235,7 @@ exports[`TreeNodeComponent fully renders a tree 1`] = `
class="fui-TreeItemLayout__main rklbe47"
>
<span
class=""
class="___1h29e9h_0000000 fz5stix"
>
rootLabel
</span>
@@ -283,7 +283,7 @@ exports[`TreeNodeComponent fully renders a tree 1`] = `
class="fui-TreeItemLayout__main rklbe47"
>
<span
class=""
class="___1h29e9h_0000000 fz5stix"
>
child1Label
</span>
@@ -327,7 +327,7 @@ exports[`TreeNodeComponent fully renders a tree 1`] = `
class="fui-TreeItemLayout__main rklbe47"
>
<span
class=""
class="___1h29e9h_0000000 fz5stix"
>
child2LoadingLabel
</span>
@@ -367,7 +367,7 @@ exports[`TreeNodeComponent fully renders a tree 1`] = `
class="fui-TreeItemLayout__main rklbe47"
>
<span
class=""
class="___1h29e9h_0000000 fz5stix"
>
child3ExpandingLabel
</span>
@@ -423,7 +423,7 @@ exports[`TreeNodeComponent fully renders a tree 1`] = `
className="fui-TreeItemLayout__main rklbe47"
>
<span
className=""
className="___1h29e9h_0000000 fz5stix"
>
rootLabel
</span>
@@ -614,7 +614,7 @@ exports[`TreeNodeComponent fully renders a tree 1`] = `
class="fui-TreeItemLayout__main rklbe47"
>
<span
class=""
class="___1h29e9h_0000000 fz5stix"
>
child1Label
</span>
@@ -666,7 +666,7 @@ exports[`TreeNodeComponent fully renders a tree 1`] = `
class="fui-TreeItemLayout__main rklbe47"
>
<span
class=""
class="___1h29e9h_0000000 fz5stix"
>
child1Label
</span>
@@ -720,7 +720,7 @@ exports[`TreeNodeComponent fully renders a tree 1`] = `
className="fui-TreeItemLayout__main rklbe47"
>
<span
className=""
className="___1h29e9h_0000000 fz5stix"
>
child1Label
</span>
@@ -848,7 +848,7 @@ exports[`TreeNodeComponent fully renders a tree 1`] = `
class="fui-TreeItemLayout__main rklbe47"
>
<span
class=""
class="___1h29e9h_0000000 fz5stix"
>
child2LoadingLabel
</span>
@@ -900,7 +900,7 @@ exports[`TreeNodeComponent fully renders a tree 1`] = `
class="fui-TreeItemLayout__main rklbe47"
>
<span
class=""
class="___1h29e9h_0000000 fz5stix"
>
child2LoadingLabel
</span>
@@ -954,7 +954,7 @@ exports[`TreeNodeComponent fully renders a tree 1`] = `
className="fui-TreeItemLayout__main rklbe47"
>
<span
className=""
className="___1h29e9h_0000000 fz5stix"
>
child2LoadingLabel
</span>
@@ -1063,7 +1063,7 @@ exports[`TreeNodeComponent fully renders a tree 1`] = `
class="fui-TreeItemLayout__main rklbe47"
>
<span
class=""
class="___1h29e9h_0000000 fz5stix"
>
child3ExpandingLabel
</span>
@@ -1111,7 +1111,7 @@ exports[`TreeNodeComponent fully renders a tree 1`] = `
class="fui-TreeItemLayout__main rklbe47"
>
<span
class=""
class="___1h29e9h_0000000 fz5stix"
>
child3ExpandingLabel
</span>
@@ -1153,7 +1153,7 @@ exports[`TreeNodeComponent fully renders a tree 1`] = `
className="fui-TreeItemLayout__main rklbe47"
>
<span
className=""
className="___1h29e9h_0000000 fz5stix"
>
child3ExpandingLabel
</span>
@@ -1195,7 +1195,7 @@ exports[`TreeNodeComponent renders a loading spinner if the node is loading: loa
}
>
<span
className=""
className="___1h29e9h_0000000 fz5stix"
>
rootLabel
</span>
@@ -1222,7 +1222,7 @@ exports[`TreeNodeComponent renders a loading spinner if the node is loading: loa
}
>
<span
className=""
className="___1h29e9h_0000000 fz5stix"
>
rootLabel
</span>
@@ -1249,7 +1249,7 @@ exports[`TreeNodeComponent renders a node as expandable if it has empty, but def
}
>
<span
className=""
className="___1h29e9h_0000000 fz5stix"
>
rootLabel
</span>
@@ -1324,7 +1324,7 @@ exports[`TreeNodeComponent renders a node with a menu 1`] = `
}
>
<span
className=""
className="___1h29e9h_0000000 fz5stix"
>
rootLabel
</span>
@@ -1374,7 +1374,7 @@ exports[`TreeNodeComponent renders a single node 1`] = `
}
>
<span
className=""
className="___1h29e9h_0000000 fz5stix"
>
rootLabel
</span>
@@ -1403,7 +1403,7 @@ exports[`TreeNodeComponent renders an icon if the node has one 1`] = `
}
>
<span
className=""
className="___1h29e9h_0000000 fz5stix"
>
rootLabel
</span>
@@ -1430,7 +1430,7 @@ exports[`TreeNodeComponent renders selected parent node as selected if no descen
}
>
<span
className=""
className="___1h29e9h_0000000 fz5stix"
>
rootLabel
</span>
@@ -1506,7 +1506,7 @@ exports[`TreeNodeComponent renders selected parent node as unselected if any des
}
>
<span
className=""
className="___1h29e9h_0000000 fz5stix"
>
rootLabel
</span>
@@ -1585,7 +1585,7 @@ exports[`TreeNodeComponent renders single selected leaf node as selected 1`] = `
}
>
<span
className=""
className="___1h29e9h_0000000 fz5stix"
>
rootLabel
</span>