1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00

A bit of TreeView styling

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2021-03-03 14:50:18 +03:00
parent 2c5ad51b47
commit 3870f07eca
2 changed files with 9 additions and 12 deletions

View File

@ -0,0 +1,6 @@
.TreeView {
.MuiTypography-body1 {
font-size: var(--font-size);
color: var(--textColorAccent);
}
}

View File

@ -1,6 +1,7 @@
import "./tree-view.scss";
import React from "react";
import { Icon } from "../icon";
import { makeStyles } from "@material-ui/core/styles";
import TreeView from "@material-ui/lab/TreeView";
import TreeItem from "@material-ui/lab/TreeItem";
@ -14,17 +15,7 @@ interface Props {
data: NavigationTree[]
}
const useStyles = makeStyles({
root: {
height: 110,
flexGrow: 1,
maxWidth: 400,
},
});
export function RecursiveTreeView({ data }: Props) {
const classes = useStyles();
const renderTree = (nodes: NavigationTree[]) => {
return nodes.map(node => (
<TreeItem key={node.id} nodeId={node.id} label={node.name}>
@ -35,7 +26,7 @@ export function RecursiveTreeView({ data }: Props) {
return (
<TreeView
className={classes.root}
className="TreeView"
defaultCollapseIcon={<Icon material="expand_more"/>}
defaultExpandIcon={<Icon material="chevron_right" />}
>