fix(agenda): strikethrough cancelled and rescheduled events (ietf-tools#8694)

* fix(agenda): strikethrough cancelled and rescheduled events

* fix(agenda): rescheduled + canceled badges width on mobile

* fix(agenda): use em for canceled / rescheduled badge on mobile

* fix: deleting badge width/display:block CSS

---------

Co-authored-by: Matthew Holloway <matthew@staff.ietf.org>

Author: NGPixel

client/agenda/AgendaDetailsModal.vue

@@ -327,7 +327,6 @@ async function fetchSessionMaterials () {
     border-radius: 5px;
 
     .badge {
-      width: 30px;
       font-size: .7em;
       background-color: $yellow-200;
       border-bottom: 1px solid $yellow-500;

client/agenda/AgendaScheduleCalendar.vue

@@ -330,7 +330,6 @@ function close () {
     }
 
     .badge {
-      width: 30px;
       font-size: .7em;
       border: 1px solid #CCC;
       text-transform: uppercase;

client/agenda/AgendaScheduleList.vue

@@ -1097,8 +1097,6 @@ onBeforeUnmount(() => {
         }
 
         @media screen and (max-width: $bs5-break-md) {
-          width: 30px;
-          display: block;
           margin: 2px 0 0 0;
         }
       }
@@ -1321,6 +1319,11 @@ onBeforeUnmount(() => {
 
     &.agenda-table-cell-room {
       border-right: 1px solid darken($red-100, 5%) !important;
+      text-decoration: line-through;
+    }
+
+    &.agenda-table-cell-name > a, &.agenda-table-cell-name > span {
+      text-decoration: line-through;
     }
 
     &:last-child {
@@ -1348,6 +1351,11 @@ onBeforeUnmount(() => {
 
     &.agenda-table-cell-room {
       border-right: 1px solid darken($orange-100, 5%) !important;
+      text-decoration: line-through;
+    }
+
+    &.agenda-table-cell-name > a, &.agenda-table-cell-name > span {
+      text-decoration: line-through;
     }
 
     &:last-child {