2020-03-19 02:33:57 -04:00
|
|
|
import React from "react";
|
2020-03-19 06:40:29 -04:00
|
|
|
import { Flex, Image } from "theme-ui";
|
|
|
|
|
|
|
|
import * as tokens from "../tokens";
|
|
|
|
|
|
|
|
// import Token from "./Token";
|
2020-03-19 02:33:57 -04:00
|
|
|
|
|
|
|
function Tokens() {
|
2020-03-19 06:40:29 -04:00
|
|
|
return (
|
|
|
|
<Flex
|
|
|
|
bg="background"
|
|
|
|
sx={{
|
|
|
|
width: "80px",
|
|
|
|
minWidth: "80px",
|
|
|
|
flexDirection: "column",
|
|
|
|
overflow: "auto"
|
|
|
|
}}
|
|
|
|
px={2}
|
|
|
|
>
|
|
|
|
{Object.entries(tokens).map(([id, image]) => (
|
|
|
|
<Image
|
|
|
|
p={2}
|
|
|
|
key={id}
|
|
|
|
src={image}
|
|
|
|
sx={{ width: "64px", height: "64px" }}
|
|
|
|
/>
|
|
|
|
))}
|
|
|
|
</Flex>
|
|
|
|
);
|
2020-03-19 02:33:57 -04:00
|
|
|
}
|
|
|
|
|
|
|
|
export default Tokens;
|