From edeaa079b75885edd2be3677843c9cdb08a715ea Mon Sep 17 00:00:00 2001
From: Jules Laplace <julescarbon@gmail.com>
Date: Mon, 9 Nov 2020 23:50:30 +0100
Subject: animate credits height

---
 .../app/views/viewer/checklist/credits.components.js   |  2 +-
 .../frontend/app/views/viewer/checklist/credits.css    | 18 +++++++++++++++---
 2 files changed, 16 insertions(+), 4 deletions(-)

(limited to 'animism-align/frontend')

diff --git a/animism-align/frontend/app/views/viewer/checklist/credits.components.js b/animism-align/frontend/app/views/viewer/checklist/credits.components.js
index d466c5d..3e03ace 100644
--- a/animism-align/frontend/app/views/viewer/checklist/credits.components.js
+++ b/animism-align/frontend/app/views/viewer/checklist/credits.components.js
@@ -90,7 +90,7 @@ const CreditsVenue = ({ venue, open, setOpen }) => {
 export const ArtistColumns = ({ artists }) => {
   const artistGroups = groupColumns(artists.trim().split('\n'), 4)
   return (
-    <div className='artist-columns'>
+    <div className={'artist-columns columns-' + Math.floor(artistGroups[0].length / 2)}>
       <div className='credits-title'>
         Artists
       </div>
diff --git a/animism-align/frontend/app/views/viewer/checklist/credits.css b/animism-align/frontend/app/views/viewer/checklist/credits.css
index d7626f9..f4bbf42 100644
--- a/animism-align/frontend/app/views/viewer/checklist/credits.css
+++ b/animism-align/frontend/app/views/viewer/checklist/credits.css
@@ -103,7 +103,19 @@
   overflow: hidden;
   transition: height 0.5s;
 }
-.open .artist-columns,
-.open + .artist-columns {
+.open .artist-columns {
   height: 17rem;
-}
\ No newline at end of file
+}
+.open .artist-columns.columns-1,
+.open .artist-columns.columns-2,
+.open .artist-columns.columns-3 { height: 14rem; }
+.open .artist-columns.columns-4,
+.open .artist-columns.columns-5 { height: 17rem; }
+.open .artist-columns.columns-6 { height: 21rem; }
+.open .artist-columns.columns-7,
+.open .artist-columns.columns-8 { height: 23rem; }
+.open .artist-columns.columns-9,
+.open .artist-columns.columns-10 { height: 27rem; }
+.open .artist-columns.columns-11,
+.open .artist-columns.columns-12,
+.open .artist-columns.columns-13 { height: 30rem; }
-- 
cgit v1.2.3-70-g09d2