Merge branch 'main' into docker

src/app.js

@@ -67,7 +67,7 @@ if (process.env.NODE_ENV === "development") {
 }
 
 app.use(bodyParser.json());
-app.use(bodyParser.urlencoded());
+app.use(bodyParser.urlencoded({extended: true }));
 app.use(logger("dev"));
 app.use(cors(corsOptions))
 app.use(cookieParser());

src/controllers/eventsheet.js

@@ -23,8 +23,14 @@ exports.getEventSheet = async (req,res) =>{
     ) 
   )
   await Promise.all(req.promises)
+  const {sheet_size, sheet_layout} = req.query
+
   const {user, team, team_preferences, members, event, event_lineup, event_lineup_entries, availabilities, availabilitySummary, timeline, recent_events, opponent_logo, upcoming_events} = req
-  res.render('eventsheet/sheet', {user, team, team_preferences, members, event, event_lineup, event_lineup_entries, availabilities, availabilitySummary, timeline, recent_events, opponent_logo,upcoming_events})
+  res.render('eventsheet/sheet', {sheet_size, sheet_layout, user, team, team_preferences, members, event, event_lineup, event_lineup_entries, availabilities, availabilitySummary, timeline, recent_events, opponent_logo,upcoming_events})
+}
+
+exports.getEventSheetBlank = (req,res) => {
+  res.render('eventsheet/sheet_blank')
 }
 
 exports.getLineupCard = (req, res, next) => {

src/helpers/eventsheet.js

@@ -60,7 +60,7 @@ exports.rosterHistory = (event, event_lineup_entries, members, availabilities, o
   // const {event, event_lineup_entries, members, availabilities} = options.data.root
   const players = members.filter(m=>!m.isNonPlayer)
   attachBenchcoachPropertiesToMember(players, event_lineup_entries ? event_lineup_entries.filter(i=>i.eventId==event.id) : [], availabilities.filter(i=>i.eventId==event.id))
-  players.sort(teamsnapMembersSortAvailabilityLastName)
+  players.sort(teamsnapMembersSortLineupAvailabilityLastName)
 
   players.forEach(member=>{
     const {firstName, lastName, jerseyNumber, benchcoach, position, id} = member

src/public/css/eventsheet.css

@@ -4,56 +4,7 @@
 @import url("https://fonts.googleapis.com/css2?family=Graduate");
 @import url("https://fonts.googleapis.com/css2?family=Inconsolata:wdth,wght@50..200,200..900&display=swap");
 @import url("/font/helvetica-now/stylesheet.css");
-@font-face {
+@import url("/font/futura-now/stylesheet.css");
-  font-family: "Futura Now";
-  src: url("/font/futura-now/futura-now.ttf") format("truetype");
-  font-weight: 125 900;
-  font-stretch: 50% 150%;
-}
-@page {
-  margin: 0;
-}
-/** For Print **/
-@media print {
-  body {
-    margin: 0;
-  }
-  body .sheet {
-    size: B5;
-    padding: 0.175in;
-  }
-}
-/** For screen preview **/
-@media screen {
-  body .sheet {
-    padding: 0.175in;
-  }
-  body {
-    background: #e0e0e0;
-  }
-  .sheet {
-    background: white;
-    box-shadow: 0 0.5mm 2mm rgba(0, 0, 0, 0.3);
-  }
-}
-.sheet {
-  overflow: hidden;
-  position: relative;
-  box-sizing: border-box;
-  page-break-after: always;
-}
-
-/** Paper sizes **/
-body.B5 .sheet {
-  width: 176mm;
-  height: 250mm;
-}
-
-body.index-card .sheet {
-  width: 3.5in;
-  height: 5in;
-}
-
 :root {
   --color-success: #b7e1cd;
   --color-danger: #f4c7c3;
@@ -68,18 +19,71 @@ body.index-card .sheet {
   --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;
+}
+
+/** For Print **/
+@media print {
+  :root {
+    margin: 0;
+  }
+  body {
+    margin: 0;
+  }
+  body .sheet {
+    padding: 0.175in;
+    background: white;
+  }
+}
+/** For screen preview **/
+@media screen {
+  body .sheet {
+    padding: 0.175in;
+  }
+  body {
+    background: #e0e0e0;
+  }
+  .sheet {
+    margin: auto;
+    margin-bottom: 12px;
+    box-shadow: 0 0.5mm 2mm rgba(0, 0, 0, 0.3);
+  }
+}
+.sheet {
+  overflow: hidden;
+  position: relative;
+  box-sizing: border-box;
+  page-break-after: always;
+  background: white;
+}
+
+/** Paper sizes **/
+body.B5 .sheet {
+  width: 176mm;
+  height: 250mm;
+}
+
+body.index-card .sheet {
+  width: 3.5in;
+  height: 5in;
+}
+
+body.letter .sheet {
+  width: 8.5in;
+  height: 11in;
 }
 
 body {
   font-family: "Helvetica Now", "Helvetica", sans-serif;
   position: relative;
   font-size: 11px;
+  text-transform: uppercase;
 }
 
-table {
+table, .lineup-card table {
-  position: inherit;
   font-size: inherit;
   border-collapse: collapse;
   empty-cells: show;
@@ -88,45 +92,23 @@ table {
   overflow-x: hidden;
   overflow-y: hidden;
   width: 100%;
-  border: 0.5px solid black;
-  display: inline-table;
 }
-table tr {
+table th, .lineup-card table th {
-  border-bottom-width: 0.5px;
+  color: var(--color-grey-700);
-  border-color: grey;
-  border-bottom-style: solid;
 }
-table tr:nth-child(odd) {
+table th, .lineup-card table th, table td, table #roster-and-history .position, #roster-and-history table .position, .lineup-card table td {
-  background-color: rgba(242, 242, 242, 0.85);
-}
-table tr:nth-child(even) {
-  background-color: rgba(255, 255, 255, 0.85);
-}
-table tr th {
-  font-stretch: extra-condensed;
-  width: 1em;
-  text-align: center;
-  text-transform: uppercase;
-}
-table tr td.player-name {
-  text-transform: uppercase;
-  font-stretch: 75%;
-}
-table tr td.position, table tr td.jersey-number {
-  font-family: var(--monospace-font);
-  width: 2ch;
-  text-align: right;
-  overflow: hidden;
-}
-table tr th, table tr td {
-  border-left: 0.5px solid grey;
-  border-right: 0.5px solid grey;
   overflow: hidden;
   padding: 0 2px 0 2px;
 }
-table tr th:empty::after, table tr td: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) {
+  background-color: whitesmoke;
+}
+table.striped tr:nth-child(even), .lineup-card table tr:nth-child(even) {
+  background-color: white;
+}
 
 .float-right {
   float: right;
@@ -136,203 +118,165 @@ table tr th:empty::after, table tr td:empty::after {
   float: left;
 }
 
-.B5 > .eventsheet {
+.eventsheet {
-  display: grid;
+  --page-margin: 0.175in;
-  grid-template-columns: 1fr 1fr;
-  grid-template-rows: 1fr 1fr;
-  column-gap: 0.35in;
-  row-gap: 0.35in;
-  background-size: 100%;
 }
-
+.eventsheet:has(section) {
-.eventsheet > 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;
 }
-.eventsheet > section > div {
+.eventsheet:has(section) section > div {
   display: flex;
   flex: 1;
   align-items: stretch;
   height: auto;
-}
-.eventsheet > section.NW {
-  grid-area: 1/1/2/2;
-}
-.eventsheet > section.NE {
-  grid-area: 1/2/2/3;
-}
-.eventsheet > section.SW {
-  grid-area: 2/1/3/2;
-}
-.eventsheet > section.SE {
-  grid-area: 2/2/3/3;
-}
-
-.eventsheet > .section-divider {
-  position: absolute;
-  display: grid;
-  grid-template-columns: repeat(2, 1fr);
-  grid-template-rows: repeat(2, 1fr);
-  grid-column-gap: 0px;
-  grid-row-gap: 0px;
-  height: 100%;
   width: 100%;
-  box-sizing: border-box;
-  --divider-border: lightgrey dashed 1px;
 }
-.eventsheet > .section-divider .NW {
+.eventsheet:has(section) section.NW {
   grid-area: 1/1/2/2;
-  border-right: var(--divider-border);
-  border-bottom: var(--divider-border);
 }
-.eventsheet > .section-divider .NE {
+.eventsheet:has(section) section.NE {
   grid-area: 1/2/2/3;
-  border-bottom: var(--divider-border);
 }
-.eventsheet > .section-divider .SW {
+.eventsheet:has(section) section.SW {
   grid-area: 2/1/3/2;
-  border-right: var(--divider-border);
 }
-.eventsheet > .section-divider .SE {
+.eventsheet:has(section) section.SE {
   grid-area: 2/2/3/3;
 }
-
+.eventsheet:has(section) section.NW .divider, .eventsheet:has(section) section.SW .divider {
-.lineup-card th {
+  border-right: var(--divider-border);
-  width: inherit;
+}
+.eventsheet:has(section) section.NW .divider, .eventsheet:has(section) section.NE .divider {
+  border-bottom: var(--divider-border);
 }
 
-#lineup-card-dugout div.grid-container,
+.eventsheet.quarters {
-#lineup-card-dugout-blank div.grid-container {
+  --section-margin: calc(var(--page-margin)/2);
-  display: grid;
+  grid-template-columns: 1fr 1fr;
-  grid-template-columns: 60% auto;
+  grid-template-rows: 1fr 1fr;
-  grid-template-rows: fit-content(16px) auto;
+  column-gap: calc(var(--page-margin) * 2);
-  grid-template-areas: "header header" "sarting-lineup-table substitution-table";
+  row-gap: calc(var(--page-margin) * 2);
+  outline-offset: var(--section-margin);
+}
+.eventsheet.quarters section {
+  outline-offset: var(--page-margin);
 }
 
-#lineup-card-exchange div.grid-container,
+.letter .eventsheet.index-cards-4x6 {
-#lineup-card-exchange-blank div.grid-container {
+  --section-margin: calc(var(--page-margin)/2);
-  display: grid;
+  grid-template-columns: 1fr 1fr;
-  grid-template-columns: auto;
+  grid-template-rows: 1fr 125mm;
-  grid-template-rows: fit-content(16px) auto;
+  column-gap: calc(var(--page-margin) * 2);
-  grid-template-areas: "header" "sarting-lineup-table";
+  row-gap: calc(var(--page-margin) * 2);
+}
+.letter .eventsheet.index-cards-4x6 section {
+  outline-offset: var(--page-margin);
 }
 
-#lineup-card-exchange .substitution,
+.letter .eventsheet.index-cards-3x5 {
-#lineup-card-exchange .homeaway,
+  --section-margin: calc(var(--page-margin)/2);
-#lineup-card-exchange-blank .substitution,
+  grid-template-columns: 3in 3in;
-#lineup-card-exchange-blank .homeaway {
+  grid-template-rows: 5in 5in;
-  display: none;
+  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 div.grid-container > header {
+.lineup-card {
-  grid-area: "header";
-  font-size: 14px;
-  font-weight: bold;
-}
-
-.lineup-card div.grid-container > header:empty::after {
-  content: " ";
-}
-
-div.grid-container > .starting-lineup-table {
-  grid-area: "starting-lineup-table";
-}
-
-div.grid-container > .substitution-table {
-  grid-area: "substitution-table";
-}
-
-section.lineup-card {
   counter-reset: lineup-sequence-counter 0;
+  --border: 0.5px solid grey;
+  border: var(--section-border);
 }
-section.lineup-card thead th {
-  color: var(--color-grey-600);
-  font-size: 0.7em;
-}
-section.lineup-card th.sequence {
-  counter-increment: lineup-sequence-counter 1;
-  color: var(--color-grey-600);
-  font-size: inherit;
-  width: 2ch;
-}
-section.lineup-card th.sequence.counter::before {
-  content: counter(lineup-sequence-counter);
-}
-
-.lineup-card table {
-  font-size: 21px;
-}
-
-.lineup-card td {
-  /* height: 34px; */
-}
-
-.lineup-card td.substitution {
-  width: 8ch;
-}
-
-.lineup-card td.substitution::after {
-  content: "";
-}
-
-#lineup-card-exchange tr,
-#lineup-card-exchange-blank tr,
-#lineup-card-dugout .starting-lineup-table tr,
-#lineup-card-dugout-blank .starting-lineup-table tr,
-#lineup-card-dugout .substitution-table tr:nth-child(odd) {
-  border-top: 1px solid black;
-}
-
-#lineup-card-exchange tr,
-#lineup-card-exchange-blank tr,
-#lineup-card-dugout .starting-lineup-table tr,
-#lineup-card-dugout-blank .starting-lineup-table tr,
-#lineup-card-dugout .substitution-table tr:nth-child(even) {
-  border-bottom: 1px solid black;
-}
-
-td.substitution {
-  border-left: 1px solid black;
-}
-
-section.blank {
-  filter: opacity(0.4);
-}
-section.blank img, section.blank header {
-  filter: grayscale(1);
-}
-section.blank td.substitution {
-  border-width: 0.5;
-}
-
-#lineup-card-exchange td.player-name {
-  font-stretch: 100%;
-}
-
-#lineup-card-dugout td.player-name {
-  width: 10ch;
-}
-
-.lineup-card .position,
-.lineup-card .jersey-number {
-  width: 2ch;
-}
-
-#lineup-card-dugout .position,
-#lineup-card-dugout .jersey-number {
-  font-stretch: 75%;
-  padding-left: 2.5px;
-  padding-right: 2.5px;
-}
-
 .lineup-card header {
   font-size: inherit;
   text-transform: uppercase;
   font-stretch: 85%;
+  border-style: none;
+  border-bottom: var(--border);
+  height: var(--header-height);
+}
+.lineup-card header:empty::after {
+  content: " ";
+}
+.lineup-card th {
+  width: inherit;
+}
+.lineup-card th.sequence {
+  counter-increment: lineup-sequence-counter 1;
+  color: var(--color-grey-600);
+  font-size: inherit;
+  width: 2ch;
+  font-stretch: 50%;
+  border-right: var(--border);
+}
+.lineup-card th.sequence.counter::before {
+  content: counter(lineup-sequence-counter);
+}
+.lineup-card thead th {
+  color: var(--color-grey-600);
+  font-size: 0.7em;
+  border-bottom: var(--border);
+}
+.lineup-card table {
+  font-size: 21px;
+}
+.lineup-card td, .lineup-card #roster-and-history .position, #roster-and-history .lineup-card .position {
+  /* height: 34px; */
+}
+.lineup-card td.substitution, .lineup-card #roster-and-history .substitution.position, #roster-and-history .lineup-card .substitution.position {
+  width: 8ch;
+}
+.lineup-card td.substitution::after, .lineup-card #roster-and-history .substitution.position::after, #roster-and-history .lineup-card .substitution.position::after {
+  content: "";
+}
+.lineup-card td.position, .lineup-card #roster-and-history .position, #roster-and-history .lineup-card .position, .lineup-card td.jersey-number {
+  width: 2ch;
+}
+.lineup-card td.position, .lineup-card #roster-and-history .position, #roster-and-history .lineup-card .position, .lineup-card td.jersey-number, .lineup-card td.substitution {
+  font-family: var(--monospace-font);
+  border-left: var(--border);
+  text-align: right;
+  padding-left: 2.5px;
+  padding-right: 2.5px;
+}
+.lineup-card tr + tr {
+  border-top: var(--border);
+}
+.lineup-card.dugout td.player-name, .lineup-card.dugout #roster-and-history .player-name.position, #roster-and-history .lineup-card.dugout .player-name.position {
+  width: 10ch;
+  font-stretch: 75%;
+}
+.lineup-card.dugout .position, .lineup-card.dugout .jersey-number, .lineup-card.dugout .substitution {
+  font-stretch: 75%;
+}
+.lineup-card.exchange .player-name {
+  font-stretch: 100%;
+}
+.lineup-card.exchange .homeaway, .lineup-card.exchange .substitution {
+  display: none;
+}
+
+section.blank img, section.blank header {
+  filter: grayscale(1) opacity(0.4);
+}
+section.blank > div {
+  filter: opacity(0.4);
+}
+section.blank > div td.substitution, section.blank > div #roster-and-history .substitution.position, #roster-and-history section.blank > div .substitution.position {
+  border-width: 0.5;
 }
 
 #todays-game > div {
@@ -376,7 +320,7 @@ section.blank td.substitution {
   text-align: left;
   color: var(--color-grey-600);
 }
-#todays-game .footer table td {
+#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;
 }
@@ -388,7 +332,7 @@ section.blank td.substitution {
   border-right: none;
   line-height: 1em;
 }
-#todays-game table.notes td: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: "";
 }
 
@@ -418,12 +362,15 @@ section.blank td.substitution {
   display: table-row;
 }
 
+#defense-card {
+  border: var(--section-border);
+}
+
 #defense-pane {
   position: relative;
   grid-area: defense;
   padding: 4px 4px 0px 4px; /* top right bottom left */
   display: flex;
-  border: 0.5px solid grey;
 }
 #defense-pane .field-container {
   display: grid;
@@ -441,30 +388,76 @@ section.blank td.substitution {
   display: flex;
   align-items: center;
 }
+#defense-pane .slot-set .player-name {
+  font-stretch: 80%;
+}
+#defense-pane .slot-set table {
+  --border: grey solid 0.5px;
+  border: var(--border);
+  opacity: 85%;
+}
+#defense-pane .slot-set table tr:first-child th {
+  border-bottom: var(--border);
+}
+#defense-pane .slot-set table tr + tr {
+  border-top: var(--border);
+}
+#defense-pane .slot-set table tr th.position {
+  font-family: var(--monospace-font);
+  width: 2ch;
+  text-align: right;
+}
+#defense-pane .slot-set.pos-cf tr:first-child th.position:empty {
+  border-right: var(--border);
+}
 #defense-pane .slot-set.pos-cf tr:first-child th.position:empty::after {
   content: "cf";
 }
