Tweaks and fixes

packages/concordia-app/src/components/PostCreate/styles.css

@@ -10,6 +10,7 @@
 
 #post-button {
     float: right;
+    margin-top: 1rem;
 }
 
 #post-button button {

packages/concordia-app/src/components/PostList/PostListRow/styles.css

@@ -1,10 +1,9 @@
 .post-list-row {
-    padding: 1rem 0 !important;
+    padding: 1rem 0.1rem 1rem 0.6rem !important;
 }
 
 .post-profile-picture {
     margin-top: 1rem;
-    margin-left: 0.75rem;
 }
 
 .post-profile-picture img {

packages/concordia-app/src/components/TopicList/index.jsx

@@ -3,8 +3,7 @@ import React, {
 } from 'react';
 import PropTypes from 'prop-types';
 import { useSelector } from 'react-redux';
-import { useHistory } from 'react-router';
+import { List } from 'semantic-ui-react';
-import { Button, List } from 'semantic-ui-react';
 import TopicListRow from './TopicListRow';
 import { drizzle } from '../../redux/store';
 import { FORUM_CONTRACT } from '../../constants/contracts/ContractNames';
@@ -17,8 +16,6 @@ const TopicList = (props) => {
   const [getTopicCallHashes, setGetTopicCallHashes] = useState([]);
   const drizzleInitialized = useSelector((state) => state.drizzleStatus.initialized);
   const drizzleInitializationFailed = useSelector((state) => state.drizzleStatus.failed);
-  const hasSignedUp = useSelector((state) => state.user.hasSignedUp);
-  const history = useHistory();
 
   useEffect(() => {
     if (drizzleInitialized && !drizzleInitializationFailed) {
@@ -55,21 +52,9 @@ const TopicList = (props) => {
     }), [getTopicCallHashes, topicIds]);
 
   return (
-      <div>
+      <List id="topic-list" size="big">
-          {hasSignedUp && history.location.pathname === '/home' && (
+          {topics}
-              <Button
+      </List>
-                content="New Topic"
-                icon="plus"
-                labelPosition="left"
-                positive
-                id="new-topic-button"
-                onClick={() => history.push('/topics/new')}
-              />
-          )}
-          <List id="topic-list" size="big">
-              {topics}
-          </List>
-      </div>
   );
 };
 

packages/concordia-app/src/components/TopicList/styles.css

@@ -4,8 +4,3 @@
     clear: both;
 }
 
-#new-topic-button{
-    float:right;
-    margin-bottom: 2em;
-
-}

packages/concordia-app/src/views/Home/Board/index.jsx

@@ -1,22 +1,43 @@
 import React, { useMemo } from 'react';
-import { Header } from 'semantic-ui-react';
+import { Button, Header } from 'semantic-ui-react';
+import { useSelector } from 'react-redux';
+import { useHistory } from 'react-router';
 import _ from 'lodash';
 import { useTranslation } from 'react-i18next';
-import { useSelector } from 'react-redux';
 import PropTypes from 'prop-types';
+
 import TopicList from '../../../components/TopicList';
 
