styling updates

src/public/css/eventsheet.css

@@ -19,6 +19,7 @@
   --color-grey-700: #495057;
   --color-grey-800: #343a40;
   --color-grey-900: #212529;
+  --header-height: 17px;
   --row-height: 14px;
   --monospace-font: "Inconsolata", monospace;
   --section-border: 0.5px solid black;
@@ -82,7 +83,7 @@ body {
   text-transform: uppercase;
 }
 
-table, .lineup-card {
+table, .lineup-card table {
   font-size: inherit;
   border-collapse: collapse;
   empty-cells: show;
@@ -92,18 +93,20 @@ table, .lineup-card {
   overflow-y: hidden;
   width: 100%;
 }
-table th, .lineup-card th, table td, table #roster-and-history .position, #roster-and-history table .position, .lineup-card td, .lineup-card #roster-and-history .position, #roster-and-history .lineup-card .position {
+table th, .lineup-card table th {
+  color: var(--color-grey-700);
+}
+table th, .lineup-card table th, table td, table #roster-and-history .position, #roster-and-history table .position, .lineup-card table td {
   overflow: hidden;
   padding: 0 2px 0 2px;
 }
-table th:empty::after, .lineup-card th:empty::after, table td:empty::after, table #roster-and-history .position:empty::after, #roster-and-history table .position:empty::after, .lineup-card td:empty::after, .lineup-card #roster-and-history .position:empty::after, #roster-and-history .lineup-card .position:empty::after {
+table th:empty::after, table td:empty::after, table #roster-and-history .position:empty::after, #roster-and-history table .position:empty::after {
   content: " ";
 }
