From 2ed5e4e07718bca112f125c1d3e2521fbf44bc28 Mon Sep 17 00:00:00 2001
From: Liam Fitzgerald <liam@urizen.co>
Date: Wed, 7 Oct 2020 10:21:27 +1000
Subject: [PATCH] UnjoinedResource: clean up design

---
 .../src/views/components/UnjoinedResource.tsx   | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

diff --git a/pkg/interface/src/views/components/UnjoinedResource.tsx b/pkg/interface/src/views/components/UnjoinedResource.tsx
index 91d202965..c81a16100 100644
--- a/pkg/interface/src/views/components/UnjoinedResource.tsx
+++ b/pkg/interface/src/views/components/UnjoinedResource.tsx
@@ -1,7 +1,7 @@
 import React, { useEffect, useMemo } from "react";
 import { Association } from "~/types/metadata-update";
 import { Box, Text, Button, Col, Center } from "@tlon/indigo-react";
-import RichText from '~/views/components/RichText';
+import RichText from "~/views/components/RichText";
 import { Link, useHistory } from "react-router-dom";
 import GlobalApi from "~/logic/api/global";
 import { useWaitForProps } from "~/logic/lib/useWaitForProps";
@@ -80,14 +80,21 @@ export function UnjoinedResource(props: UnjoinedResourceProps) {
 
   return (
     <Center p={6}>
-      <Col maxWidth="400px" p={4} border={1} borderColor="washedGray">
-        <Box mb={4}>
+      <Col
+        maxWidth="400px"
+        p={4}
+        border={1}
+        borderColor="lightGray"
+        borderRadius="1"
+        gapY="3"
+      >
+        <Box>
           <Text>{title}</Text>
         </Box>
-        <Box mb={4}>
+        <Box>
           <RichText color="gray">{description}</RichText>
         </Box>
-        <StatelessAsyncButton onClick={onJoin} mx="auto" border>
+        <StatelessAsyncButton primary width="fit-content" onClick={onJoin}>
           Join Channel
         </StatelessAsyncButton>
       </Col>