+import './styles.css';
+
 const Board = (props) => {
   const { numberOfTopics } = props;
-  const userHasSignedUp = useSelector((state) => state.user.hasSignedUp);
+  const hasSignedUp = useSelector((state) => state.user.hasSignedUp);
+  const history = useHistory();
   const { t } = useTranslation();
 
   const boardContents = useMemo(() => {
     if (numberOfTopics > 0) {
-      return (<TopicList topicIds={_.rangeRight(0, numberOfTopics)} />);
-    } if (!userHasSignedUp) {
       return (
-          <div className="vertical-center-in-parent">
+          <>
+              {hasSignedUp
+                ? (
+                    <Button
+                      content="New Topic"
+                      icon="plus"
+                      labelPosition="left"
+                      positive
+                      id="new-topic-button"
+                      onClick={() => history.push('/topics/new')}
+                    />
+                )
+                : null}
+              <TopicList topicIds={_.rangeRight(0, numberOfTopics)} />
+          </>
+      );
+    } if (!hasSignedUp) {
+      return (
+          <div id="no-topic-message" className="vertical-center-in-parent">
               <Header textAlign="center" as="h2">
                   {t('board.header.no.topics.message')}
               </Header>
@@ -28,16 +49,27 @@ const Board = (props) => {
     }
 
     return (
-        <div className="vertical-center-in-parent">
+        <>
-            <Header textAlign="center" as="h2">
+            <Button
-                {t('board.header.no.topics.message')}
+              content="New Topic"
-            </Header>
+              icon="plus"
-            <Header textAlign="center" as="h3">
+              labelPosition="left"
-                {t('board.sub.header.no.topics.user')}
+              positive
-            </Header>
+              id="new-topic-button"
-        </div>
+              onClick={() => history.push('/topics/new')}
+            />
+            <div id="no-topic-message" className="vertical-center-in-parent">
+                <Header textAlign="center" as="h2">
+                    {t('board.header.no.topics.message')}
+                </Header>
+                <Header textAlign="center" as="h3">
+                    {t('board.sub.header.no.topics.user')}
+                </Header>
+            </div>
+        </>
+
     );
-  }, [numberOfTopics, userHasSignedUp, t]);
+  }, [numberOfTopics, hasSignedUp, t, history]);
 
   return (boardContents);
 };

packages/concordia-app/src/views/Home/Board/styles.css

@@ -0,0 +1,9 @@
+#no-topic-message {
+    padding-top: 7rem;
+    clear: both;
+}
+
+#new-topic-button{
+    float:right;
+    margin-bottom: 2em;
+}

packages/concordia-app/src/views/Profile/GeneralTab/index.jsx

@@ -172,7 +172,7 @@ const GeneralTab = (props) => {
                   <Table.Row>
                       <Table.Cell><strong>{t('profile.general.tab.registration.date.row.title')}</strong></Table.Cell>
                       <Table.Cell>
-                          {new Date(userRegistrationTimestamp * 1000).toLocaleString()}
+                          {new Date(userRegistrationTimestamp * 1000).toLocaleString('el-gr', { hour12: false })}
                       </Table.Cell>
                   </Table.Row>
               </Table.Body>

packages/concordia-app/src/views/Profile/GeneralTab/styles.css

@@ -1,6 +1,7 @@
 .general-tab-profile-picture {
-    max-width: 112px;
+    border-radius: 50%;
-    max-height: 112px;
+    width: 12rem !important;
-    margin: 0;
+    height: 12rem !important;
+    margin: 2rem;
     vertical-align: middle;
-}
+}

packages/concordia-app/src/views/Topic/TopicCreate/index.jsx

@@ -7,8 +7,8 @@ import {
 import { useTranslation } from 'react-i18next';
 import { useHistory } from 'react-router';
 import { useSelector } from 'react-redux';
-import './styles.css';
 import { drizzle, breeze } from '../../../redux/store';
+import './styles.css';
 import { TRANSACTION_ERROR, TRANSACTION_SUCCESS } from '../../../constants/TransactionStatus';
 import { POSTS_DATABASE, TOPICS_DATABASE } from '../../../constants/orbit/OrbitDatabases';
 import { TOPIC_SUBJECT } from '../../../constants/orbit/TopicsDatabaseKeys';

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

@@ -7,7 +7,6 @@ import {
 import { Link } from 'react-router-dom';
 import { useHistory } from 'react-router';
 
-import TimeAgo from 'react-timeago';
 import { breeze, drizzle } from '../../../redux/store';
 import { FETCH_USER_DATABASE } from '../../../redux/actions/peerDbReplicationActions';
 import './styles.css';
@@ -138,7 +137,7 @@ const TopicView = (props) => {
                       <div id="topic-metadata">
                           <Icon name="calendar alternate" fitted />
                     &nbsp;
-                          <TimeAgo date={timestamp} />
+                          {new Date(timestamp).toLocaleString('el-gr', { hour12: false })}
                     &nbsp;&nbsp;
                           <Icon name="user" fitted />
                     &nbsp;

packages/concordia-app/src/views/Topic/TopicView/styles.css

@@ -12,7 +12,7 @@
 
 #topic-metadata {
     font-size: 0.8em;
-    color: rgba(0,0,0,.5);
+    color: rgba(0,0,0,.6);
 }
 
 #author-placeholder {