-
+table.striped tr:nth-child(odd), .lineup-card table tr:nth-child(odd) {
-table.striped tr:nth-child(odd), .lineup-card tr:nth-child(odd) {
   background-color: whitesmoke;
 }
-table.striped tr:nth-child(even), .lineup-card tr:nth-child(even) {
+table.striped tr:nth-child(even), .lineup-card table tr:nth-child(even) {
   background-color: white;
 }
 
@@ -115,56 +118,83 @@ table.striped tr:nth-child(even), .lineup-card tr:nth-child(even) {
   float: left;
 }
 
-section {
+.eventsheet {
+  --page-margin: 0.175in;
+}
+.eventsheet:has(section) {
+  display: grid;
+}
+.eventsheet:has(section) section {
+  --divider-border: lightgrey dashed 1px;
   box-sizing: content-box;
   overflow: hidden;
-  /* outline: 0.5px dashed lightgrey; */
   display: flex;
   flex-direction: column;
   align-items: stretch;
+  outline-style: solid;
+  outline-width: calc(var(--divider-border) / 4);
+  outline-color: lightgray;
 }
-section > div {
+.eventsheet:has(section) section > div {
   display: flex;
   flex: 1;
   align-items: stretch;
   height: auto;
+  width: 100%;
 }
-
+.eventsheet:has(section) section.NW {
-.eventsheet.quarters, .eventsheet.quarters .section-divider {
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-  grid-template-rows: 1fr 1fr;
-  column-gap: 0.35in;
-  row-gap: 0.35in;
-}
-.eventsheet.quarters.NW {
   grid-area: 1/1/2/2;
 }
-.eventsheet.quarters.NE {
+.eventsheet:has(section) section.NE {
   grid-area: 1/2/2/3;
 }
-.eventsheet.quarters.SW {
+.eventsheet:has(section) section.SW {
   grid-area: 2/1/3/2;
 }
-.eventsheet.quarters.SE {
+.eventsheet:has(section) section.SE {
   grid-area: 2/2/3/3;
 }
-.eventsheet.quarters > .section-divider {
+.eventsheet:has(section) section.NW .divider, .eventsheet:has(section) section.SW .divider {
-  --divider-border: lightgrey dashed 1px;
-  position: absolute;
-  grid-column-gap: 0px;
-  grid-row-gap: 0px;
-  height: 100%;
-  width: 100%;
-  box-sizing: border-box;
-}
-.eventsheet.quarters > .section-divider .NW, .eventsheet.quarters > .section-divider .SW {
   border-right: var(--divider-border);
 }
-.eventsheet.quarters > .section-divider .NW, .eventsheet.quarters > .section-divider .NE {
+.eventsheet:has(section) section.NW .divider, .eventsheet:has(section) section.NE .divider {
   border-bottom: var(--divider-border);
 }
 
+.eventsheet.quarters {
+  --section-margin: calc(var(--page-margin)/2);
+  grid-template-columns: 1fr 1fr;
+  grid-template-rows: 1fr 1fr;
+  column-gap: calc(var(--page-margin) * 2);
+  row-gap: calc(var(--page-margin) * 2);
+  outline-offset: var(--section-margin);
+}
+.eventsheet.quarters section {
+  outline-offset: var(--page-margin);
+}
+
+.letter .eventsheet.index-cards-4x6 {
+  --section-margin: calc(var(--page-margin)/2);
+  grid-template-columns: 1fr 1fr;
+  grid-template-rows: 1fr 125mm;
+  column-gap: calc(var(--page-margin) * 2);
+  row-gap: calc(var(--page-margin) * 2);
+}
+.letter .eventsheet.index-cards-4x6 section {
+  outline-offset: var(--page-margin);
+}
+
+.letter .eventsheet.index-cards-3x5 {
+  --section-margin: calc(var(--page-margin)/2);
+  grid-template-columns: 3in 3in;
+  grid-template-rows: 5in 5in;
+  column-gap: calc(var(--page-margin) * 2);
+  row-gap: calc(var(--page-margin) * 2);
+}
+.letter .eventsheet.index-cards-3x5 section {
+  outline-offset: var(--page-margin);
+}
+
 .lineup-card {
   counter-reset: lineup-sequence-counter 0;
   --border: 0.5px solid grey;
@@ -176,6 +206,7 @@ section > div {
   font-stretch: 85%;
   border-style: none;
   border-bottom: var(--border);
+  height: var(--header-height);
 }
 .lineup-card header:empty::after {
   content: " ";
@@ -199,7 +230,7 @@ section > div {
   font-size: 0.7em;
   border-bottom: var(--border);
 }
-.lineup-card table, .lineup-card .lineup-card {
+.lineup-card table {
   font-size: 21px;
 }
 .lineup-card td, .lineup-card #roster-and-history .position, #roster-and-history .lineup-card .position {
@@ -238,13 +269,13 @@ section > div {
   display: none;
 }
 
-section.blank {
+section.blank img, section.blank header {
+  filter: grayscale(1) opacity(0.4);
+}
+section.blank > div {
   filter: opacity(0.4);
 }
-section.blank img, section.blank header {
+section.blank > div td.substitution, section.blank > div #roster-and-history .substitution.position, #roster-and-history section.blank > div .substitution.position {
-  filter: grayscale(1);
-}
-section.blank td.substitution, section.blank #roster-and-history .substitution.position, #roster-and-history section.blank .substitution.position {
   border-width: 0.5;
 }
 
@@ -270,38 +301,38 @@ section.blank td.substitution, section.blank #roster-and-history .substitution.p
   border-right: 0.5px solid grey;
   border-left: 0.5px solid grey;
 }
-#todays-game .footer table, #todays-game .footer .lineup-card {
+#todays-game .footer table {
   height: 100%;
   outline: none;
   border-style: none;
 }
-#todays-game .footer table tr, #todays-game .footer .lineup-card tr {
+#todays-game .footer table tr {
   background-color: white;
   outline: none;
   border-bottom: 0.5px solid var(--color-grey-500);
 }
-#todays-game .footer table tr :last-child, #todays-game .footer .lineup-card tr :last-child {
+#todays-game .footer table tr :last-child {
   background-color: white;
   outline: none;
   border-bottom-style: none;
 }
-#todays-game .footer table th, #todays-game .footer .lineup-card th {
+#todays-game .footer table th {
   text-align: left;
   color: var(--color-grey-600);
 }
-#todays-game .footer table td, #todays-game .footer table #roster-and-history .position, #roster-and-history #todays-game .footer table .position, #todays-game .footer .lineup-card td, #todays-game .footer .lineup-card #roster-and-history .position, #roster-and-history #todays-game .footer .lineup-card .position {
+#todays-game .footer table td, #todays-game .footer table #roster-and-history .position, #roster-and-history #todays-game .footer table .position {
   height: var(--row-height);
   border: none;
 }
-#todays-game .footer table tdempty::after, #todays-game .footer .lineup-card tdempty::after {
+#todays-game .footer table tdempty::after {
   content: "";
 }
-#todays-game table.notes th, #todays-game .notes.lineup-card th {
+#todays-game table.notes th {
   border-left: none;
   border-right: none;
   line-height: 1em;
 }
-#todays-game table.notes td:empty::after, #todays-game table.notes #roster-and-history .position:empty::after, #roster-and-history #todays-game table.notes .position:empty::after, #todays-game .notes.lineup-card td:empty::after, #todays-game .notes.lineup-card #roster-and-history .position:empty::after, #roster-and-history #todays-game .notes.lineup-card .position:empty::after {
+#todays-game table.notes td:empty::after, #todays-game table.notes #roster-and-history .position:empty::after, #roster-and-history #todays-game table.notes .position:empty::after {
   content: "";
 }
 
@@ -311,7 +342,7 @@ section.blank td.substitution, section.blank #roster-and-history .substitution.p
 #defense-card .footer {
   display: none;
 }
-#defense-card .slot-set table, #defense-card .slot-set .lineup-card {
+#defense-card .slot-set table {
   font-size: 14px;
   width: 120px;
 }
@@ -324,10 +355,10 @@ section.blank td.substitution, section.blank #roster-and-history .substitution.p
   margin-bottom: inherit !important;
   grid-area: 5/1/6/5 !important;
 }
-#defense-card .slot-set.pos-p table, #defense-card .slot-set.pos-p .lineup-card {
+#defense-card .slot-set.pos-p table {
   width: 120px !important;
 }