+#defense-pane .slot-set.pos-lf tr:first-child th.position:empty {
+  border-right: var(--border);
+}
 #defense-pane .slot-set.pos-lf tr:first-child th.position:empty::after {
   content: "lf";
 }
+#defense-pane .slot-set.pos-rf tr:first-child th.position:empty {
+  border-right: var(--border);
+}
 #defense-pane .slot-set.pos-rf tr:first-child th.position:empty::after {
   content: "rf";
 }
+#defense-pane .slot-set.pos-ss tr:first-child th.position:empty {
+  border-right: var(--border);
+}
 #defense-pane .slot-set.pos-ss tr:first-child th.position:empty::after {
   content: "ss";
 }
+#defense-pane .slot-set.pos-2b tr:first-child th.position:empty {
+  border-right: var(--border);
+}
 #defense-pane .slot-set.pos-2b tr:first-child th.position:empty::after {
   content: "2b";
 }
+#defense-pane .slot-set.pos-3b tr:first-child th.position:empty {
+  border-right: var(--border);
+}
 #defense-pane .slot-set.pos-3b tr:first-child th.position:empty::after {
   content: "3b";
 }
+#defense-pane .slot-set.pos-1b tr:first-child th.position:empty {
+  border-right: var(--border);
+}
 #defense-pane .slot-set.pos-1b tr:first-child th.position:empty::after {
   content: "1b";
 }
