ECEntrics
/
concordia
mirror of https://gitlab.com/ecentrics/concordia
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Fix Dimmer usage

develop
Apostolos Fanakis 4 years ago
parent
241fd3285b
commit
b09ec87e47
2 changed files with 41 additions and 50 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 3
      packages/concordia-app/src/components/TopicList/TopicListRow/index.jsx
  2. 88
      packages/concordia-app/src/views/Topic/TopicView/index.jsx

3
packages/concordia-app/src/components/TopicList/TopicListRow/index.jsx
View File

@ -64,9 +64,6 @@ const TopicListRow = (props) => {
return ( return (
<Dimmer.Dimmable as={List.Item} onClick={handleTopicClick} blurring dimmed={loading} className="list-item"> <Dimmer.Dimmable as={List.Item} onClick={handleTopicClick} blurring dimmed={loading} className="list-item">
<Dimmer>
<Loader />
</Dimmer>
<List.Icon name="user circle" size="big" inverted color="black" verticalAlign="middle" /> <List.Icon name="user circle" size="big" inverted color="black" verticalAlign="middle" />
<List.Content> <List.Content>
<List.Header> <List.Header>

88
packages/concordia-app/src/views/Topic/TopicView/index.jsx
View File

@ -74,53 +74,47 @@ const TopicView = (props) => {
}, [topicId, topics]); }, [topicId, topics]);
return ( return (
<Dimmer.Dimmable <Container id="topic-container" textAlign="center">
as={Container} <Dimmer.Dimmable
id="topic-container" blurring
blurring dimmed={topicAuthorAddress === null && topicAuthor === null && timestamp === null}
dimmed={topicAuthorAddress === null && topicAuthor === null && timestamp === null} >
textAlign="center" <Step.Group fluid>
className="list-item" <Step key="topic-header-step-user">
> <Icon name="user circle" size="big" inverted color="black" />
<Dimmer> <Step.Content>
<Loader /> <Step.Title>
</Dimmer> {topicAuthor || (
<Step.Group fluid> <Placeholder id="author-placeholder" inverted>
<Step key="topic-header-step-user"> <Placeholder.Line length="full" />
<Icon name="user circle" size="big" inverted color="black" /> </Placeholder>
<Step.Content> )}
<Step.Title> </Step.Title>
{topicAuthor || ( </Step.Content>
<Placeholder id="author-placeholder" inverted> </Step>
<Placeholder.Line length="full" /> <Step key="topic-header-step-title">
</Placeholder> <Step.Content>
)} <Step.Title>
</Step.Title> {topicSubject || (
</Step.Content> <Placeholder id="subject-placeholder">
</Step> <Placeholder.Line length="full" />
</Placeholder>
<Step key="topic-header-step-title"> )}
<Step.Content> </Step.Title>
<Step.Title> <Step.Description>
{topicSubject || ( {timestamp
<Placeholder id="subject-placeholder"> ? moment(timestamp * 1000).fromNow()
<Placeholder.Line length="full" /> : (
</Placeholder> <Placeholder id="date-placeholder">
)} <Placeholder.Line length="full" />
</Step.Title> </Placeholder>
<Step.Description> )}
{timestamp </Step.Description>
? moment(timestamp * 1000).fromNow() </Step.Content>
: ( </Step>
<Placeholder id="date-placeholder"> </Step.Group>
<Placeholder.Line length="full" /> </Dimmer.Dimmable>
</Placeholder> </Container>
)}
</Step.Description>
</Step.Content>
</Step>
</Step.Group>
</Dimmer.Dimmable>
); );
}; };

Write Preview
Loading…
Cancel
Save