From 34aa5c7cb2090bf9d995eafdfbf5f9bd01336491 Mon Sep 17 00:00:00 2001
From: Sasha Sorokin <dafri.nochiterov8@gmail.com>
Date: Tue, 17 Dec 2019 05:55:16 +0700
Subject: Improve report page structure (#12615)

* Move resolved button to the heading

This is one of the commits on improving overall reports page structure.
It changes where resolved button is located, moving it to the heading,
right next to the "Report #n" header, so-called "hot-place" to look at.

To accomplish this we have to declare one more content variable, change
admin dashboard template to respect it and CSS files for minor styling,
so buttons are inlined and centrally aligned according to the heading.

* Move actions buttons below the report table

I believe that actions to react on report should not be located at the
top of the page, instead they should be either after the table or
reporter's comment. This is just a logical sign that you should not
react to the report without reading all the details first.
---
 app/javascript/styles/mastodon/admin.scss | 31 ++++++++++++++++++++++++++-----
 1 file changed, 26 insertions(+), 5 deletions(-)

(limited to 'app/javascript/styles')

diff --git a/app/javascript/styles/mastodon/admin.scss b/app/javascript/styles/mastodon/admin.scss
index dde1d69ba..203365f5e 100644
--- a/app/javascript/styles/mastodon/admin.scss
+++ b/app/javascript/styles/mastodon/admin.scss
@@ -181,18 +181,39 @@ $content-width: 840px;
       padding-top: 30px;
     }
 
-    h2 {
-      color: $secondary-text-color;
-      font-size: 24px;
-      line-height: 28px;
-      font-weight: 400;
+    &-heading {
+      display: flex;
+
       padding-bottom: 40px;
       border-bottom: 1px solid lighten($ui-base-color, 8%);
       margin-bottom: 40px;
 
+      flex-wrap: wrap;
+      align-items: center;
+
+      justify-content: space-between;
+
+      &-actions {
+        display: inline-flex;
+
+        & > * {
+          margin-left: 5px;
+        }
+      }
+
       @media screen and (max-width: $no-columns-breakpoint) {
         border-bottom: 0;
         padding-bottom: 0;
+      }
+    }
+
+    h2 {
+      color: $secondary-text-color;
+      font-size: 24px;
+      line-height: 28px;
+      font-weight: 400;
+
+      @media screen and (max-width: $no-columns-breakpoint) {
         font-weight: 700;
       }
     }
-- 
cgit 


From dc0750abc331749a92ffa96fed9fe048acdea3b1 Mon Sep 17 00:00:00 2001
From: ThibG <thib@sitedethib.com>
Date: Thu, 19 Dec 2019 12:47:19 +0100
Subject: Fix manual scrolling issue on Firefox/Windows (#12648)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Fixes #12607

`will-change: transform` apparently makes manual scrolling impossible on
Firefox/Windows. While this should probably be considered a Firefox bug,
`will-change: transform` seem like a very aggressive performance hint that
may possibly make the browser consume more resources than needed, especially
in multiple-column mode.

This was originally added to improve scrolling performances on mobile, but
I think this isn't necessary anymore, because of the two following reasons:
- `contain: paint` (which is implied by `contain: strict`, which we apply
  whenever the browser supports grids) should have similar effects
- in single-column mode, the scrolling container is the root element, which
  I believe is optimized in at least Chromium

Keep in mind that I have not been able to make in-depth benchmarks, and
especially not been able to try on mobile, so performances should probably
be investigated further…
---
 app/javascript/styles/mastodon/components.scss | 1 -
 1 file changed, 1 deletion(-)

(limited to 'app/javascript/styles')

diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index 13f9dfae7..4c7ce9ba7 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -2512,7 +2512,6 @@ a.account__display-name {
   overflow-x: hidden;
   flex: 1 1 auto;
   -webkit-overflow-scrolling: touch;
-  will-change: transform; // improves perf in mobile Chrome
 
   &.optionally-scrollable {
     overflow-y: auto;
-- 
cgit