+#defense-pane .slot-set.pos-c tr:first-child th.position:empty {
+  border-right: var(--border);
+}
 #defense-pane .slot-set.pos-c tr:first-child th.position:empty::after {
   content: "c";
 }
+#defense-pane .slot-set.pos-p tr:first-child th.position:empty {
+  border-right: var(--border);
+}
 #defense-pane .slot-set.pos-p tr:first-child th.position:empty::after {
   content: "p";
 }
@@ -508,6 +501,9 @@ section.blank td.substitution {
 #defense-pane .slot-set.pos-p table {
   width: 100%;
 }
+#defense-pane .slot-set.pos-p tr.substitute .position:empty {
+  border-right: var(--border);
+}
 #defense-pane .slot-set.pos-p tr.substitute .position:empty::after {
   content: "RP";
 }
@@ -531,40 +527,14 @@ section.blank td.substitution {
   content: counter(lineup-sequence-counter);
 }
 
-.slot-set table {
-  width: 77px;
-}
-
-.slot-set.pos-slot-p table {
-  width: 100%;
-}
-
-.index-card .defense-slot-set {
-  width: 65px;
-}
-
-.index-card .defense-slot-set .player-name {
-  font-stretch: 70%;
-}
-
-.container .row {
-  width: 100%;
-  display: flex;
-  align-items: center;
-}
-
 header {
   background-color: #cadcf9;
   font-family: "Oswald";
-  /* font-size: 8.8px; */
-  /* outline: 1px solid black; */
-  /* height: var(--row-height); */
   width: auto;
   text-align: center;
   padding-left: 10px;
   padding-right: 10px;
-  border: 0.5px solid black;
+  border-bottom: var(--section-border);
-  z-index: 1;
 }
 
 .cell-checkbox {
@@ -652,16 +622,12 @@ header {
   background-color: #acc9fe;
 }
 
-#roster-and-history .player-name {
+#roster-and-history {
-  font-stretch: 95%;
+  --border: var(--section-border);
 }
-
-.starting {
-  font-weight: bold;
-}
-
 #roster-and-history thead {
   border: black solid 1px;
+  height: var(--header-height);
 }
 #roster-and-history > div > table {
   /* font-size: 10.5px; */
@@ -669,19 +635,34 @@ header {
   line-height: 1em;
   /* outline: 0.5px black; */
 }
-#roster-and-history td, #roster-and-history th {
+#roster-and-history tr.starting-today td.jersey-number, #roster-and-history tr.starting-today .jersey-number.position, #roster-and-history tr.starting-today td.player-name, #roster-and-history tr.starting-today .player-name.position {
+  font-weight: bold;
+}
+#roster-and-history .player-name {
+  font-stretch: 95%;
+}
+#roster-and-history .jersey-number {
+  font-family: var(--monospace-font);
+  width: 2ch;
+  text-align: right;
+  overflow: hidden;
+}
+#roster-and-history tr + tr {
+  border-top: var(--border);
+}
+#roster-and-history td, #roster-and-history .position, #roster-and-history th {
   border-left: none;
   border-right: none;
   padding: 0.2em 0.1em 0.2em 0.1em; /* top right bottom left */
 }
-#roster-and-history td.availability-on-day, #roster-and-history th.availability-on-day {
+#roster-and-history td.availability-on-day, #roster-and-history .position, #roster-and-history th.availability-on-day {
   font-family: var(--monospace-font);
   font-stretch: 60%;
   text-align: center;
   max-width: 0.8em;
   min-width: 0.8em;
 }