-#defense-card .slot-set.pos-p table tbody > tr:last-child, #defense-card .slot-set.pos-p .lineup-card tbody > tr:last-child {
+#defense-card .slot-set.pos-p table tbody > tr:last-child {
   display: table-row;
 }
 
@@ -360,17 +391,18 @@ section.blank td.substitution, section.blank #roster-and-history .substitution.p
 #defense-pane .slot-set .player-name {
   font-stretch: 80%;
 }
-#defense-pane .slot-set table, #defense-pane .slot-set .lineup-card {
+#defense-pane .slot-set table {
   --border: grey solid 0.5px;
   border: var(--border);
+  opacity: 85%;
 }
-#defense-pane .slot-set table tr:first-child th, #defense-pane .slot-set .lineup-card tr:first-child th {
+#defense-pane .slot-set table tr:first-child th {
   border-bottom: var(--border);
 }
-#defense-pane .slot-set table tr + tr, #defense-pane .slot-set .lineup-card tr + tr {
+#defense-pane .slot-set table tr + tr {
   border-top: var(--border);
 }
-#defense-pane .slot-set table tr th.position, #defense-pane .slot-set .lineup-card tr th.position {
+#defense-pane .slot-set table tr th.position {
   font-family: var(--monospace-font);
   width: 2ch;
   text-align: right;
@@ -466,7 +498,7 @@ section.blank td.substitution, section.blank #roster-and-history .substitution.p
   margin-bottom: 4px;
   grid-area: 6/1/7/5;
 }
-#defense-pane .slot-set.pos-p table, #defense-pane .slot-set.pos-p .lineup-card {
+#defense-pane .slot-set.pos-p table {
   width: 100%;
 }
 #defense-pane .slot-set.pos-p tr.substitute .position:empty {
@@ -484,7 +516,7 @@ section.blank td.substitution, section.blank #roster-and-history .substitution.p
   counter-reset: lineup-sequence-counter 0;
   /* outline: 0.5px solid black; */
 }
-#offense-pane table, #offense-pane .lineup-card {
+#offense-pane table {
   height: 100%;
   border: none;
 }
@@ -595,8 +627,9 @@ header {
 }
 #roster-and-history thead {
   border: black solid 1px;
+  height: var(--header-height);
 }
-#roster-and-history > div > table, #roster-and-history > div > .lineup-card {
+#roster-and-history > div > table {
   /* font-size: 10.5px; */
   padding: 0;
   line-height: 1em;
@@ -672,7 +705,6 @@ header {
 }
 #roster-and-history td.jersey-number, #roster-and-history .jersey-number.position {
   color: black;
-  border-left: 0.5px solid lightgrey;
 }
 #roster-and-history colgroup {
   border-left-width: 1px;
@@ -692,7 +724,6 @@ header {
 }
 #roster-and-history th.availability-on-day div, #roster-and-history th.position div {
   transform: rotate(270deg);
-  margin-bottom: -5;
   /* font-stretch: 40%; */
   font-stretch: 75%;
   font-weight: 500;
