aboutsummaryrefslogtreecommitdiffstats
path: root/packages/dev-tools-pages/ts/components/List.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'packages/dev-tools-pages/ts/components/List.tsx')
-rw-r--r--packages/dev-tools-pages/ts/components/List.tsx33
1 files changed, 33 insertions, 0 deletions
diff --git a/packages/dev-tools-pages/ts/components/List.tsx b/packages/dev-tools-pages/ts/components/List.tsx
new file mode 100644
index 000000000..df1fdc53b
--- /dev/null
+++ b/packages/dev-tools-pages/ts/components/List.tsx
@@ -0,0 +1,33 @@
+import * as React from 'react';
+import styled from 'styled-components';
+
+const StyledList = styled.ul`
+ list-style-type: none;
+ margin: 0;
+ padding-inline-start: 0.2rem;
+`;
+
+const StyledItem = styled.li`
+ :before {
+ content: '';
+ border: 1px solid black;
+ width: 0.6875rem;
+ height: 0.6875rem;
+ display: inline-block;
+ transform: rotate(45deg);
+ margin-right: 1.09375rem;
+ }
+`;
+
+interface ListProps {
+ items: Array<string>;
+}
+
+function List(props: ListProps) {
+ const items = props.items;
+ const listItems = items.map((bullet, index) => <StyledItem key={index}>{bullet}</StyledItem>);
+
+ return <StyledList>{listItems}</StyledList>;
+}
+
+export default List;