From cbb85c430c48fef55632ffdd330d8899d925a403 Mon Sep 17 00:00:00 2001
From: ludwiczakpawel <ludwiczakpawel@gmail.com>
Date: Sat, 22 Aug 2020 17:18:32 +0200
Subject: [PATCH] Long titles wrapping (#9915)

* .

* .

* ffs revert

* other places too
---
 app/assets/stylesheets/views/article.scss             | 2 ++
 app/views/dashboards/followers.html.erb               | 2 +-
 app/views/dashboards/following_organizations.html.erb | 2 +-
 app/views/dashboards/following_podcasts.html.erb      | 2 +-
 app/views/dashboards/following_tags.html.erb          | 2 +-
 app/views/dashboards/following_users.html.erb         | 2 +-
 6 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/app/assets/stylesheets/views/article.scss b/app/assets/stylesheets/views/article.scss
index 34500c524..7dae2ca2b 100644
--- a/app/assets/stylesheets/views/article.scss
+++ b/app/assets/stylesheets/views/article.scss
@@ -63,6 +63,8 @@
 
   &__header {
     margin-bottom: var(--article-padding-y);
+    overflow-wrap: anywhere;
+    word-break: break-word;
 
     &__meta {
       padding: var(--article-padding-y) var(--article-padding-x) 0
diff --git a/app/views/dashboards/followers.html.erb b/app/views/dashboards/followers.html.erb
index b2ddff2db..d284a4d0f 100644
--- a/app/views/dashboards/followers.html.erb
+++ b/app/views/dashboards/followers.html.erb
@@ -19,7 +19,7 @@
           <% @follows.each do |follow| %>
             <% user = follow.follower %>
             <% if user %>
-              <div class="crayons-card p-4 m:p-6 flex s:grid single-article" id="follows-<%= follow.id %>">
+              <div class="crayons-card p-4 m:p-6 flex s:grid single-article break-word content-center" id="follows-<%= follow.id %>">
                 <a href="<%= user.path %>" class="crayons-avatar crayons-avatar--2xl s:mb-2 s:mx-auto">
                   <img alt="<%= user.username %> profile image" class="crayons-avatar__image" src="<%= ProfileImage.new(user).get(width: 60) %>" />
                 </a>
diff --git a/app/views/dashboards/following_organizations.html.erb b/app/views/dashboards/following_organizations.html.erb
index 24b577537..b26fb03a7 100644
--- a/app/views/dashboards/following_organizations.html.erb
+++ b/app/views/dashboards/following_organizations.html.erb
@@ -19,7 +19,7 @@
         <div id="following-wrapper" class="grid gap-0 s:gap-3 m:gap-4 s:grid-cols-2 l:grid-cols-3 align-left s:align-center">
           <% @followed_organizations.each do |follow| %>
             <% organization = follow.followable %>
-            <div class="crayons-card p-4 m:p-6 flex s:grid single-article" id="follows-<%= follow.id %>">
+            <div class="crayons-card p-4 m:p-6 flex s:grid single-article break-word content-center" id="follows-<%= follow.id %>">
               <a href="<%= organization.path %>" class="crayons-logo crayons-logo--2xl s:mb-2 s:mx-auto">
                 <img alt="<%= organization.name %> logo" class="crayons-logo__image" src="<%= ProfileImage.new(organization).get(width: 60) %>" />
               </a>
diff --git a/app/views/dashboards/following_podcasts.html.erb b/app/views/dashboards/following_podcasts.html.erb
index 91a40a61a..671f2a2e7 100644
--- a/app/views/dashboards/following_podcasts.html.erb
+++ b/app/views/dashboards/following_podcasts.html.erb
@@ -19,7 +19,7 @@
         <div id="following-wrapper" class="grid gap-0 s:gap-3 m:gap-4 s:grid-cols-2 l:grid-cols-3 align-left s:align-center">
           <% @followed_podcasts.each do |follow| %>
             <% podcast = follow.followable %>
-            <div class="crayons-card p-4 m:p-6 flex s:grid single-article" id="follows-<%= follow.id %>">
+            <div class="crayons-card p-4 m:p-6 flex s:grid single-article break-word content-center" id="follows-<%= follow.id %>">
               <a href="/<%= podcast.path %>" class="crayons-logo crayons-logo--2xl s:mb-2 s:mx-auto">
                 <img alt="<%= podcast.name %> logo" class="crayons-logo__image" src="<%= podcast.image_url %>" />
               </a>
diff --git a/app/views/dashboards/following_tags.html.erb b/app/views/dashboards/following_tags.html.erb
index faf6d76e3..7a8f9f97b 100644
--- a/app/views/dashboards/following_tags.html.erb
+++ b/app/views/dashboards/following_tags.html.erb
@@ -26,7 +26,7 @@
             <% tag = follow.followable %>
             <% if tag %>
               <% color = HexComparer.new([tag.bg_color_hex || "#0000000", tag.text_color_hex || "#ffffff"]).brightness(0.8) %>
-              <div class="crayons-card branded-2 p-4 m:p-6 m:pt-4 flex flex-col single-article <% if follow.points < 0 %>opacity-75<% end %>" style="border-top-color: <%= color %>;" id="follows-<%= follow.id %>">
+              <div class="crayons-card branded-2 p-4 m:p-6 m:pt-4 flex flex-col single-article break-word content-center <% if follow.points < 0 %>opacity-75<% end %>" style="border-top-color: <%= color %>;" id="follows-<%= follow.id %>">
                 <h3 class="s:mb-1 -ml-1 p-0 fw-medium">
                   <a href="/t/<%= tag.name %>" class="crayons-tag crayons-tag--l">
                     <span class="crayons-tag__prefix">#</span><%= tag.name %>
diff --git a/app/views/dashboards/following_users.html.erb b/app/views/dashboards/following_users.html.erb
index 654a323cc..5200915ed 100644
--- a/app/views/dashboards/following_users.html.erb
+++ b/app/views/dashboards/following_users.html.erb
@@ -20,7 +20,7 @@
           <% @follows.each do |follow| %>
             <% user = follow.followable %>
             <% if user %>
-              <div class="crayons-card p-4 m:p-6 flex s:grid single-article" id="follows-<%= follow.id %>">
+              <div class="crayons-card p-4 m:p-6 flex s:grid single-article break-word content-center" id="follows-<%= follow.id %>">
                 <a href="<%= user.path %>" class="crayons-avatar crayons-avatar--2xl s:mb-2 s:mx-auto">
                   <img alt="<%= user.username %> profile image" class="crayons-avatar__image" src="<%= ProfileImage.new(user).get(width: 60) %>" />
                 </a>