@@ -756,7 +787,6 @@ td.is-present-checkbox.available-status-code-None > span, #roster-and-history .i
 #front-cover Header .game-number, #front-cover Header .homeaway {
   display: grid;
   align-content: center;
-  width: 1.4em;
 }
 #front-cover Header .game-number {
   font-size: large;
@@ -764,6 +794,9 @@ td.is-present-checkbox.available-status-code-None > span, #roster-and-history .i
   font-weight: 700;
   text-wrap: nowrap;
 }
+#front-cover > div {
+  width: inherit;
+}
 #front-cover th {
   background-color: whitesmoke;
 }

src/public/css/eventsheet.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../scss/eventsheet.scss"],"names":[],"mappings":";AAAQ;AACA;AACA;AACA;AACA;AACA;AAER;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIF;AACA;EACE;IACE;;EAEF;IACE;;EAEF;IACE;IACA;;;AAIJ;AACA;EACE;IACE;;EAEF;IACE;;EAEF;IACE;IACA;IACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;;;AAGF;AACA;EAA+B;EAAc;;;AAC7C;EAA+B;EAAc;;;AAC7C;EAA+B;EAAc;;;AAE7C;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;;AAEA;EACE;;;AAOF;EACE;;AAGF;EACE;;;AAKN;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;AACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;;AAKF;EACE;EACA;EACA;EACA;EACA;;AAGA;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAGJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;;AAKN;EACE;EAEA;EAEA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;;AAIJ;EACE;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAMN;EACE;EACA;EACA;;AAGF;EACE;;AAGF;AACE;;AACA;EACE;;AACA;EACE;;AAGJ;EACE;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAIJ;EAEE;;AAIA;EACE;EACA;;AAEF;EACE;;AAKF;EACE;;AAGF;EACE;;;AAKN;EACE;;AACA;EACE;;AAEF;EACE;;;AAMF;EACE;EACA;EACA;EACA,qBACE;;AAIJ;EACE;;AAGF;EACE;;AAGF;AACE;EACA;EACA;EACA;AACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAIJ;EACE;EACA;;AAGF;EACE;EACA;;AACA;EACE;;AAQJ;EACE;EACA;EACA;;AAEF;EACE;;;AAON;EACE;;AAGF;EACE;;AAIA;EACE;EACA;;AAMF;EACE;;AAGF;EAOE;EACA;EACA;EACA;;AATA;EACE;;AACA;EACE;;;AAcV;EACE;;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAIA;EACE;;AAGF;EACE;EACA;;AAEE;EACE;;AAEF;EACE;;AAEF;EACA;EACA;EACA;;AAQA;EACE;;AACA;EACA,SA9BM;;AA2BR;EACE;;AACA;EACA,SA9BM;;AA2BR;EACE;;AACA;EACA,SA9BM;;AA2BR;EACE;;AACA;EACA,SA9BM;;AA2BR;EACE;;AACA;EACA,SA9BM;;AA2BR;EACE;;AACA;EACA,SA9BM;;AA2BR;EACE;;AACA;EACA,SA9BM;;AA2BR;EACE;;AACA;EACA,SA9BM;;AA2BR;EACE;;AACA;EACA,SA9BM;;AAmCZ;EACE;EAEA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EAIE;EACA;EACA;;AALA;EACE;;AAKF;EACE;;AACA;EACE;;;AASV;EACE;AACA;EACA;EAEA;EACA;AACA;;AAEA;EACE;EACA;;AAGF;EACE;;AACA;EACE;;;AAMN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAEF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;AAAA;EAEE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;AACA;EACE;;AAEF;AACE;EACA;EACA;AACA;;AAIA;EACA;;AAIF;EACE;;AAGF;EACE;EACA;EACA;EACA;;AAOF;EACE;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EAEE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;EAEE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAMN;EACE;EACA;EACA;;AAEF;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EAEE;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;AACA;EACA;EACA;EACA;;AAQJ;EACE;;AAGF;EACE;;AAGF;EACE;;;AAOJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;AACA;AAAA;;;AAIF;EACE;;;AAGF;EACE;;;AAGF;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAIJ;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;;AAKF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE","file":"eventsheet.css"}
+{"version":3,"sourceRoot":"","sources":["../../scss/eventsheet.scss"],"names":[],"mappings":";AAAQ;AACA;AACA;AACA;AACA;AACA;AAER;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIF;AACA;EACE;IACE;;EAEF;IACE;;EAEF;IACE;IACA;;;AAIJ;AACA;EACE;IACE;;EAEF;IACE;;EAEF;IACE;IACA;IACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;;;AAGF;AACA;EAA+B;EAAc;;;AAC7C;EAA+B;EAAc;;;AAC7C;EAA+B;EAAc;;;AAE7C;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAEF;EACE;EACA;;AAEA;EACE;;AAMA;EACE;;AAGF;EACE;;;AAOR;EACE;;;AAGF;EACE;;;AAGF;EACE;;AACA;EACE;;AACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAGF;EACE;;AAGF;EACE;;;AAMN;EACI;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;;AAIN;EACE;EACE;EACA;EACA;EACA;;AACA;EACE;;;AAIN;EACE;EACE;EACA;EACA;EACA;;AACA;EACE;;;AAIN;EACE;EAEA;EAEA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAIJ;EACE;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAMN;EACE;EACA;EACA;;AAGF;EAEE;;AAGF;AACE;;AACA;EACE;;AACA;EACE;;AAGJ;EACE;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAIJ;EAEE;;AAIA;EACE;EACA;;AAEF;EACE;;AAKF;EACE;;AAGF;EACE;;;AAMJ;EACE;;AAEF;EACE;;AACA;EACE;;;AAOJ;EACE;EACA;EACA;EACA,qBACE;;AAIJ;EACE;;AAGF;EACE;;AAGF;AACE;EACA;EACA;EACA;AACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAIJ;EACE;EACA;;AAGF;EACE;EACA;;AACA;EACE;;AAQJ;EACE;EACA;EACA;;AAEF;EACE;;;AAON;EACE;;AAGF;EACE;;AAIA;EACE;EACA;;AAMF;EACE;;AAGF;EAOE;EACA;EACA;EACA;;AATA;EACE;;AACA;EACE;;;AAcV;EACE;;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAIA;EACE;;AAGF;EACE;EACA;EACA;;AAEE;EACE;;AAEF;EACE;;AAEF;EACA;EACA;EACA;;AAQA;EACE;;AACA;EACA,SA/BM;;AA4BR;EACE;;AACA;EACA,SA/BM;;AA4BR;EACE;;AACA;EACA,SA/BM;;AA4BR;EACE;;AACA;EACA,SA/BM;;AA4BR;EACE;;AACA;EACA,SA/BM;;AA4BR;EACE;;AACA;EACA,SA/BM;;AA4BR;EACE;;AACA;EACA,SA/BM;;AA4BR;EACE;;AACA;EACA,SA/BM;;AA4BR;EACE;;AACA;EACA,SA/BM;;AAoCZ;EACE;EAEA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EAIE;EACA;EACA;;AALA;EACE;;AAKF;EACE;;AACA;EACE;;;AASV;EACE;AACA;EACA;EAEA;EACA;AACA;;AAEA;EACE;EACA;;AAGF;EACE;;AACA;EACE;;;AAMN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAEF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;AAAA;EAEE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;AACA;EACE;EACA;;AAEF;AACE;EACA;EACA;AACA;;AAIA;EACA;;AAIF;EACE;;AAGF;EACE;EACA;EACA;EACA;;AAOF;EACE;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EAEE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;EAEE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAMN;EACE;EACA;EACA;;AAEF;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EAEE;;AAGF;EACE;EACA;EACA;;AAEA;EACE;AACA;EACA;EACA;EACA;;AAQJ;EACE;;AAGF;EACE;;AAGF;EACE;;;AAOJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;AACA;AAAA;;;AAIF;EACE;;;AAGF;EACE;;;AAGF;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAIJ;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE","file":"eventsheet.css"}

