liz/PluralKit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add darkmode

Browse Source
This commit is contained in:
Spectralitree
2020-12-09 17:45:11 +01:00
parent 18ee1a14ae
commit bc13cced34
10 changed files with 898 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/Components/MemberCard.js
View File

@@ -9,13 +9,21 @@ export default function MemberCard(props) {
const { toHTML } = require('discord-markdown');
const [ desc, setDesc ] = useState("");
const [ color, setColor ] = useState("");
const member = props.member;
useEffect(() => {
if (member.description) {
setDesc(toHTML(member.description));
} else setDesc("(no description)");
}, [member.description]);
if (member.color) {
setColor(member.color);
}
else setColor('transparent');
}, [member.description, member.color]);
return (
<>
@@ -25,14 +33,14 @@ export default function MemberCard(props) {
<BS.Image src={defaultAvatar} style={{width: 50, height: 50}} className="float-right" roundedCircle />}
</BS.Accordion.Toggle>
<BS.Accordion.Collapse eventKey={member.id}>
<BS.Card.Body>
<BS.Card.Body style={{'border-left': `5px solid #${color}` }}>
<BS.Row>
<BS.Col xs={12} md={3}><b>ID:</b> {member.id}</BS.Col>
{ member.display_name ? <BS.Col xs={12} md={3}><b>AKA: </b>{member.display_name}</BS.Col> : "" }
{ member.birthday ? <BS.Col xs={12} md={3}><b>Birthday:</b> {member.birthday}</BS.Col> : "" }
{ member.pronouns ? <BS.Col xs={12} md={3}><b>Pronouns:</b> {member.pronouns}</BS.Col> : "" }
<BS.Col className="mb-lg-3" xs={12} lg={3}><b>ID:</b> {member.id}</BS.Col>
{ member.display_name ? <BS.Col className="mb-lg-3" xs={12} lg={3}><b>AKA: </b>{member.display_name}</BS.Col> : "" }
{ member.birthday ? <BS.Col className="mb-lg-3" xs={12} lg={3}><b>Birthday:</b> {member.birthday}</BS.Col> : "" }
{ member.pronouns ? <BS.Col className="mb-lg-3" xs={12} lg={3}><b>Pronouns:</b> {member.pronouns}</BS.Col> : "" }
{ member.color ? <BS.Col className="mb-lg-3" xs={12} lg={3}><b>Color:</b> #{member.color}</BS.Col> : "" }
</BS.Row>
<br/>
<p><b>Description:</b></p>
<p dangerouslySetInnerHTML={{__html: desc}}></p>
</BS.Card.Body>