Scrollable tables in settings pages (#4857)

* Scrollable tables in settings pages

* Add space before curly brace

app/javascript/styles/admin.scss

@@ -190,11 +190,15 @@
 
 .filters {
   display: flex;
-  margin-bottom: 20px;
+  flex-wrap: wrap;
 
   .filter-subset {
     flex: 0 0 auto;
-    margin-right: 40px;
+    margin: 0 40px 10px 0;
+
+    &:last-child {
+      margin-bottom: 20px;
+    }
 
     ul {
       margin-top: 5px;

app/javascript/styles/tables.scss

@@ -3,7 +3,6 @@
   max-width: 100%;
   border-spacing: 0;
   border-collapse: collapse;
-  margin-bottom: 20px;
 
   th,
   td {
@@ -43,17 +42,15 @@
     font-weight: 500;
   }
 
-  &.inline-table {
-    td,
-    th {
-      padding: 8px 2px;
-    }
-
-    & > tbody > tr:nth-child(odd) > td,
-    & > tbody > tr:nth-child(odd) > th {
+  &.inline-table > tbody > tr:nth-child(odd) > td,
+  &.inline-table > tbody > tr:nth-child(odd) > th {
     background: transparent;
   }
 }
+
+.table-wrapper {
+  overflow: auto;
+  margin-bottom: 20px;
 }
 
 samp {

app/views/admin/accounts/_card.html.haml

@@ -1,3 +1,4 @@
+.table-wrapper
   %table.table
     %tbody
       %tr

app/views/admin/accounts/index.html.haml

@@ -50,6 +50,7 @@
       %button= t('admin.accounts.search')
       = link_to t('admin.accounts.reset'), admin_accounts_path, class: 'button negative'
 
+.table-wrapper
   %table.table
     %thead
       %tr

app/views/admin/accounts/show.html.haml

@@ -1,6 +1,7 @@
 - content_for :page_title do
   = @account.acct
 
+.table-wrapper
   %table.table
     %tbody
       %tr
@@ -81,7 +82,6 @@
         %th= t('.targeted_reports')
         %td= link_to pluralize(@account.targeted_reports.count, t('.report')), admin_reports_path(target_account_id: @account.id)
 
-
 %div{ style: 'float: right' }
   - if @account.local?
     = link_to t('admin.accounts.reset_password'), admin_account_reset_path(@account.id), method: :create, class: 'button'

app/views/admin/domain_blocks/index.html.haml

@@ -1,6 +1,7 @@
 - content_for :page_title do
   = t('admin.domain_blocks.title')
 
+.table-wrapper
   %table.table
     %thead
       %tr

app/views/admin/instances/index.html.haml

@@ -1,6 +1,7 @@
 - content_for :page_title do
   = t('admin.instances.title')
 
+.table-wrapper
   %table.table
     %thead
       %tr

app/views/admin/reports/index.html.haml

@@ -10,6 +10,7 @@
 
 = form_tag do
 
+  .table-wrapper
     %table.table
       %thead
         %tr

app/views/admin/subscriptions/index.html.haml

@@ -1,6 +1,7 @@
 - content_for :page_title do
   = t('admin.subscriptions.title')
 
+.table-wrapper
   %table.table
     %thead
       %tr

app/views/auth/registrations/_sessions.html.haml

@@ -1,6 +1,7 @@
 %h6= t 'sessions.title'
 %p.muted-hint= t 'sessions.explanation'
 
+.table-wrapper
   %table.table.inline-table
     %thead
       %tr

app/views/oauth/authorized_applications/index.html.haml

@@ -1,6 +1,7 @@
 - content_for :page_title do
   = t('doorkeeper.authorized_applications.index.title')
 
+.table-wrapper
   %table.table
     %thead
       %tr

app/views/settings/applications/index.html.haml

@@ -1,6 +1,7 @@
 - content_for :page_title do
   = t('doorkeeper.applications.index.title')
 
+.table-wrapper
   %table.table
     %thead
       %tr

app/views/settings/applications/show.html.haml

@@ -3,6 +3,7 @@
 
 %p.hint= t('applications.warning')
 
+.table-wrapper
   %table.table
     %tbody
       %tr  

app/views/settings/exports/show.html.haml

@@ -1,6 +1,7 @@
 - content_for :page_title do
   = t('settings.export')
 
+.table-wrapper
   %table.table
     %tbody
       %tr

app/views/settings/follower_domains/show.html.haml

@@ -12,6 +12,7 @@
   %p= t('followers.explanation_html')
   %p= t('followers.true_privacy_html')
 
+  .table-wrapper
     %table.table
       %thead
         %tr