git.iko.soy/bridge
on master help sign in
points-view: empty state
bb22285tomholford
src/views/Points.scssnew file+17
compare with master
unifiedsplit
@@ -0,0 +1,17 @@
1+.empty-points-container {
2+ border-width: 2px;
3+ border-color: rgba(0,0,0,0.1);
4+ border-style: dashed;
5+ border-radius: 5px;
6+ min-height: 350px;
7+ display: flex;
8+ flex-flow: column nowrap;
9+ justify-content: center;
10+ align-items: center;
11+
12+ .empty-points-text {
13+ font-size: 14px;
14+ color: rgba(0,0,0,0.5);
15+ font-family: 'Inter';
16+ }
17+}
src/views/Points.tsx+5−3
@@ -28,6 +28,9 @@ import NavHeader from 'components/NavHeader';
28import L2PointHeader from 'components/L2/Headers/L2PointHeader';
28import L2PointHeader from 'components/L2/Headers/L2PointHeader';
29import IncomingPoint from 'components/L2/Points/IncomingPoint';
29import IncomingPoint from 'components/L2/Points/IncomingPoint';
30import LoadingOverlay from 'components/L2/LoadingOverlay';
30import LoadingOverlay from 'components/L2/LoadingOverlay';
31+import { Box, Text } from '@tlon/indigo-react';
32+
33+import './Points.scss';
31
34
32export const maybeGetResult = (obj, key, defaultValue) =>
35export const maybeGetResult = (obj, key, defaultValue) =>
33 obj.matchWith({
36 obj.matchWith({
@@ -304,9 +307,8 @@ export default function Points() {
304 ))}
307 ))}
305 <Grid>
308 <Grid>
306 {displayEmptyState && (
309 {displayEmptyState && (
307− <Grid.Item full as={HelpText} className="mt8 t-center">
310+ <Grid.Item full as={Box} className="empty-points-container">
308− No points to display. This wallet is not the owner or proxy for any
311+ <Text className="empty-points-text">No Urbit IDs here yet</Text>
309− points.
310 </Grid.Item>
312 </Grid.Item>
311 )}
313 )}
312
314