roleypoly/v3
1
0
Fork 0
mirror of https://github.com/roleypoly/roleypoly.git synced 2025-06-17 09:59:10 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: Add majority of design system components, build system fixes (#11)

Browse source 
* feat(design-system): pre-port of roleypoly/ui

* feat(design-system): port molecules

* chore(design-system): prettier

* feat(design-system): add intro card and MDX components

* fix(common/utils): hack fixtures test data moved to design-system, update accordingly

* chore: document protoReflection.ts

* fix(design-system): some molecules missed the magic fuckery

* ci: keep going on bazel test failures

* fix(design-system): server masthead molecule missed the magic fuckery

* chore: fix ts paths

* chore: fix docker publisher

* chore: fix docker publisher names

* chore(discord-bot): fix publisher

* chore(discord-bot): fix publisher
This commit is contained in:
41666 2020-10-14 22:33:01 -04:00 • committed by GitHub
parent c41fcabfd0
commit 89f237cf22
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
133 changed files with 2795 additions and 278 deletions
Download patch file Download diff file Expand all files Collapse all files

36
src/design-system/molecules/server-masthead/ServerMasthead.tsx Normal file
View file

@ -0,0 +1,36 @@
import { Guild } from 'roleypoly/src/design-system/shared-types';
import { Avatar, utils } from 'roleypoly/src/design-system/atoms/avatar';
import { AccentTitle, AmbientLarge } from 'roleypoly/src/design-system/atoms/typography';
import Link from 'next/link';
import { guild } from 'roleypoly/src/design-system/shared-types/storyData';
import * as React from 'react';
import { GoPencil } from 'react-icons/go';
import { Editable, Icon, Name, Wrapper } from './ServerMasthead.styled';
export type ServerMastheadProps = {
guild: Guild;
editable: boolean;
};
export const ServerMasthead = (props: ServerMastheadProps) => {
return (
<Wrapper>
<Icon>
<Avatar size={props.editable ? 60 : 48} src={guild.icon}>
{utils.initialsFromName(props.guild.name)}
</Avatar>
</Icon>
<Name>
<AccentTitle>{props.guild.name}</AccentTitle>
{props.editable && (
<Link href="/s/[id]/edit" as={`/s/${props.guild.id}/edit`}>
<Editable role="button">
<GoPencil />
&nbsp; <AmbientLarge>Edit Server</AmbientLarge>
</Editable>
</Link>
)}
</Name>
</Wrapper>
);
};