-#roster-and-history td.availability-on-day.future, #roster-and-history td.availability-on-day.past, #roster-and-history th.availability-on-day.future, #roster-and-history th.availability-on-day.past {
+#roster-and-history td.availability-on-day.future, #roster-and-history .future.position, #roster-and-history td.availability-on-day.past, #roster-and-history .past.position, #roster-and-history th.availability-on-day.future, #roster-and-history th.availability-on-day.past {
   font-family: var(--monospace-font);
   font-stretch: condensed;
   font-weight: normal;
@@ -689,41 +670,41 @@ header {
   padding: 0.1em;
   text-transform: uppercase;
 }
-#roster-and-history td.position-capability, #roster-and-history th.position-capability {
+#roster-and-history td.position-capability, #roster-and-history .position-capability.position, #roster-and-history th.position-capability {
   font-size: 8px;
   font-stretch: 50%;
   width: 5px;
   text-align: center;
   padding: 0;
 }
-#roster-and-history td.player-stats, #roster-and-history th.player-stats {
+#roster-and-history td.player-stats, #roster-and-history .player-stats.position, #roster-and-history th.player-stats {
   display: none;
   font-family: var(--monospace-font);
   font-size: 1em;
   font-stretch: 60%;
   font-weight: 300;
 }
-#roster-and-history td.player-stats .delimiter,
+#roster-and-history td.player-stats .delimiter, #roster-and-history .player-stats.position .delimiter,
-#roster-and-history td.player-stats .decimal-point, #roster-and-history th.player-stats .delimiter,
+#roster-and-history td.player-stats .decimal-point,
+#roster-and-history .player-stats.position .decimal-point, #roster-and-history th.player-stats .delimiter,
 #roster-and-history th.player-stats .decimal-point {
   font-family: Helvetica Now;
   font-stretch: expanded;
   color: var(--color-grey-500);
 }
-#roster-and-history td.player-stats .decimal-point, #roster-and-history th.player-stats .decimal-point {
+#roster-and-history td.player-stats .decimal-point, #roster-and-history .player-stats.position .decimal-point, #roster-and-history th.player-stats .decimal-point {
   color: rgba(0, 0, 0, 0);
 }
-#roster-and-history td.player-stats .delimiter, #roster-and-history th.player-stats .delimiter {
+#roster-and-history td.player-stats .delimiter, #roster-and-history .player-stats.position .delimiter, #roster-and-history th.player-stats .delimiter {
   color: var(--color-grey-500);
 }
-#roster-and-history td.player-name {
+#roster-and-history td.player-name, #roster-and-history .player-name.position {
   color: black;
   text-align: left;
   font-stretch: 95%;
 }
-#roster-and-history td.jersey-number {
+#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;
@@ -741,9 +722,8 @@ header {
   color: black;
   border: none;
 }
-#roster-and-history th.availability-on-day div {
+#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;
@@ -759,12 +739,12 @@ header {
   border-top: 1px solid black;
 }
 
-td.position-capability:not(:empty) {
+td.position-capability:not(:empty), #roster-and-history .position-capability.position:not(:empty) {
   color: var(--color-grey-700);
   background-color: var(--color-grey-200);
 }
 
-td.is-present-checkbox {
+td.is-present-checkbox, #roster-and-history .is-present-checkbox.position {
   font-size: 0.5em;
   text-align: center;
   color: white;
@@ -772,11 +752,11 @@ td.is-present-checkbox {
     1px 1px 0 #000; */
 }
 
-td.is-present-checkbox.available-status-code-0 > span {
+td.is-present-checkbox.available-status-code-0 > span, #roster-and-history .is-present-checkbox.available-status-code-0.position > span {
   display: none;
 }
 
-td.is-present-checkbox.available-status-code-None > span {
+td.is-present-checkbox.available-status-code-None > span, #roster-and-history .is-present-checkbox.available-status-code-None.position > span {
   display: none;
 }
 
@@ -794,26 +774,40 @@ td.is-present-checkbox.available-status-code-None > span {
   padding-left: 5px;
   padding-right: 5px;
 }
-#front-cover .game-number, #front-cover .homeaway {
+#front-cover Header .title {
   display: grid;
+  font-family: "Futura Now";
+  flex-grow: 1;
   align-content: center;
-  width: 1.4em;
 }
-#front-cover .homeaway {
+#front-cover Header .homeaway {
   font-weight: 800;
   font-size: xx-large;
 }
-#front-cover .game-number {
+#front-cover Header .game-number, #front-cover Header .homeaway {
+  display: grid;
+  align-content: center;
+}
+#front-cover Header .game-number {
   font-size: large;
   font-stretch: extra-condensed;
   font-weight: 700;
   text-wrap: nowrap;
 }
-#front-cover .title {
+#front-cover > div {
-  display: grid;
+  width: inherit;
-  font-size: small;
+}
-  flex-grow: 1;
+#front-cover th {
-  align-content: center;
+  background-color: whitesmoke;
+}
+#front-cover th, #front-cover td, #front-cover #roster-and-history .position, #roster-and-history #front-cover .position {
+  font-family: "Futura Now";
+  border: solid 0.5px grey;
+}
+#front-cover .conjuction {
+  text-align: center;
+  font-family: "Futura Now";
+  text-transform: none;
 }
 #front-cover .head-to-head {
   padding: 5px;
@@ -826,6 +820,7 @@ td.is-present-checkbox.available-status-code-None > span {
   font-size: x-large;
   align-items: center;
   font-family: "Pacifico";
+  text-transform: none;
   display: inline-flex;
   width: 100%;
   flex-grow: 1;

src/public/css/eventsheet.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../scss/eventsheet.scss"],"names":[],"mappings":";AAAQ;AACA;AACA;AACA;AACA;AAER;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAGF;AACA;EACE;IACE;;EAEF;IACE;IACA;;;AAIJ;AACA;EACE;IACE;;EAEF;IACE;;EAEF;IACE;IACA;;;AAIJ;EACE;EACA;EACA;EACA;;;AAGF;AACA;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;;AAKA;EACE;EACA;;AAEF;EACE;EACA;EACA;EACA;;AAKJ;EACE;EACA;EACA;EACA;;AAEA;EACE;;;AAQR;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;AACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;;AAKJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;;;AAKN;EACE;;;AAGF;AAAA;EAEE;EACA;EACA;EACA,qBACE;;;AAIJ;AAAA;EAEE;EACA;EACA;EACA,qBACE;;;AAIJ;AAAA;AAAA;AAAA;EAIE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;AAEA;EACE;EACA;;AAEF;EACE;EACA;EACA;EACA;;AAEA;EACE;;;AAQN;EACE;;;AAGF;AACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;;AAGF;EACE;;;AAGF;EACE;;AACA;EACE;;AAEF;EACE;;;AAIJ;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;;;AAGF;AAAA;EAEE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAKA;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;;;AAeV;EACE;EACA;EACA;EACA;EACA;;AAGA;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAMI;EACE,SALM;;AAIR;EACE,SALM;;AAIR;EACE,SALM;;AAIR;EACE,SALM;;AAIR;EACE,SALM;;AAIR;EACE,SALM;;AAIR;EACE,SALM;;AAIR;EACE,SALM;;AAIR;EACE,SALM;;AAUZ;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;EACI;;;AASV;EACE;AACA;EACA;EAEA;EACA;AACA;;AAEA;EACE;EACA;;AAGF;EACE;;AACA;EACE;;;AAON;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;AACA;AACA;AACA;EACA;EAEA;EACA;EACA;EACA;EACA;;;AAKF;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;;;AAGF;EACE;;;AASA;EACE;;AAEF;AACE;EACA;EACA;AACA;;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;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;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACI;EACA;EACA;EACA;;AAGJ;EACE;EACA;EACA;;AAGF;EACE;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/routes/eventsheet.js

@@ -30,6 +30,8 @@ router.get("/:team_id([0-9]+)/event/:event_id([0-9]+)/sheet", async (req,res) =>
 }
 )
 
