match margin of abstract-video-list and sub-menu's fixed margin

2 files changed, 20 insertions, 11 deletions

diff --git a/client/src/app/+accounts/account-about/account-about.component.html b/client/src/app/+accounts/account-about/account-about.component.html
index 3ae11b49c..1f1987aba 100644
--- a/client/src/app/+accounts/account-about/account-about.component.html
+++ b/client/src/app/+accounts/account-about/account-about.component.html
@@ -1,12 +1,14 @@
-<div *ngIf="account" class="row">
-  <div class="block col-md-6 col-sm-12">
-    <div i18n class="small-title">DESCRIPTION</div>
-    <div class="content" [innerHtml]="getAccountDescription()"></div>
+<div class="margin-content">
+  <div *ngIf="account" class="row no-gutters">
+    <div class="block col-md-6 col-sm-12 pr-2">
+      <div i18n class="small-title">DESCRIPTION</div>
+      <div class="content" [innerHtml]="getAccountDescription()"></div>
+    </div>
+  
+    <div class="block col-md-6 col-sm-12">
+      <div i18n class="small-title">STATS</div>
+  
+      <div i18n class="content">Joined {{ account.createdAt | date }}</div>
+    </div>
   </div>
-
-  <div class="block col-md-6 col-sm-12">
-    <div i18n class="small-title">STATS</div>
-
-    <div i18n class="content">Joined {{ account.createdAt | date }}</div>
-  </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/client/src/app/+accounts/accounts.component.scss b/client/src/app/+accounts/accounts.component.scss
index 12170e371..e6ab3c036 100644
--- a/client/src/app/+accounts/accounts.component.scss
+++ b/client/src/app/+accounts/accounts.component.scss
@@ -15,6 +15,13 @@
   }
 }
 
+.margin-content {
+  // margin-content is required, but child views have their own margins
+  // that match views outside the scope of accounts, so we only align
+  // them with the margins of .sub-menu when required.
+  margin: 0;
+}
+
 .right-buttons {
   display: flex;
   height: max-content;