src/scss/eventsheet.scss

@@ -19,6 +19,7 @@
   --color-grey-700: #495057;
   --color-grey-800: #343a40;
   --color-grey-900: #212529;
+  --header-height: 17px;
   --row-height: 14px;
   --monospace-font: "Inconsolata", monospace;
   --section-border: 0.5px solid black; 
@@ -83,6 +84,9 @@ table {
   overflow-x: hidden;
   overflow-y: hidden;
   width: 100%;
+  th {
+    color: var(--color-grey-700);
+  }
   th, td {
     overflow: hidden;
     padding: 0 2px 0 2px; 
@@ -91,20 +95,21 @@ table {
       content: "\00a0";
     }
   }
-}
 
-table.striped {
+  &.striped {
-  tr {
+    tr {
-    &:nth-child(odd) {
+      &:nth-child(odd) {
-      background-color: whitesmoke;
+        background-color: whitesmoke;
-    }
+      }
-    
+      
-    &:nth-child(even) {
+      &:nth-child(even) {
-      background-color: white;
+        background-color: white;
+      }
     }
   }
 }
 
+
 .float-right {
   float: right;
 }
@@ -113,31 +118,29 @@ table.striped {
   float: left;
 }
 
-section {
+.eventsheet{
-  box-sizing: content-box;
+  --page-margin: 0.175in;
-  overflow: hidden;
+  &:has(section) {
-  /* outline: 0.5px dashed lightgrey; */
-  display: flex;
-  flex-direction: column;
-  align-items: stretch;
-
-  > div {
-    display: flex;
-    flex: 1;
-    align-items: stretch;
-    height: auto;
-  }
-}
-
-.eventsheet.quarters {
-  &, .section-divider {
     display: grid;
-    grid-template-columns: 1fr 1fr;
+    section {
-    grid-template-rows: 1fr 1fr;
+    --divider-border: lightgrey dashed 1px;
-    column-gap: 0.35in;
+    box-sizing: content-box;
-    row-gap: 0.35in;
+    overflow: hidden;
-  }
+    display: flex;
+    flex-direction: column;
+    align-items: stretch;
+    outline-style: solid;
+    outline-width: calc(var(--divider-border)/4);
+    outline-color: lightgray;
   
+    > div {
+      display: flex;
+      flex: 1;
+      align-items: stretch;
+      height: auto;
+      width:100%
+    }
+
     &.NW {
       grid-area: 1 / 1 / 2 / 2;
     }
@@ -151,28 +154,54 @@ section {
       grid-area: 2 / 2 / 3 / 3;
       }
 
-  > .section-divider {
+    &.NW .divider, &.SW .divider {
-    --divider-border: lightgrey dashed 1px;
-    position:  absolute;
-    grid-column-gap: 0px;
-    grid-row-gap: 0px;
-    height: 100%;
-    width: 100%;
-    box-sizing: border-box;
-
-    .NW, .SW {
       border-right:var(--divider-border);
     }
-
+  
-    .NW, .NE {
+    &.NW .divider, &.NE .divider {
       border-bottom:var(--divider-border);
     }
+    }
   }
 }
 
+.eventsheet.quarters {
+    --section-margin: calc(var(--page-margin)/2);
+    grid-template-columns: 1fr 1fr;
+    grid-template-rows: 1fr 1fr;
+    column-gap: calc(var(--page-margin)*2);
+    row-gap: calc(var(--page-margin)*2);
+    outline-offset: var(--section-margin);
+    section {
+      outline-offset: var(--page-margin);
+    }
+}
+
+.letter .eventsheet.index-cards-4x6 {
+  --section-margin: calc(var(--page-margin)/2);
+    grid-template-columns: 1fr 1fr;
+    grid-template-rows: 1fr 125mm;
+    column-gap: calc(var(--page-margin)*2);
+    row-gap: calc(var(--page-margin)*2);
+    section {
+      outline-offset: var(--page-margin);
+    }
+}
+
+.letter .eventsheet.index-cards-3x5 {
+  --section-margin: calc(var(--page-margin)/2);
+    grid-template-columns: 3in 3in;
+    grid-template-rows: 5in 5in;
+    column-gap: calc(var(--page-margin)*2);
+    row-gap: calc(var(--page-margin)*2);
+    section {
+      outline-offset: var(--page-margin);
+    }
+}
+
 .lineup-card {
   counter-reset: lineup-sequence-counter 0;
-  @extend table, .striped;
+  
   --border: 0.5px solid grey;
 
   border: var(--section-border);
@@ -183,6 +212,7 @@ section {
     font-stretch: 85%;
     border-style: none;
     border-bottom: var(--border);
+    height: var(--header-height);
     &:empty::after {
       content: "\00a0";
     }
@@ -211,6 +241,7 @@ section {
   }
 
   table {
+    @extend table, .striped;
     font-size: 21px;
   }
   
@@ -261,13 +292,15 @@ section {
 } 
 
 section.blank {
-  filter: opacity(0.4);
   img, header {
-    filter: grayscale(1);
+    filter: grayscale(1) opacity(0.4);
-  }
-  td.substitution {
-    border-width: 0.5;
   }
+  > div {
+    filter: opacity(0.4);
+    td.substitution {
+      border-width: 0.5;
+    }  
+  } 
 }
 
 
@@ -422,6 +455,7 @@ section.blank {
     table {
       --border: grey solid 0.5px;
       border: var(--border);
+      opacity: 85%;
       tr {
         &:first-child th{
           border-bottom: var(--border);
@@ -630,6 +664,7 @@ header {
   --border: var(--section-border);
   thead {
     border: black solid 1px;
+    height: var(--header-height);
   }
   > div > table {
     /* font-size: 10.5px; */
@@ -725,7 +760,6 @@ header {
     }
     &.jersey-number {
       color: black;
-      border-left: 0.5px solid lightgrey;
     }
   }
 
@@ -750,7 +784,6 @@ header {
 
     &.availability-on-day div {
       transform: rotate(270deg);
-      margin-bottom: -5;
       /* font-stretch: 40%; */
       font-stretch: 75%;
       font-weight: 500;
@@ -827,7 +860,6 @@ td.is-present-checkbox.available-status-code-None > span {
     .game-number, .homeaway{
       display: grid;
       align-content: center;
-      width: 1.4em;
     }
   
     .game-number {
@@ -838,6 +870,10 @@ td.is-present-checkbox.available-status-code-None > span {
     }
   }
 
+  > div {
+    width: inherit;
+  }
+
   th {
     background-color: whitesmoke;
   }
@@ -852,8 +888,6 @@ td.is-present-checkbox.available-status-code-None > span {
     font-family: "Futura Now";
     text-transform: none;
   }
-
-  
   
   .head-to-head {
     padding:5px;

src/views/eventsheet/partials/page_section_divider.hbs

@@ -1,7 +0,0 @@
-
-<div class="section-divider">
-    <section class="NW"></section>
-    <section class="NE"></section>
-    <section class="SW"></section>
-    <section class="SE"></section>
-</div>

src/views/eventsheet/sheet.hbs

@@ -1,8 +1,8 @@
 <link rel="stylesheet" href="/css/eventsheet.css">
 
-<body class="B5">
+<body class="{{#if sheet_size}}{{sheet_size}}{{else}}B5{{/if}}">
-  <div class="sheet eventsheet quarters" id="page-1">
+  <div class="sheet eventsheet {{#if sheet_layout}}{{sheet_layout}}{{else}}quarters{{/if}}" id="page-1">
-    <section class="NW" id="defense-card">
+    <section class="NE" id="defense-card">
       <header>
         <div class="event-title float-left">
           {{event.formattedTitle}} – {{dateFormat event.startDate "ddd, MMM D h:mm A" }}
@@ -31,7 +31,7 @@
         </div>
       </div>
     </section>
-    <section class="NE" id="roster-and-history">
+    <section class="SW" id="roster-and-history">
       <div class="roster-and-history">
         {{> roster_and_history 
           event=event 
@@ -42,7 +42,7 @@
           }}
       </div>
     </section>
-    <section class="SW lineup-card dugout" id="lineup-card-dugout">
+    <section class="NW lineup-card dugout" id="lineup-card-dugout">
       <header>
         <div class="float-left event-title">{{event.formattedTitle}}</div>
         <div class="float-right homeaway">{{event.gameType}}</div>
@@ -118,10 +118,9 @@
         </table>
       </div>
     </section>
-    {{>page_section_divider}}
   </div>
-  <div class="sheet eventsheet quarters" id="page-2">
+  <div class="sheet eventsheet {{#if sheet_layout}}{{sheet_layout}}{{else}}quarters{{/if}}" id="page-2">
-    <section class="NW" id="front-cover">
+    <section class="SE" id="front-cover">
       <header>
         <div class="game-number">
           {{event.label}}
@@ -177,7 +176,7 @@
         {{/if}}
       </div>
     </section>
-    <section class="NE blank" id="defense-card">
+    <section class="NW blank" id="defense-card">
       <header>
         <div class="event-title float-left">
           &nbsp;
@@ -239,7 +238,7 @@
         </table>
       </div>
     </section>
-    <section class="SE lineup-card dugout blank" id="lineup-card-dugout-blank">
+    <section class="NE lineup-card dugout blank" id="lineup-card-dugout-blank">
       <header></header>
       <div class="starting-lineup-table">
         <table>
@@ -274,6 +273,5 @@
         </table>
       </div>
     </section>
-    {{>page_section_divider}}
   </div>
 </body>