8000 add right arrow to build table rows · coder/coder@634ccb4 · GitHub
[go: up one dir, main page]

Skip to content

Commit 634ccb4

Browse files
committed
add right arrow to build table rows
1 parent 94ed081 commit 634ccb4

File tree

1 file changed

+20
-3
lines changed

1 file changed

+20
-3
lines changed

site/src/components/BuildsTable/BuildsTable.tsx

Lines changed: 20 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
11
import Box from "@material-ui/core/Box"
2-
import { makeStyles, Theme } from "@material-ui/core/styles"
2+
import { fade, makeStyles, Theme } from "@material-ui/core/styles"
33
import Table from "@material-ui/core/Table"
44
import TableBody from "@material-ui/core/TableBody"
55
import TableCell from "@material-ui/core/TableCell"
66
import TableHead from "@material-ui/core/TableHead"
77
import TableRow from "@material-ui/core/TableRow"
8+
import KeyboardArrowRight from "@material-ui/icons/KeyboardArrowRight"
89
import useTheme from "@material-ui/styles/useTheme"
910
import { FC } from "react"
1011
import { useNavigate } from "react-router-dom"
@@ -77,7 +78,10 @@ export const BuildsTable: FC<BuildsTableProps> = ({ builds, className }) => {
7778
</span>
7879
</TableCell>
7980
<TableCell>
80-
<span style={{ color: status.color }}>{status.status}</span>
81+
<div className={styles.statusCell}>
82+
<span style={{ color: status.color }}>{status.status}</span>
83+
<KeyboardArrowRight className={styles.arrowRight} />
84+
</div>
8185
</TableCell>
8286
</TableRow>
8387
)
@@ -102,11 +106,24 @@ const useStyles = makeStyles((theme) => ({
102106
cursor: "pointer",
103107

104108
"&:hover td": {
105-
backgroundColor: theme.palette.background.default,
109+
backgroundColor: fade(theme.palette.primary.light, 0.1),
106110
},
107111

108112
"&:focus": {
109113
outline: `1px solid ${theme.palette.secondary.dark}`,
110114
},
115+
116+
"& .MuiTableCell-root:last-child": {
117+
paddingRight: theme.spacing(2),
118+
},
119+
},
120+
arrowRight: {
121+
color: fade(theme.palette.primary.contrastText, 0.7),
122+
width: 20,
123+
height: 20,
124+
},
125+
statusCell: {
126+
display: "flex",
127+
justifyContent: "space-between",
111128
},
112129
}))

0 commit comments

Comments
 (0)
0