feat: fix view full width issue watchlist

epochtalk · Dec 4, 2021 · cc04331 · cc04331
1 parent 2f28a8e
commit cc04331
Show file tree

Hide file tree

Showing 4 changed files with 7 additions and 4 deletions.
diff --git a/src/App.vue b/src/App.vue
@@ -34,7 +34,6 @@ export default {
 /*-- View Layout Wrappers --*/
 #public-content {
   margin-top: $header-bottom-margin;
-  & > div:first-child { width: 100%; }
   @include break-mobile-sm {
     margin-top: -0.5rem;
   }

diff --git a/src/views/Threads.vue b/src/views/Threads.vue
@@ -498,7 +498,7 @@ export default {
   grid-column: 1 / span 2;
   display: grid;
   grid-area: header;
-
+  width: 100%;
   h1 {
     margin: 0;
     padding: 0;

diff --git a/src/views/ThreadsPostedIn.vue b/src/views/ThreadsPostedIn.vue
@@ -131,7 +131,7 @@ export default {
 
 <style scoped lang="scss">
 .threads-posted-in main #public-content { grid-template-areas: 'header header' 'main sidebar' 'main sidebar'; }
-.thread-data { grid-area: main; }
+.thread-data { grid-area: main; width: 100%; }
 .sidebar {
   grid-area: sidebar;
   .sidebar-block {

diff --git a/src/views/WatchlistEdit.vue b/src/views/WatchlistEdit.vue
@@ -328,13 +328,17 @@ export default {
   }
 
   @include break-mobile-sm {
+    margin-bottom: 1rem;
     .watchlist-panel-header {
-      flex-direction: column;
+      flex-direction: row;
       width: 100%;
     }
 
     .pagination-slide {
       width: 100%;
+     .pagination-controls {
+        justify-self: right;
+      }
     }
 
     .pagination-components {