Fix use of inline CSS in public pages (#13576)

Change `account_link_to` to use an image tag rather than some
inline CSS. Dropped the `size` parameter in the process, but it wasn't
used for anything except the default value of 36px.

Dropped CSS rules that were always overriden, and defaulted to 36px width
and height instead.

diff --git a/app/helpers/home_helper.rb b/app/helpers/home_helper.rb
index b66e827fee2282928a576ac7cd06385d185c1863..4da68500a1b2aa93055b504b842815bbef167b59 100644 (file)
--- a/app/helpers/home_helper.rb
+++ b/app/helpers/home_helper.rb
@@ -7,13 +7,13 @@ module HomeHelper
     }
   end
 
-  def account_link_to(account, button = '', size: 36, path: nil)
+  def account_link_to(account, button = '', path: nil)
     content_tag(:div, class: 'account') do
       content_tag(:div, class: 'account__wrapper') do
         section = if account.nil?
                     content_tag(:div, class: 'account__display-name') do
                       content_tag(:div, class: 'account__avatar-wrapper') do
-                        content_tag(:div, '', class: 'account__avatar', style: "width: #{size}px; height: #{size}px; background-size: #{size}px #{size}px; background-image: url(#{full_asset_url('avatars/original/missing.png', skip_pipeline: true)})")
+                        image_tag(full_asset_url('avatars/original/missing.png', skip_pipeline: true), class: 'account__avatar')
                       end +
                         content_tag(:span, class: 'display-name') do
                           content_tag(:strong, t('about.contact_missing')) +
@@ -23,7 +23,7 @@ module HomeHelper
                   else
                     link_to(path || ActivityPub::TagManager.instance.url_for(account), class: 'account__display-name') do
                       content_tag(:div, class: 'account__avatar-wrapper') do
-                        content_tag(:div, '', class: 'account__avatar', style: "width: #{size}px; height: #{size}px; background-size: #{size}px #{size}px; background-image: url(#{full_asset_url(current_account&.user&.setting_auto_play_gif ? account.avatar_original_url : account.avatar_static_url)})")
+                        image_tag(full_asset_url(current_account&.user&.setting_auto_play_gif ? account.avatar_original_url : account.avatar_static_url), class: 'account__avatar')
                       end +
                         content_tag(:span, class: 'display-name') do
                           content_tag(:bdi) do

diff --git a/app/javascript/styles/mastodon/about.scss b/app/javascript/styles/mastodon/about.scss
index 711f349651c01079cd07aaf71049234ad845aafe..3be0aee49bcaab3646dedc80da8df89e031e8076 100644 (file)
--- a/app/javascript/styles/mastodon/about.scss
+++ b/app/javascript/styles/mastodon/about.scss
@@ -543,12 +543,6 @@ $small-breakpoint: 960px;
         flex: 0 0 auto;
       }
 
-      &__avatar {
-        width: 44px;
-        height: 44px;
-        background-size: 44px 44px;
-      }
-
       .display-name {
         font-size: 15px;
 
@@ -749,12 +743,6 @@ $small-breakpoint: 960px;
         display: flex;
         align-items: center;
       }
-
-      .account__avatar {
-        width: 44px;
-        height: 44px;
-        background-size: 44px 44px;
-      }
     }
 
     &__counters__wrapper {

diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index e22b8771176827be54c83783dd98dedd92da8d43..3a67bde8f4b938c575c207cddf697396b99c07b1 100644 (file)
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -1318,8 +1318,13 @@
 
 .account__avatar {
   @include avatar-radius;
+  display: block;
   position: relative;
 
+  width: 36px;
+  height: 36px;
+  background-size: 36px 36px;
+
   &-inline {
     display: inline-block;
     vertical-align: middle;

diff --git a/app/javascript/styles/mastodon/widgets.scss b/app/javascript/styles/mastodon/widgets.scss
index ca050a8d9931d4ba2de070689a364e0810f5945d..5b97d1ec4f3e16d999b7a5293c4f168356fa0bbd 100644 (file)
--- a/app/javascript/styles/mastodon/widgets.scss
+++ b/app/javascript/styles/mastodon/widgets.scss
@@ -93,12 +93,6 @@
       display: flex;
       align-items: center;
     }
-
-    .account__avatar {
-      width: 44px;
-      height: 44px;
-      background-size: 44px 44px;
-    }
   }
 
   .trends__item {

diff --git a/app/views/admin/reports/index.html.haml b/app/views/admin/reports/index.html.haml
index 0263b80fb7241480ce0360fe0a1d17b3fd320cf7..2149fcc4656429f41dd10b1cac965bd3f5317789 100644 (file)
--- a/app/views/admin/reports/index.html.haml
+++ b/app/views/admin/reports/index.html.haml
@@ -25,7 +25,7 @@
   - target_account = reports.first.target_account
   .report-card
     .report-card__profile
-      = account_link_to target_account, '', size: 36, path: admin_account_path(target_account.id)
+      = account_link_to target_account, '', path: admin_account_path(target_account.id)
       .report-card__profile__stats
         = link_to t('admin.reports.account.notes', count: target_account.targeted_moderation_notes.count), admin_account_path(target_account.id)
         %br/