+router.get("/lineup/sheet/blank", eventsSheetController.getEventSheetBlank )
+
 router.post("/:team_id([0-9]+)/event/:event_id([0-9]+)/lineup/:event_lineup_id([0-9]+)/sheet", upload.none(), eventsSheetController.getEventSheet )
 
 module.exports = {router}

src/scss/eventsheet.scss

@@ -3,60 +3,7 @@
 @import url('https://fonts.googleapis.com/css2?family=Graduate');
 @import url('https://fonts.googleapis.com/css2?family=Inconsolata:wdth,wght@50..200,200..900&display=swap');
 @import url('/font/helvetica-now/stylesheet.css');
-
+@import url('/font/futura-now/stylesheet.css');
-@font-face {
-  font-family: "Futura Now";
-  src: url("/font/futura-now/futura-now.ttf") format("truetype");
-  font-weight: 125 900;
-  font-stretch: 50% 150%;
-}
-
-@page {
-  margin: 0;
-}
-
-/** For Print **/
-@media print {
-  body {
-    margin:0;
-  }
-  body .sheet {
-    size: B5;
-    padding: 0.175in;
-  }
-}
-
-/** For screen preview **/
-@media screen {
-  body .sheet {
-    padding: 0.175in;
-  }
-  body {
-    background: #e0e0e0;
-  }
-  .sheet {
-    background: white;
-    box-shadow: 0 0.5mm 2mm rgba(0, 0, 0, 0.3);
-  }
-}
-
-.sheet {
-  overflow: hidden;
-  position: relative;
-  box-sizing: border-box;
-  page-break-after: always;
-}
-
-/** Paper sizes **/
-body.B5 .sheet {
-  width: 176mm;
-  height: 250mm;
-}
-
-body.index-card .sheet {
-  width: 3.5in;
-  height: 5in;
-}
 
 :root {
   --color-success: #b7e1cd;
@@ -72,18 +19,63 @@ body.index-card .sheet {
   --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; 
 }
 
+
+/** For Print **/
+@media print {
+  :root {
+    margin: 0;
+  }
+  body {
+    margin:0;
+  }
+  body .sheet {
+    padding: 0.175in;
+    background:white;
+  }
+}
+
+/** For screen preview **/
+@media screen {
+  body .sheet {
+    padding: 0.175in;
+  }
+  body {
+    background: #e0e0e0;
+  }
+  .sheet {
+    margin: auto;
+    margin-bottom: 12px;
+    box-shadow: 0 0.5mm 2mm rgba(0, 0, 0, 0.3);
+  }
+}
+
+.sheet {
+  overflow: hidden;
+  position: relative;
+  box-sizing: border-box;
+  page-break-after: always;
+  background: white;
+}
+
+/** Paper sizes **/
+body.B5               .sheet { width: 176mm; height: 250mm;}
+body.index-card       .sheet { width: 3.5in; height: 5in;}
+body.letter           .sheet { width: 8.5in; height: 11in; }
+
 body {
   font-family: "Helvetica Now", "Helvetica", sans-serif;
   position: relative;
   font-size: 11px;
+  text-transform: uppercase;
 }
 
 table {
-  position: inherit;
   font-size: inherit;
   border-collapse: collapse;
   empty-cells: show;
@@ -92,47 +84,10 @@ table {
   overflow-x: hidden;
   overflow-y: hidden;
   width: 100%;
-  border: 0.5px solid black;
-  display: inline-table;
-
-  tr {
-    border-bottom-width: 0.5px;
-    border-color: grey;
-    border-bottom-style: solid;
-  
-    &:nth-child(odd) {
-      background-color: rgb(242, 242, 242, 0.85);
-    }
-    
-    &:nth-child(even) {
-      background-color: rgb(256, 256, 256, 0.85);
-    }
-
   th {
-      font-stretch: extra-condensed;
+    color: var(--color-grey-700);
-      width: 1em;
-      text-align: center;
-      text-transform: uppercase;
   }
-    
-    
-    td {
-      &.player-name {
-        text-transform: uppercase;
-        font-stretch: 75%;
-      }
-      &.position, &.jersey-number {
-        font-family: var(--monospace-font);
-        width: 2ch;
-        text-align: right;
-        overflow: hidden;
-      }
-
-    }
-    
   th, td {
-      border-left: 0.5px solid grey;
-      border-right: 0.5px solid grey;
     overflow: hidden;
     padding: 0 2px 0 2px; 
 
@@ -141,10 +96,20 @@ table {
     }
   }
 
+  &.striped {
+    tr {
+      &:nth-child(odd) {
+        background-color: whitesmoke;
       }
       
+      &:nth-child(even) {
+        background-color: white;
+      }
+    }
+  }
 }
 
+
 .float-right {
   float: right;
 }
@@ -153,28 +118,27 @@ table {
   float: left;
 }
 
-.B5 > .eventsheet {
+.eventsheet{
+  --page-margin: 0.175in;
+  &:has(section) {
     display: grid;
-  grid-template-columns: 1fr 1fr;
+    section {
-  grid-template-rows: 1fr 1fr;
+    --divider-border: lightgrey dashed 1px;
-  column-gap: 0.35in;
-  row-gap: 0.35in;
-  background-size: 100%;
-}
-
-.eventsheet > section {
     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;
   
     > div {
       display: flex;
       flex: 1;
       align-items: stretch;
       height: auto;
+      width:100%
     }
 
     &.NW {
@@ -190,180 +154,153 @@ table {
       grid-area: 2 / 2 / 3 / 3;
       }
 
-}
+    &.NW .divider, &.SW .divider {
-
-.eventsheet > .section-divider {
-  position:  absolute;
-  display: grid;
-  grid-template-columns: repeat(2, 1fr);
-  grid-template-rows: repeat(2, 1fr);
-  grid-column-gap: 0px;
-  grid-row-gap: 0px;
-  height: 100%;
-  width: 100%;
-  box-sizing: border-box;
-  --divider-border: lightgrey dashed 1px;
-
-  .NW {
-      grid-area: 1 / 1 / 2 / 2;
-      border-right:var(--divider-border);
-      border-bottom:var(--divider-border);
-    }
-  .NE {
-      grid-area: 1 / 2 / 2 / 3;
-      border-bottom:var(--divider-border);
-    }
-  .SW {
-      grid-area: 2 / 1 / 3 / 2;
       border-right:var(--divider-border);
     }
-  .SE {
+  
-      grid-area: 2 / 2 / 3 / 3;
+    &.NW .divider, &.NE .divider {
+      border-bottom:var(--divider-border);
+    }
+    }
   }
-  
 }
 
-.lineup-card th {
+.eventsheet.quarters {
-  width: inherit;
+    --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);
+    }
 }
 
-#lineup-card-dugout div.grid-container,
+.letter .eventsheet.index-cards-4x6 {
-#lineup-card-dugout-blank div.grid-container {
+  --section-margin: calc(var(--page-margin)/2);
-  display: grid;
+    grid-template-columns: 1fr 1fr;
-  grid-template-columns: 60% auto;
+    grid-template-rows: 1fr 125mm;
-  grid-template-rows: fit-content(16px) auto;
+    column-gap: calc(var(--page-margin)*2);
-  grid-template-areas:
+    row-gap: calc(var(--page-margin)*2);
-    "header header"
+    section {
-    "sarting-lineup-table substitution-table";
+      outline-offset: var(--page-margin);
+    }
 }
 
-#lineup-card-exchange div.grid-container,
+.letter .eventsheet.index-cards-3x5 {
-#lineup-card-exchange-blank div.grid-container {
+  --section-margin: calc(var(--page-margin)/2);
-  display: grid;
+    grid-template-columns: 3in 3in;
-  grid-template-columns: auto;
+    grid-template-rows: 5in 5in;
-  grid-template-rows: fit-content(16px) auto;
+    column-gap: calc(var(--page-margin)*2);
-  grid-template-areas:
+    row-gap: calc(var(--page-margin)*2);
-    "header"
+    section {
-    "sarting-lineup-table";
+      outline-offset: var(--page-margin);
+    }
 }
 
-#lineup-card-exchange .substitution,
+.lineup-card {
-#lineup-card-exchange .homeaway,
-#lineup-card-exchange-blank .substitution,
-#lineup-card-exchange-blank .homeaway {
-  display: none;
-}
-
-.lineup-card div.grid-container > header {
-  grid-area: "header";
-  font-size: 14px;
-  font-weight: bold;
-}
-
-.lineup-card div.grid-container > header:empty::after {
-  content: "\00a0";
-}
-
-div.grid-container > .starting-lineup-table {
-  grid-area: "starting-lineup-table";
-}
-
-div.grid-container > .substitution-table {
-  grid-area: "substitution-table";
-}
-
-section.lineup-card {
   counter-reset: lineup-sequence-counter 0;
   
-  thead th {
+  --border: 0.5px solid grey;
-    color: var(--color-grey-600);
+
-    font-size: 0.7em;
+  border: var(--section-border);
+
+  header {
+    font-size: inherit;
+    text-transform: uppercase;
+    font-stretch: 85%;
+    border-style: none;
+    border-bottom: var(--border);
+    height: var(--header-height);
+    &:empty::after {
+      content: "\00a0";
     }
-  th.sequence {
+  }
+  
+  th {
+    width: inherit;
+    &.sequence {
       counter-increment: lineup-sequence-counter 1;
       color: var(--color-grey-600);
       font-size: inherit;
       width: 2ch;
-  
+      font-stretch: 50%;
+      border-right: var(--border);
       &.counter::before {
         content: counter(lineup-sequence-counter);
       }
       
     }
+  }
 
-} 
+  thead th {
+    color: var(--color-grey-600);
+    font-size: 0.7em;
+    border-bottom:  var(--border);
+  }
 
-
+  table {
-.lineup-card table {
+    @extend table, .striped;
     font-size: 21px;
-}
+  }
   
-.lineup-card td {
+  td {
     /* height: 34px; */
-}
+    &.substitution {
-
-.lineup-card td.substitution {
       width: 8ch;
-}
+      &::after {
-
-.lineup-card td.substitution::after {
         content: "";
-}
+      }
+    }
+    &.position, &.jersey-number {
+      width: 2ch;
+    }
+    &.position, &.jersey-number, &.substitution {
+      font-family: var(--monospace-font);
+      border-left: var(--border);
+      text-align: right;
+      padding-left: 2.5px;
+      padding-right: 2.5px;
+    }
+  }
 
-#lineup-card-exchange tr,
+  tr + tr {
-#lineup-card-exchange-blank tr,
+    // border-top: 1px solid black;
-#lineup-card-dugout .starting-lineup-table tr,
+    border-top: var(--border);
-#lineup-card-dugout-blank .starting-lineup-table tr,
+  }  
-#lineup-card-dugout .substitution-table tr:nth-child(odd) {
-  border-top: 1px solid black;
-}
   
-#lineup-card-exchange tr,
+  &.dugout {
-#lineup-card-exchange-blank tr,
+    td.player-name {
-#lineup-card-dugout .starting-lineup-table tr,
+      width: 10ch;
-#lineup-card-dugout-blank .starting-lineup-table tr,
+      font-stretch: 75%;
-#lineup-card-dugout .substitution-table tr:nth-child(even) {
+    }
-  border-bottom: 1px solid black;
+    .position, .jersey-number, .substitution {
-}
+      font-stretch: 75%;
+    }
+  }
 
-td.substitution {
+  &.exchange {
-  border-left: 1px solid black;
+    .player-name {
+      font-stretch: 100%;
+    }
+      
+    .homeaway, .substitution {
+      display: none;
+    }
+  }
 } 
 
 section.blank {
-  filter: opacity(0.4);
   img, header {
-    filter: grayscale(1);
+    filter: grayscale(1) opacity(0.4);
   }
+  > div {
+    filter: opacity(0.4);
     td.substitution {
       border-width: 0.5;
     }  
-}
+  } 
-
-#lineup-card-exchange td.player-name {
-  font-stretch: 100%;
-}
-
-#lineup-card-dugout td.player-name {
-  width: 10ch;
-}
-
-.lineup-card .position,
-.lineup-card .jersey-number {
-  width: 2ch;
-}
-
-#lineup-card-dugout .position,
-#lineup-card-dugout .jersey-number {
-  font-stretch: 75%;
-  padding-left: 2.5px;
-  padding-right: 2.5px;
-}
-
-.lineup-card header {
-  font-size: inherit;
-  text-transform: uppercase;
-  font-stretch: 85%;
 }
 
 
@@ -481,14 +418,15 @@ section.blank {
 
 }
 
+#defense-card {
+  border: var(--section-border);
+}
 
 #defense-pane {
   position: relative;
   grid-area: defense;
   padding: 4px 4px 0px 4px; /* top right bottom left */
   display: flex;
-  border: 0.5px solid grey;
-  // border-bottom: 0.5px solid grey;
 
   .field-container {
     display: grid;
@@ -510,11 +448,37 @@ section.blank {
 
     $positions: "cf", "lf", "rf", "ss", "2b", "3b", "1b", "c", "p";
 
+    .player-name {
+      font-stretch: 80%;
+    }
+
+    table {
+      --border: grey solid 0.5px;
+      border: var(--border);
+      opacity: 85%;
+      tr {
+        &:first-child th{
+          border-bottom: var(--border);
+        }
+        & + tr {
+          border-top: var(--border);
+        }
+        th.position {
+        font-family: var(--monospace-font);
+        width: 2ch;
+        text-align: right;
+        
+      }
+    }
+    }
+
     @each $position in $positions {
       &.pos-#{$position} tr:first-child {
-        th.position:empty::after {
+        th.position:empty{
+          border-right: var(--border);
+          &::after {
           content: $position;
-        }
+        }}
       }
     }
 
@@ -566,9 +530,11 @@ section.blank {
       align-items: end;
       margin-bottom: 4px;
       grid-area: 6 / 1 / 7 / 5;
-      tr.substitute .position:empty::after{
+      tr.substitute .position:empty{
+        border-right: var(--border);
+        &::after{
           content: "RP";
-      }
+      }}
 
     }
 
@@ -599,46 +565,17 @@ section.blank {
 
 }
 
-
-.slot-set table {
-  width: 77px;
-}
-
-.slot-set.pos-slot-p table {
-  width: 100%;
-}
-
-.index-card .defense-slot-set {
-  width: 65px;
-}
-
-.index-card .defense-slot-set .player-name {
-  font-stretch: 70%;
-}
-
-.container .row {
-  width: 100%;
-  display: flex;
-  align-items: center;
-}
-
 header {
   background-color: #cadcf9;
   font-family: "Oswald";
-  /* font-size: 8.8px; */
-  /* outline: 1px solid black; */
-  /* height: var(--row-height); */
   width: auto;
-  // grid-area: header;
   text-align: center;
   padding-left: 10px;
   padding-right: 10px;
-  border: 0.5px solid black;
+  border-bottom: var(--section-border);
-  z-index: 1;
+
 }
 
-
-
 .cell-checkbox {
   font-size: 0.75em;
 }
@@ -723,22 +660,11 @@ header {
   background-color: #acc9fe;
 }
 
-#roster-and-history .player-name {
-  font-stretch: 95%;
-}
-
-.starting {
-  font-weight: bold;
-}
-
 #roster-and-history {
-  // #today-availability {
+  --border: var(--section-border);
-  //   font-stretch: normal;
-  //   text-transform: uppercase;
-  //   font-size: 0.8em;
-  // }
   thead {
     border: black solid 1px;
+    height: var(--header-height);
   }
   > div > table {
     /* font-size: 10.5px; */
@@ -747,6 +673,31 @@ header {
     /* outline: 0.5px black; */
   }
 
+  tr.starting-today td {
+    &.jersey-number, &.player-name{
+    font-weight: bold;
+    }
+  }
+
+  .player-name {
+    font-stretch: 95%;
+  }
+
+  .jersey-number {
+    font-family: var(--monospace-font);
+    width: 2ch;
+    text-align: right;
+    overflow: hidden;
+  }
+
+  .position {
+    @extend td, .availability-on-day
+  }
+
+  tr + tr {
+    border-top: var(--border);
+  }
+
   td, th {
     border-left: none;
     border-right: none;
@@ -809,7 +760,6 @@ header {
     }
     &.jersey-number {
       color: black;
-      border-left: 0.5px solid lightgrey;
     }
   }
 
@@ -834,7 +784,6 @@ header {
 
     &.availability-on-day div {
       transform: rotate(270deg);
-      margin-bottom: -5;
       /* font-stretch: 40%; */
       font-stretch: 75%;
       font-weight: 500;
@@ -896,12 +845,11 @@ td.is-present-checkbox.available-status-code-None > span {
     border: none;
     padding-left: 5px;
     padding-right: 5px;
-  }
+    .title {
-
-  .game-number, .homeaway{
       display: grid;
+      font-family: "Futura Now";
+      flex-grow: 1;
       align-content: center; 
-    width: 1.4em;
     }
 
     .homeaway {
@@ -909,18 +857,36 @@ td.is-present-checkbox.available-status-code-None > span {
       font-size: xx-large;
     }
 
+    .game-number, .homeaway{
+      display: grid;
+      align-content: center;
+    }
+  
     .game-number {
       font-size: large;
       font-stretch: extra-condensed;
       font-weight: 700;
       text-wrap: nowrap;
     }
+  }
 
-  .title {
+  > div {
-      display: grid;
+    width: inherit;
-      font-size: small;
+  }
-      flex-grow: 1;
+
-      align-content: center; 
+  th {
+    background-color: whitesmoke;
+  }
+
+  th, td {
+    font-family: "Futura Now";
+    border: solid 0.5px grey;
+  }
+
+  .conjuction {
+    text-align: center;
+    font-family: "Futura Now";
+    text-transform: none;
   }
   
   .head-to-head {
@@ -935,6 +901,7 @@ td.is-present-checkbox.available-status-code-None > span {
     font-size: x-large;
     align-items: center;
     font-family: 'Pacifico';
+    text-transform: none;
     display: inline-flex;
     width: 100%;
     flex-grow:1;

src/views/eventlineup/partials/page_section_divider.hbs

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

src/views/eventsheet/partials/defense_pane.hbs

@@ -2,7 +2,7 @@
   <img src="/media/baseball-diamond.svg" />
   {{#defenseLineup event_lineup_entries members}}
   <div class="slot-set pos-{{this.position}}">
-    <table>
+    <table class="striped">
       <tbody>
         <tr class="slot">
           <th class="position"></th>

src/views/eventsheet/partials/roster_and_history.hbs

@@ -1,12 +1,12 @@
 <table>
-  <colgroup><col span="3" class="player"></colgroup>
+  <colgroup><col span="4" class="player"></colgroup>
   {{!-- <colgroup><col span="0" class="player-stats"></colgroup> --}}
   <colgroup><col span="4" class="position-capability"></colgroup>
   <colgroup><col span="4" class="availability-on-day future"></colgroup>
   <colgroup><col span="4" class="availability-on-day past"></colgroup>
   <thead>
     <tr>
-      <th colspan="3" id="today-availability">
+      <th colspan="4" id="today-availability">
       Available ({{availabilitySummary.playerGoingCount}}|{{availabilitySummary.playerMaybeCount}})
       </th>
       <th class="player-stats">
@@ -34,16 +34,19 @@
   <tbody>
   {{!-- <% by_member.select{|m,d| !m.is_non_player}.each_with_index do |(member, d), i|%> --}}
   {{#rosterHistory event event_lineup_entries members availabilities}}
-  <tr id="roster-history-slot-<%= ::Temple::Utils.escape_html((i)) %>">
+  <tr class="roster-history-slot{{#if (isStarting this)}} starting-today{{/if}}">
     <td class="is-present-checkbox available-status-code-{{this.benchcoach.availability.statusCode}}">
       <span>■</span>
     </td>
-    <td class="jersey-number available-status-code-{{this.benchcoach.availability.statusCode}}{{#if (isStarting this)}} starting{{/if}}">
+    <td class="jersey-number available-status-code-{{this.benchcoach.availability.statusCode}}">
       {{this.jerseyNumber}}
     </td>
-    <td class="player-name available-status-code-{{this.benchcoach.availability.statusCode}}{{#if (isStarting this)}} starting{{/if}}">
+    <td class="player-name available-status-code-{{this.benchcoach.availability.statusCode}}">
       {{this.lastName}}
     </td>
+    <td class="position available-status-code-{{this.benchcoach.availability.statusCode}}">
+      <span>{{positionLabelWithoutFlags this.benchcoach.eventLineupEntry.label}}</span>
+    </td>
     <td class="player-stats border-left border-right">
       <span class="decimal-point">.</span>
       <span class="avg">000</span>

src/views/eventsheet/sheet.hbs

@@ -1,9 +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" id="page-1">
+  <div class="sheet eventsheet {{#if sheet_layout}}{{sheet_layout}}{{else}}quarters{{/if}}" id="page-1">
-    {{>page_section_divider}}
+    <section class="NE" id="defense-card">
-    <section class="NW" id="defense-card">
       <header>
         <div class="event-title float-left">
           {{event.formattedTitle}} – {{dateFormat event.startDate "ddd, MMM D h:mm A" }}
@@ -32,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 
@@ -43,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>
@@ -120,9 +119,8 @@
       </div>
     </section>
   </div>
-  <div class="sheet eventsheet" id="page-2">
+  <div class="sheet eventsheet {{#if sheet_layout}}{{sheet_layout}}{{else}}quarters{{/if}}" id="page-2">
-    {{>page_section_divider}}
+    <section class="SE" id="front-cover">
-    <section class="NW" id="front-cover">
       <header>
         <div class="game-number">
           {{event.label}}
@@ -145,11 +143,9 @@
           </div>
         </div>
         {{# if event.opponentName}}
-        <div>
+        <div class="conjuction">
-          <div style="text-align: center;font-family: &#39;Pacifico&#39;;">
             <span>vs</span>
         </div>
-        </div>
         <div class="opponent">
           <div>
             <span class="name">{{event.opponentName}}</span>
@@ -180,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;
@@ -210,6 +206,7 @@
       </div>
     </section>
     <section class="SW lineup-card exchange blank" id="lineup-card-exchange-blank">
+      <header></header>
       <div class="starting-lineup-table">
         <table>
           <thead>
@@ -241,7 +238,8 @@
         </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>
           <thead>
@@ -275,6 +273,5 @@
         </table>
       </div>
     </section>
-
   </div>
 </body>

src/views/eventsheet/sheet_blank.hbs

@@ -0,0 +1,248 @@
+<link rel="stylesheet" href="/css/eventsheet.css">
+
+<body class="{{page_size}} ">
+  <div class="sheet eventsheet {{layout}}" id="page-1">
+    <section class="NW" id="roster-and-history">
+      <div class="roster-and-history">
+        {{> roster_and_history 
+          event=event 
+          event_lineup_entries=event_lineup_entries 
+          members=members availabilities=availabilities 
+          recent_events=recent_events 
+          upcoming_events=upcoming_events
+          }}
+      </div>
+    </section>
+    <section class="NE blank" id="defense-card">
+      <header>
+        <div class="event-title float-left">
+        </div>
+        <div class="homeaway float-right">
+        </div>
+      </header>
+      <div>
+        <div id="defense-pane">
+          {{> defense_pane event_lineup_entries=event_lineup_entries members=members}}
+        </div>
+        <div class="footer">
+          <table class="notes">
+            <tbody>
+              <tr>
+                <th>Notes</th>
+              </tr>
+              {{#repeat 3}}
+              <tr>
+                <td></td>
+              </tr>
+              {{/repeat}}
+            </tbody>
+          </table>
+        </div>
+      </div>
+    </section>
+    <section class="SW lineup-card dugout blank" id="lineup-card-dugout">
+      <header>
+        <div class="float-left event-title">{{event.formattedTitle}}</div>
+        <div class="float-right homeaway">{{event.gameType}}</div>
+      </header>
+    <div class="starting-lineup-table">
+      <table>
+        <thead>
+          <tr>
+            <th colspan="4">Starting</th>
+            <th class="substitution">Substitution</th>
+          </tr>
+        </thead>
+        <tbody>
+          {{#offenseLineup 11 event_lineup_entries members}}
+          <tr class="slot">
+            <th class="sequence{{#if this.member.lastName}} counter{{/if}}"></th>
+            <td class="player-name">{{this.member.lastName}}</td>
+            <td class="jersey-number">{{this.member.jerseyNumber}}</td>
+            <td class="position">{{this.label}}</td>
+            <td class="substitution"></td>
+          </tr>
+          {{/offenseLineup }}
+          {{#defenseLineup event_lineup_entries members}}
+          <tr class="slot">
+            {{#if (isInPositionOnly this.member)}}{{#if (comparePositionWithFlags "P" this.eventLineupEntry)}}
+            <th class="sequence">PO</th>
+            <td class="player-name">{{this.member.lastName}}</td>
+            <td class="jersey-number">{{this.member.jerseyNumber}}</td>
+            <td class="position">{{positionLabelWithoutFlags this.eventLineupEntry.label}}</td>
+            <td class="substitution"></td>
+            {{/if}}{{/if}}
+          </tr>
+          {{/defenseLineup}}
+          </tbody>
+        </table>
+      </div>
+    </section>
+    <section class="SE lineup-card exchange blank" id="lineup-card-exchange">
+      <header>
+        <div class="float-left event-title">{{event.formattedTitle}}</div>
+        <div class="float-right homeaway">{{event.gameType}}</div>
+      </header>
+    <div class="starting-lineup-table">
+      <table>
+        <thead>
+          <tr>
+            <th colspan="4">Starting</th>
+            <th class="substitution">Substitution</th>
+          </tr>
+        </thead>
+        <tbody>
+          {{#offenseLineup 11 event_lineup_entries members}}
+          <tr class="slot">
+            <th class="sequence {{#if this.member.lastName}}counter{{/if}}"></th>
+            <td class="player-name">{{this.member.lastName}}</td>
+            <td class="jersey-number">{{this.member.jerseyNumber}}</td>
+            <td class="position">{{this.label}}</td>
+            <td class="substitution"></td>
+          </tr>
+          {{/offenseLineup}}
+          {{#defenseLineup event_lineup_entries members}}
+          <tr class="slot">
+            {{#if (isInPositionOnly this.member)}}{{#if (comparePositionWithFlags "P" this.eventLineupEntry)}}
+            <th class="sequence">PO</th>
+            <td class="player-name">{{this.member.lastName}}</td>
+            <td class="jersey-number">{{this.member.jerseyNumber}}</td>
+            <td class="position">{{positionLabelWithoutFlags this.eventLineupEntry.label}}</td>
+            <td class="substitution"></td>
+            {{/if}}{{/if}}
+          </tr>
+          {{/defenseLineup}}
+          </tbody>
+        </table>
+      </div>
+    </section>
+  </div>
+  <div class="sheet eventsheet {{layout}}" id="page-2">
+    <section class="NW blank" id="defense-card">
+      <header>
+        <div class="event-title float-left">
+          &nbsp;
+        </div>
+        <div class="homeaway float-right">
+          &nbsp;
+        </div>
+      </header>
+      <div>
+        <div id="defense-pane">
+          {{> defense_pane event_lineup_entries=null members=null}}
+        </div>
+        <div class="footer">
+          <table class="notes">
+            <tbody>
+              <tr>
+                <th>Notes</th>
+              </tr>
+              {{#repeat 3}}
+              <tr>
+                <td></td>
+              </tr>
+              {{/repeat}}
+            </tbody>
+          </table>
+        </div>
+      </div>
+    </section>
+    <section class="NE blank" id="defense-card">
+      <header>
+        <div class="event-title float-left">
+          &nbsp;
+        </div>
+        <div class="homeaway float-right">
+          &nbsp;
+        </div>
+      </header>
+      <div>
+        <div id="defense-pane">
+          {{> defense_pane event_lineup_entries=null members=null}}
+        </div>
+        <div class="footer">
+          <table class="notes">
+            <tbody>
+              <tr>
+                <th>Notes</th>
+              </tr>
+              {{#repeat 3}}
+              <tr>
+                <td></td>
+              </tr>
+              {{/repeat}}
+            </tbody>
+          </table>
+        </div>
+      </div>
+    </section>
+    <section class="SW lineup-card exchange blank" id="lineup-card-exchange-blank">
+      <header></header>
+      <div class="starting-lineup-table">
+        <table>
+          <thead>
+            <tr>
+              <th colspan="4">
+              Starting
+              </th>
+              <th class="substitution">
+              Substitution
+              </th>
+            </tr>
+          </thead>
+          <tbody>
+            {{#repeat 12}}
+            <tr class="slot">
+              <th class="sequence">
+              </th>
+              <td class="player-name">
+              </td>
+              <td class="jersey-number">
+              </td>
+              <td class="position">
+              </td>
+              <td class="substitution">
+              </td>
+            </tr>
+            {{/repeat}}
+          </tbody>
+        </table>
+      </div>
+    </section>
+    <section class="SE lineup-card dugout blank" id="lineup-card-dugout-blank">
+      <header></header>
+      <div class="starting-lineup-table">
+        <table>
+          <thead>
+            <tr>
+              <th colspan="4">
+              Starting
+              </th>
+              <th class="substitution">
+              Substitution
+              </th>
+            </tr>
+          </thead>
+          <tbody>
+            {{!-- <% for i in (0...12) do%> --}}
+            {{#repeat 12}}
+            <tr class="slot">
+              <th class="sequence">
+              </th>
+              <td class="player-name">
+              </td>
+              <td class="jersey-number">
+              </td>
+              <td class="position">
+              </td>
+              <td class="substitution">
+              </td>
+            </tr>
+            {{/repeat}}
+            {{!-- <% end %> --}}
+          </tbody>
+        </table>
+      </div>
+    </section>
+  </div>
+</body>