=Simple Calendar block up and running

Jake Vanderwerf

2026-09-14 7935d26cd16a4f8f69a59a44e27a7263b60e54bf

 src/simple-calendar/style.scss

@@ -19,5 +19,98 @@

   nav.calendar.types {
      height: max-content;
      ul,li, a {
         height: var(--chipchip);
      }
      ul {
         --justify: flex-start;
      }
      details {
         margin: 0;
         display: block;

         summary {
            width: 100%;
            display: flex;
         }

      }
   }

   .calendar.col {
      border-radius: .5rem;
      border: 2px solid rgb(var(--action-0));
      width: var(--btn_);
      --align: stretch;
      --gap: 0;

      span {
         text-align: center;
         text-transform: uppercase;
         line-height: .8;
      }
      .weekday {
         background-color: rgb(var(--action-0));
         color: rgb(var(--action-contrast));
         font-weight: var(--fw-h-bold);
         font-family: var(--heading);
         line-height: 1.4;
         margin-bottom: .5rem;
      }

      .day {
         font-size: var(--txt-xx-large);
      }
   }
   details {
      &#calendar, &#past {
         display: block;
      }
   }
   .item-list {
      list-style: none;
      margin: 0;
      min-width: 100%;

      > li {
         width: 100%;
         padding: 1rem .25rem;

         + li {
            margin-top: 1rem;
            border-top: 1px solid rgb(var(--base-200));
         }

         >img {
            max-width: 250px;
            margin: 0 auto;
         }

         .header {
            --gap: 1rem;
            --wrap: nowrap;
         }
         h3 {
            margin: 0;
         }
         .meta {
            display: flex;
            gap: 1rem;
         }
      }
   }
   .tags {
      --gap: 1rem;

      .tag {
         display: flex;
         gap: .5rem;
         background-color: rgb(var(--action-0));
         color: rgb(var(--action-contrast));
         font-size: var(--txt-x-small);
         text-transform: uppercase;
         border-radius: 4px;
         padding: .25rem .5rem 0;
      }
   }
}