Merge branch 'dev' into websocket_scopes

1 files changed, 25 insertions, 55 deletions

diff --git a/ui/src/components/main.tsx b/ui/src/components/main.tsx
index ec801f90..ed31fff4 100644
--- a/ui/src/components/main.tsx
+++ b/ui/src/components/main.tsx
@@ -158,8 +158,10 @@ export class Main extends Component<any, MainState> {
     return (
       <div class="container">
         <div class="row">
-          <div class="col-12 col-md-8">{this.posts()}</div>
-          <div class="col-12 col-md-4">{this.my_sidebar()}</div>
+          <main role="main" class="col-12 col-md-8">
+            {this.posts()}
+          </main>
+          <aside class="col-12 col-md-4">{this.my_sidebar()}</aside>
         </div>
       </div>
     );
@@ -199,7 +201,7 @@ export class Main extends Component<any, MainState> {
                   class="btn btn-sm btn-secondary btn-block"
                   to="/create_community"
                 >
-                  <T i18nKey="create_a_community">#</T>
+                  {i18n.t('create_a_community')}
                 </Link>
               </div>
             </div>
@@ -269,73 +271,43 @@ export class Main extends Component<any, MainState> {
                     class="pointer"
                     onClick={linkEvent(this, this.handleEditClick)}
                   >
-                    <T i18nKey="edit">#</T>
+                    {i18n.t('edit')}
                   </span>
                 </li>
               </ul>
             )}
             <ul class="my-2 list-inline">
               <li className="list-inline-item badge badge-secondary">
-                <T
-                  i18nKey="number_online"
-                  interpolation={{ count: this.state.siteRes.online }}
-                >
-                  #
-                </T>
+                {i18n.t('number_online', { count: this.state.siteRes.online })}
               </li>
               <li className="list-inline-item badge badge-secondary">
-                <T
-                  i18nKey="number_of_users"
-                  interpolation={{
-                    count: this.state.siteRes.site.number_of_users,
-                  }}
-                >
-                  #
-                </T>
+                {i18n.t('number_of_users', {
+                  count: this.state.siteRes.site.number_of_users,
+                })}
               </li>
               <li className="list-inline-item badge badge-secondary">
-                <T
-                  i18nKey="number_of_communities"
-                  interpolation={{
-                    count: this.state.siteRes.site.number_of_communities,
-                  }}
-                >
-                  #
-                </T>
+                {i18n.t('number_of_communities', {
+                  count: this.state.siteRes.site.number_of_communities,
+                })}
               </li>
               <li className="list-inline-item badge badge-secondary">
-                <T
-                  i18nKey="number_of_posts"
-                  interpolation={{
-                    count: this.state.siteRes.site.number_of_posts,
-                  }}
-                >
-                  #
-                </T>
+                {i18n.t('number_of_posts', {
+                  count: this.state.siteRes.site.number_of_posts,
+                })}
               </li>
               <li className="list-inline-item badge badge-secondary">
-                <T
-                  i18nKey="number_of_comments"
-                  interpolation={{
-                    count: this.state.siteRes.site.number_of_comments,
-                  }}
-                >
-                  #
-                </T>
+                {i18n.t('number_of_comments', {
+                  count: this.state.siteRes.site.number_of_comments,
+                })}
               </li>
               <li className="list-inline-item">
                 <Link className="badge badge-secondary" to="/modlog">
-                  <T i18nKey="modlog">#</T>
+                  {i18n.t('modlog')}
                 </Link>
               </li>
             </ul>
             <ul class="mt-1 list-inline small mb-0">
-              <li class="list-inline-item">
-                <T i18nKey="admins" class="d-inline">
-                  #
-                </T>
-                :
-              </li>
+              <li class="list-inline-item">{i18n.t('admins')}:</li>
               {this.state.siteRes.admins.map(admin => (
                 <li class="list-inline-item">
                   <Link class="text-info" to={`/u/${admin.name}`}>
@@ -375,9 +347,7 @@ export class Main extends Component<any, MainState> {
       <div class="card border-secondary">
         <div class="card-body">
           <h5>
-            <T i18nKey="powered_by" class="d-inline">
-              #
-            </T>
+            {i18n.t('powered_by')}
             <svg class="icon mx-2">
               <use xlinkHref="#icon-mouse">#</use>
             </svg>
@@ -412,7 +382,7 @@ export class Main extends Component<any, MainState> {
 
   posts() {
     return (
-      <div>
+      <div class="main-content-wrapper">
         {this.state.loading ? (
           <h5>
             <svg class="icon icon-spinner spin">
@@ -475,7 +445,7 @@ export class Main extends Component<any, MainState> {
             class="btn btn-sm btn-secondary mr-1"
             onClick={linkEvent(this, this.prevPage)}
           >
-            <T i18nKey="prev">#</T>
+            {i18n.t('prev')}
           </button>
         )}
         {this.state.posts.length == fetchLimit && (
@@ -483,7 +453,7 @@ export class Main extends Component<any, MainState> {
             class="btn btn-sm btn-secondary"
             onClick={linkEvent(this, this.nextPage)}
           >
-            <T i18nKey="next">#</T>
+            {i18n.t('next')}
           </button>
         )}
       </div>