Merge pull request #128 from djangocon/fix-youtube-layout

:nail_polish: Re-adds layout changes
djangocon · Oct 21, 2024 · 67402fe · 67402fe
2 parents 75de4f9 + a2b7768
commit 67402fe
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 19 deletions.
diff --git a/src/_data/site.json b/src/_data/site.json
@@ -25,7 +25,8 @@
     "flickr": "https://flickr.com/photos/djangocon/albums/",
     "github": "https://github.com/djangocon/",
     "mastodon": "https://fosstodon.org/@djangocon",
-    "twitter": "https://twitter.com/djangocon",
+    "twitter": "https://x.com/djangocon",
+    "x": "https://x.com/djangocon",
     "facebook": "https://www.facebook.com/djangoconus/",
     "instagram": "https://www.instagram.com/djangocon/"
   },

diff --git a/src/_includes/youtube-copy-and-paste.html b/src/_includes/youtube-copy-and-paste.html
@@ -6,14 +6,14 @@
 Follow {{ presenter.name }} 👇
 {% if presenter.social.github %}On GitHub: https://github.com/{{ presenter.social.github }}
 {% endif %}{% if presenter.social.mastodon %}On Mastodon: {{ presenter.social.mastodon }}
-{% endif %}{% if presenter.social.twitter %}On Twitter: https://twitter.com/{{ presenter.social.twitter }}
+{% endif %}{% if presenter.social.twitter %}On X: https://x.com/{{ presenter.social.twitter }}
 {% endif %}{% if presenter.social.website %}Website: {{ presenter.social.website }}
 {% endif %}
 {% endfor %}{% endif %}
 
 Follow DjangoCon US 👇
 {{ site.social.mastodon }}
-{{ site.social.twitter }}
+{{ site.social.x }}
 
 Follow DEFNA 👇
 https://www.defna.org/

diff --git a/src/youtube-talks.html b/src/youtube-talks.html
@@ -10,36 +10,44 @@
 permalink: /speaking/youtube/
 ---
 
-<script src="https://cdn.tailwindcss.com"></script>
-
 <div class="pb-2 hero">
   <div class="wrapper">
     <h1 class="text-center pageheading">{{ title }}</h1>
   </div>
 </div>
 
 <div class="pt-6 block-container">
-  <div class="wrapper">
+  <div class="wrapper grid grid-cols-1 gap-4">
 
     {% for day in collections.sessionsByDateAndTime %}
       {% if forloop.index0 > 0 %}
         {% for slot in day[1] %}
           {% for session in slot.sessions %}
             {% if session.presenter_slugs %}
-              <div class="event-byline mt-2 mb-2">
-              <h4>{{ day[0] | formatDateTime: "LLL d " }}{{ slot.start | formatDateTime: "h:mm aaa" }} EDT - {{ session.title }}</h4>
-
-              <div>
-                <a href="{{ post.video_url }}">On YouTube</a>
-              </div>
-
-              <textarea rows="10" id="copy-{{ session.fileSlug }}">
-                {% include "youtube-copy-and-paste.html", session:session %}
-              </textarea>
+              <div class="event-byline grid grid-cols-1 gap-2">
+                <div class="flex items-center justify-between gap-2 mx-2">
+                  <h4 class="flex-grow mr-2">
+                    <span>{{ day[0] | formatDateTime: "LLL d " }}{{ slot.start | formatDateTime: "h:mm aaa" }} EDT -</span>
+                    <span id="copy-{{ session.title|slugify }}-title">{{ session.title }}</span>
+                  </h4>
+                  {% if post.video_url %}
+                    <div class="btn bg-blue-200 border-solid border-2 border-grey-800 rounded-lg px-2 py-1 whitespace-nowrap" >
+                      <a href="{{ post.video_url }}">View on YouTube</a>
+                    </div>
+                  {% endif %}
+                  <button class="btn bg-blue-200 border-solid border-2 border-grey-800 rounded-lg px-2 py-1 whitespace-nowrap" data-clipboard-action="copy" data-clipboard-target="#copy-{{ session.title|slugify }}-title">
+                    Copy to clipboard
+                  </button>
+                </div>
 
-              <button class="btn bg-blue-200 border-solid border-2 border-grey-800 rounded-lg px-2 py-1" data-clipboard-action="copy" data-clipboard-target="#copy-{{ session.fileSlug }}">
-                Copy to clipboard
-              </button>
+                <div class="relative">
+<textarea rows="10" id="copy-{{ session.title|slugify }}" class="w-full pr-32">
+{% include "youtube-copy-and-paste.html", session:session %}
+</textarea>
+                  <button class="btn bg-blue-200 border-solid border-2 border-grey-800 rounded-lg px-2 py-1 absolute top-2 right-2" data-clipboard-action="copy" data-clipboard-target="#copy-{{ session.title|slugify }}">
+                    Copy to clipboard
+                  </button>
+                </div>
               </div>
               <hr>
             {% endif %}