Fix schedule table column widths

osmus · Jan 9, 2025 · 851e1cc · 851e1cc
1 parent f73698a
commit 851e1cc
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 31 deletions.
diff --git a/_includes/item_time.html b/_includes/item_time.html
@@ -1,2 +1,2 @@
 {%- assign eventPage = site.pages | find: "title", include.item.event -%}
-<span class="time" totimezone="{{ include.item.timezone | default: eventPage.timezone }}" time="{{ include.item.date | date: '%s' }}">{{ include.item.date | date: "%l:%M %p" }} EST</span>
+<span class="time" {% if include.hidetimezone %}hidetz{% endif %} totimezone="{{ include.item.timezone | default: eventPage.timezone }}" time="{{ include.item.date | date: '%s' }}">{{ include.item.date | date: "%l:%M %p" }}{% unless include.hidetimezone %} EST{% endunless %}</span>
diff --git a/_includes/schedule_table.html b/_includes/schedule_table.html
@@ -28,38 +28,43 @@
           <th>Track {{i}}</th>
         {%- endfor -%}
       {%- else -%}
-        <th colspan="{{ maxTracksAtOnce }}">Session</th>
+        <th colspan="{{ maxTracksAtOnce }}" style="width: {{ 100.0 | divided_by: maxTracksAtOnceOnDay }}%;">Session</th>
       {%- endif -%}
     </tr>
     {%- for obj2 in sessionsByMinute -%}
       {%- assign sessionsForMinute = obj2.items -%}
       <tr start="{{sessionsForMinute.first.date | date: '%s'}}" end="{{sessionsForMinute.first.date | date: '%s'}}" {% unless sessionsForMinute.first.url %}class="interstitial"{% endunless %}>
-        <td>{%- include item_time.html item=sessionsForMinute.first -%}</td>
-        {%- for item in sessionsForMinute -%}
-          {%- assign names=item.author | default: item.speaker -%}
-          {%- assign title=item.title -%}
-          <td colspan="{{ maxTracksAtOnce | plus: 1 | minus: sessionsForMinute.size }}">
-            {%- if title and title.size > 0 -%}
-                <p class="title">
-                    {%- if item.url -%}
-                        <a href="{{item.url | absolute_url}}">{{title}} {% if item.youtube or item.podbean or item.video_src %}<svg class="iconsvg"><use xlink:href="#play-circle"></use></svg>{% endif %}</a>
-                    {%- else -%}
-                        {{title}}
-                    {%- endif -%}
+        <td>{%- include item_time.html item=sessionsForMinute.first hidetimezone=true -%}</td>
+        {%- for i in (1..maxTracksAtOnceOnDay) -%}
+          <td colspan="{{ maxTracksAtOnce | plus: 1 | minus: maxTracksAtOnceOnDay }}" style="width: {{ 100.0 | divided_by: maxTracksAtOnceOnDay }}%;">
+            {%- if i <= sessionsForMinute.size -%}
+              {%- assign item=sessionsForMinute[forloop.index0] -%}
+              {%- assign names=item.author | default: item.speaker -%}
+              {%- assign title=item.title -%}
+              {%- if title and title.size > 0 -%}
+                  <p class="title">
+                      {%- if item.url -%}
+                          <a href="{{item.url | absolute_url}}">{{title}} {% if item.youtube or item.podbean or item.video_src %}<svg class="iconsvg"><use xlink:href="#play-circle"></use></svg>{% endif %}</a>
+                      {%- else -%}
+                          {{title}}
+                      {%- endif -%}
+                  </p>
+              {%- endif -%}
+              <p class="meta">
+                  {% if names %}
+                      {% include names_list.html names=names %}
+                  {% endif %}
+              </p>
+              {%- if maxTracksAtOnceOnDay <= 3 -%}
+                <p class="excerpt">
+                    {% if item.blurb %}
+                        {{ item.blurb | markdownify }}
+                    {% else %}
+                        {{ item.content | strip_html | markdownify | strip_html | truncatewords: 64 }}
+                    {% endif %}
                 </p>
+              {%- endif -%}
             {%- endif -%}
-            <p class="meta">
-                {% if names %}
-                    {% include names_list.html names=names %}
-                {% endif %}
-            </p>
-            <p class="excerpt">
-                {% if item.blurb %}
-                    {{ item.blurb | markdownify }}
-                {% else %}
-                    {{ item.content | strip_html | markdownify | strip_html | truncatewords: 64 }}
-                {% endif %}
-            </p>
           </td>
         {%- endfor -%}
       </tr>

diff --git a/_includes/scripts/time_localizer.js b/_includes/scripts/time_localizer.js
@@ -8,12 +8,15 @@ document.addEventListener("DOMContentLoaded", function() {
       timeZoneName: 'long',
       timeZone: targetTimeZone,
     }).substring(4);
-    var localizedTimeString = date.toLocaleString(undefined, {
+    let ops = {
       hour: 'numeric',
       minute: 'numeric',
-      timeZoneName: 'short',
       timeZone: targetTimeZone,
-    });
+    };
+    if (!el.hasAttribute('hidetz')) {
+      ops.timeZoneName = 'short';
+    }
+    var localizedTimeString = date.toLocaleString(undefined, ops);
     el.innerHTML = '<span title="' + timeZoneLabel + '">' + localizedTimeString + '</span>';
   });
 

diff --git a/_sass/dogwood/_layout.scss b/_sass/dogwood/_layout.scss
@@ -812,11 +812,12 @@ table.schedule {
     border-right: 1px solid $grid-color;
     &:first-child {
       border-left: 1px solid $grid-color;
+      width: 100px;
     }
   }
   td {
-    &:first-child {
-      width: 100px;
+    .time span {
+      white-space: nowrap;
     }
     .title {
       font-weight: 600;