From 588c23ec3f292316f2baee0de15784ac96258fa9 Mon Sep 17 00:00:00 2001 From: Anthony Correa Date: Fri, 10 May 2024 17:54:45 -0500 Subject: [PATCH] refactoring eventsheet --- src/helpers/eventsheet.js | 2 +- src/public/css/eventsheet.css | 558 ++++++++-------- src/public/css/eventsheet.css.map | 2 +- src/scss/eventsheet.scss | 619 ++++++++---------- .../partials/page_section_divider.hbs | 7 - .../eventsheet/partials/defense_pane.hbs | 2 +- .../partials/page_section_divider.hbs | 7 + .../partials/roster_and_history.hbs | 13 +- src/views/eventsheet/sheet.hbs | 15 +- 9 files changed, 561 insertions(+), 664 deletions(-) delete mode 100644 src/views/eventlineup/partials/page_section_divider.hbs create mode 100644 src/views/eventsheet/partials/page_section_divider.hbs diff --git a/src/helpers/eventsheet.js b/src/helpers/eventsheet.js index 2222bb4..e939916 100644 --- a/src/helpers/eventsheet.js +++ b/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 diff --git a/src/public/css/eventsheet.css b/src/public/css/eventsheet.css index 75dc6c0..8c1db94 100644 --- a/src/public/css/eventsheet.css +++ b/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 { - 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; -} - +@import url("/font/futura-now/stylesheet.css"); :root { --color-success: #b7e1cd; --color-danger: #f4c7c3; @@ -70,16 +21,68 @@ body.index-card .sheet { --color-grey-900: #212529; --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; +table, .lineup-card { font-size: inherit; border-collapse: collapse; empty-cells: show; @@ -88,46 +91,22 @@ table { overflow-x: hidden; overflow-y: hidden; width: 100%; - border: 0.5px solid black; - display: inline-table; } -table tr { - border-bottom-width: 0.5px; - border-color: grey; - border-bottom-style: solid; -} -table tr:nth-child(odd) { - 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; +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 { overflow: hidden; padding: 0 2px 0 2px; } -table tr th:empty::after, table tr td:empty::after { +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 { content: " "; } +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) { + background-color: white; +} + .float-right { float: right; } @@ -136,16 +115,7 @@ table tr th:empty::after, table tr td:empty::after { float: left; } -.B5 > .eventsheet { - display: grid; - grid-template-columns: 1fr 1fr; - grid-template-rows: 1fr 1fr; - column-gap: 0.35in; - row-gap: 0.35in; - background-size: 100%; -} - -.eventsheet > section { +section { box-sizing: content-box; overflow: hidden; /* outline: 0.5px dashed lightgrey; */ @@ -153,150 +123,119 @@ table tr th:empty::after, table tr td:empty::after { flex-direction: column; align-items: stretch; } -.eventsheet > section > div { +section > div { display: flex; flex: 1; align-items: stretch; height: auto; } -.eventsheet > 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 > section.NE { +.eventsheet.quarters.NE { grid-area: 1/2/2/3; } -.eventsheet > section.SW { +.eventsheet.quarters.SW { grid-area: 2/1/3/2; } -.eventsheet > section.SE { +.eventsheet.quarters.SE { grid-area: 2/2/3/3; } - -.eventsheet > .section-divider { +.eventsheet.quarters > .section-divider { + --divider-border: lightgrey dashed 1px; 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 { - grid-area: 1/1/2/2; - border-right: var(--divider-border); - border-bottom: var(--divider-border); -} -.eventsheet > .section-divider .NE { - grid-area: 1/2/2/3; - border-bottom: var(--divider-border); -} -.eventsheet > .section-divider .SW { - grid-area: 2/1/3/2; +.eventsheet.quarters > .section-divider .NW, .eventsheet.quarters > .section-divider .SW { border-right: var(--divider-border); } -.eventsheet > .section-divider .SE { - grid-area: 2/2/3/3; +.eventsheet.quarters > .section-divider .NW, .eventsheet.quarters > .section-divider .NE { + border-bottom: var(--divider-border); } +.lineup-card { + counter-reset: lineup-sequence-counter 0; + --border: 0.5px solid grey; + border: var(--section-border); +} +.lineup-card header { + font-size: inherit; + text-transform: uppercase; + font-stretch: 85%; + border-style: none; + border-bottom: var(--border); +} +.lineup-card header:empty::after { + content: " "; +} .lineup-card th { width: inherit; } - -#lineup-card-dugout div.grid-container, -#lineup-card-dugout-blank div.grid-container { - display: grid; - grid-template-columns: 60% auto; - grid-template-rows: fit-content(16px) auto; - grid-template-areas: "header header" "sarting-lineup-table substitution-table"; -} - -#lineup-card-exchange div.grid-container, -#lineup-card-exchange-blank div.grid-container { - display: grid; - grid-template-columns: auto; - grid-template-rows: fit-content(16px) auto; - grid-template-areas: "header" "sarting-lineup-table"; -} - -#lineup-card-exchange .substitution, -#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: " "; -} - -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; -} -section.lineup-card thead th { - color: var(--color-grey-600); - font-size: 0.7em; -} -section.lineup-card th.sequence { +.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); } -section.lineup-card th.sequence.counter::before { +.lineup-card th.sequence.counter::before { content: counter(lineup-sequence-counter); } - -.lineup-card table { +.lineup-card thead th { + color: var(--color-grey-600); + font-size: 0.7em; + border-bottom: var(--border); +} +.lineup-card table, .lineup-card .lineup-card { font-size: 21px; } - -.lineup-card td { +.lineup-card td, .lineup-card #roster-and-history .position, #roster-and-history .lineup-card .position { /* height: 34px; */ } - -.lineup-card td.substitution { +.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 td.substitution::after, .lineup-card #roster-and-history .substitution.position::after, #roster-and-history .lineup-card .substitution.position::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 td.position, .lineup-card #roster-and-history .position, #roster-and-history .lineup-card .position, .lineup-card td.jersey-number { + width: 2ch; } - -#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; +.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; } - -td.substitution { - border-left: 1px solid black; +.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 { @@ -305,36 +244,10 @@ section.blank { section.blank img, section.blank header { filter: grayscale(1); } -section.blank td.substitution { +section.blank td.substitution, section.blank #roster-and-history .substitution.position, #roster-and-history section.blank .substitution.position { 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%; -} - #todays-game > div { display: grid; grid-template-columns: 110px auto; @@ -357,38 +270,38 @@ section.blank td.substitution { border-right: 0.5px solid grey; border-left: 0.5px solid grey; } -#todays-game .footer table { +#todays-game .footer table, #todays-game .footer .lineup-card { height: 100%; outline: none; border-style: none; } -#todays-game .footer table tr { +#todays-game .footer table tr, #todays-game .footer .lineup-card 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 table tr :last-child, #todays-game .footer .lineup-card tr :last-child { background-color: white; outline: none; border-bottom-style: none; } -#todays-game .footer table th { +#todays-game .footer table th, #todays-game .footer .lineup-card th { 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, #todays-game .footer .lineup-card td, #todays-game .footer .lineup-card #roster-and-history .position, #roster-and-history #todays-game .footer .lineup-card .position { height: var(--row-height); border: none; } -#todays-game .footer table tdempty::after { +#todays-game .footer table tdempty::after, #todays-game .footer .lineup-card tdempty::after { content: ""; } -#todays-game table.notes th { +#todays-game table.notes th, #todays-game .notes.lineup-card th { border-left: none; 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, #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 { content: ""; } @@ -398,7 +311,7 @@ section.blank td.substitution { #defense-card .footer { display: none; } -#defense-card .slot-set table { +#defense-card .slot-set table, #defense-card .slot-set .lineup-card { font-size: 14px; width: 120px; } @@ -411,19 +324,22 @@ section.blank td.substitution { margin-bottom: inherit !important; grid-area: 5/1/6/5 !important; } -#defense-card .slot-set.pos-p table { +#defense-card .slot-set.pos-p table, #defense-card .slot-set.pos-p .lineup-card { width: 120px !important; } -#defense-card .slot-set.pos-p table tbody > tr:last-child { +#defense-card .slot-set.pos-p table tbody > tr:last-child, #defense-card .slot-set.pos-p .lineup-card tbody > tr:last-child { 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 +357,75 @@ section.blank td.substitution { display: flex; align-items: center; } +#defense-pane .slot-set .player-name { + font-stretch: 80%; +} +#defense-pane .slot-set table, #defense-pane .slot-set .lineup-card { + --border: grey solid 0.5px; + border: var(--border); +} +#defense-pane .slot-set table tr:first-child th, #defense-pane .slot-set .lineup-card tr:first-child th { + border-bottom: var(--border); +} +#defense-pane .slot-set table tr + tr, #defense-pane .slot-set .lineup-card tr + tr { + border-top: var(--border); +} +#defense-pane .slot-set table tr th.position, #defense-pane .slot-set .lineup-card 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"; } @@ -505,9 +466,12 @@ section.blank td.substitution { margin-bottom: 4px; grid-area: 6/1/7/5; } -#defense-pane .slot-set.pos-p table { +#defense-pane .slot-set.pos-p table, #defense-pane .slot-set.pos-p .lineup-card { 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"; } @@ -520,7 +484,7 @@ section.blank td.substitution { counter-reset: lineup-sequence-counter 0; /* outline: 0.5px solid black; */ } -#offense-pane table { +#offense-pane table, #offense-pane .lineup-card { height: 100%; border: none; } @@ -531,40 +495,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; - z-index: 1; + border-bottom: var(--section-border); } .cell-checkbox { @@ -652,36 +590,46 @@ header { background-color: #acc9fe; } -#roster-and-history .player-name { - font-stretch: 95%; +#roster-and-history { + --border: var(--section-border); } - -.starting { - font-weight: bold; -} - #roster-and-history thead { border: black solid 1px; } -#roster-and-history > div > table { +#roster-and-history > div > table, #roster-and-history > div > .lineup-card { /* font-size: 10.5px; */ padding: 0; 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,39 +637,40 @@ 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 .decimal-point, #roster-and-history th.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 .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; } @@ -741,7 +690,7 @@ 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%; */ @@ -759,12 +708,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 +721,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 +743,38 @@ 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; +} +#front-cover Header .homeaway { + font-weight: 800; + font-size: xx-large; +} +#front-cover Header .game-number, #front-cover Header .homeaway { display: grid; align-content: center; width: 1.4em; } -#front-cover .homeaway { - font-weight: 800; - font-size: xx-large; -} -#front-cover .game-number { +#front-cover Header .game-number { font-size: large; font-stretch: extra-condensed; font-weight: 700; text-wrap: nowrap; } -#front-cover .title { - display: grid; - font-size: small; - flex-grow: 1; - align-content: center; +#front-cover th { + 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 +787,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; diff --git a/src/public/css/eventsheet.css.map b/src/public/css/eventsheet.css.map index 0c9e08b..5441257 100644 --- a/src/public/css/eventsheet.css.map +++ b/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"} \ No newline at end of file +{"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"} \ No newline at end of file diff --git a/src/scss/eventsheet.scss b/src/scss/eventsheet.scss index a8d1b0f..68895ac 100644 --- a/src/scss/eventsheet.scss +++ b/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'); - -@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; -} +@import url('/font/futura-now/stylesheet.css'); :root { --color-success: #b7e1cd; @@ -74,16 +21,60 @@ body.index-card .sheet { --color-grey-900: #212529; --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,57 +83,26 @@ table { overflow-x: hidden; overflow-y: hidden; width: 100%; - border: 0.5px solid black; - display: inline-table; + th, td { + overflow: hidden; + padding: 0 2px 0 2px; + &:empty::after { + content: "\00a0"; + } + } +} + +table.striped { tr { - border-bottom-width: 0.5px; - border-color: grey; - border-bottom-style: solid; - &:nth-child(odd) { - background-color: rgb(242, 242, 242, 0.85); + background-color: whitesmoke; } &:nth-child(even) { - background-color: rgb(256, 256, 256, 0.85); + background-color: white; } - - th { - font-stretch: extra-condensed; - 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; - - &:empty::after { - content: "\00a0"; - } - } - } - } .float-right { @@ -153,16 +113,7 @@ table { float: left; } -.B5 > .eventsheet { - display: grid; - grid-template-columns: 1fr 1fr; - grid-template-rows: 1fr 1fr; - column-gap: 0.35in; - row-gap: 0.35in; - background-size: 100%; -} - -.eventsheet > section { +section { box-sizing: content-box; overflow: hidden; /* outline: 0.5px dashed lightgrey; */ @@ -176,160 +127,139 @@ table { align-items: stretch; height: auto; } +} - &.NW { - grid-area: 1 / 1 / 2 / 2; +.eventsheet.quarters { + &, .section-divider { + display: grid; + grid-template-columns: 1fr 1fr; + grid-template-rows: 1fr 1fr; + column-gap: 0.35in; + row-gap: 0.35in; } - &.NE { - grid-area: 1 / 2 / 2 / 3; - } - &.SW { - grid-area: 2 / 1 / 3 / 2; - } - &.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; - - .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 { + grid-area: 1 / 1 / 2 / 2; + } + &.NE { + grid-area: 1 / 2 / 2 / 3; + } + &.SW { + grid-area: 2 / 1 / 3 / 2; + } + &.SE { + grid-area: 2 / 2 / 3 / 3; + } + + > .section-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 { + border-bottom:var(--divider-border); + } + } } -.lineup-card th { - width: inherit; -} - -#lineup-card-dugout div.grid-container, -#lineup-card-dugout-blank div.grid-container { - display: grid; - grid-template-columns: 60% auto; - grid-template-rows: fit-content(16px) auto; - grid-template-areas: - "header header" - "sarting-lineup-table substitution-table"; -} - -#lineup-card-exchange div.grid-container, -#lineup-card-exchange-blank div.grid-container { - display: grid; - grid-template-columns: auto; - grid-template-rows: fit-content(16px) auto; - grid-template-areas: - "header" - "sarting-lineup-table"; -} - -#lineup-card-exchange .substitution, -#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 { +.lineup-card { counter-reset: lineup-sequence-counter 0; + @extend table, .striped; + --border: 0.5px solid grey; + + border: var(--section-border); + + header { + font-size: inherit; + text-transform: uppercase; + font-stretch: 85%; + border-style: none; + border-bottom: var(--border); + &:empty::after { + content: "\00a0"; + } + } + + 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 { + font-size: 21px; } - th.sequence { - counter-increment: lineup-sequence-counter 1; - color: var(--color-grey-600); - font-size: inherit; - width: 2ch; - &.counter::before { - content: counter(lineup-sequence-counter); + td { + /* height: 34px; */ + &.substitution { + width: 8ch; + &::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; } - } + + tr + tr { + // border-top: 1px solid black; + border-top: var(--border); + } + &.dugout { + td.player-name { + width: 10ch; + font-stretch: 75%; + } + .position, .jersey-number, .substitution { + font-stretch: 75%; + } + } + + &.exchange { + .player-name { + font-stretch: 100%; + } + + .homeaway, .substitution { + display: none; + } + } } - -.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); img, header { @@ -340,32 +270,6 @@ section.blank { } } -#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%; -} - #todays-game { > div { @@ -481,14 +385,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 +415,36 @@ 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); + 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 +496,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 +531,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; - z-index: 1; + border-bottom: var(--section-border); + } - - .cell-checkbox { font-size: 0.75em; } @@ -723,20 +626,8 @@ header { background-color: #acc9fe; } -#roster-and-history .player-name { - font-stretch: 95%; -} - -.starting { - font-weight: bold; -} - #roster-and-history { - // #today-availability { - // font-stretch: normal; - // text-transform: uppercase; - // font-size: 0.8em; - // } + --border: var(--section-border); thead { border: black solid 1px; } @@ -747,6 +638,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; @@ -896,33 +812,49 @@ td.is-present-checkbox.available-status-code-None > span { border: none; padding-left: 5px; padding-right: 5px; - } - - .game-number, .homeaway{ - display: grid; - align-content: center; - width: 1.4em; - } - - .homeaway { - font-weight: 800; - font-size: xx-large; - } - - .game-number { - font-size: large; - font-stretch: extra-condensed; - font-weight: 700; - text-wrap: nowrap; - } - - .title { + .title { display: grid; - font-size: small; + font-family: "Futura Now"; flex-grow: 1; align-content: center; + } + + .homeaway { + font-weight: 800; + font-size: xx-large; + } + + .game-number, .homeaway{ + display: grid; + align-content: center; + width: 1.4em; + } + + .game-number { + font-size: large; + font-stretch: extra-condensed; + font-weight: 700; + text-wrap: nowrap; + } } + 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 { padding:5px; display: flex; @@ -935,6 +867,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; diff --git a/src/views/eventlineup/partials/page_section_divider.hbs b/src/views/eventlineup/partials/page_section_divider.hbs deleted file mode 100644 index a76b945..0000000 --- a/src/views/eventlineup/partials/page_section_divider.hbs +++ /dev/null @@ -1,7 +0,0 @@ - -
-
-
-
-
-
\ No newline at end of file diff --git a/src/views/eventsheet/partials/defense_pane.hbs b/src/views/eventsheet/partials/defense_pane.hbs index daf6da0..10dd492 100644 --- a/src/views/eventsheet/partials/defense_pane.hbs +++ b/src/views/eventsheet/partials/defense_pane.hbs @@ -2,7 +2,7 @@ {{#defenseLineup event_lineup_entries members}}
- +
diff --git a/src/views/eventsheet/partials/page_section_divider.hbs b/src/views/eventsheet/partials/page_section_divider.hbs new file mode 100644 index 0000000..9a9d220 --- /dev/null +++ b/src/views/eventsheet/partials/page_section_divider.hbs @@ -0,0 +1,7 @@ + +
+
+
+
+
+
\ No newline at end of file diff --git a/src/views/eventsheet/partials/roster_and_history.hbs b/src/views/eventsheet/partials/roster_and_history.hbs index 640b6a7..be1b7b7 100644 --- a/src/views/eventsheet/partials/roster_and_history.hbs +++ b/src/views/eventsheet/partials/roster_and_history.hbs @@ -1,12 +1,12 @@
- + {{!-- --}} - {{!-- <% by_member.select{|m,d| !m.is_non_player}.each_with_index do |(member, d), i|%> --}} {{#rosterHistory event event_lineup_entries members availabilities}} - + - - +
+ Available ({{availabilitySummary.playerGoingCount}}|{{availabilitySummary.playerMaybeCount}}) @@ -34,16 +34,19 @@
■ + {{this.jerseyNumber}} + {{this.lastName}} + {{positionLabelWithoutFlags this.benchcoach.eventLineupEntry.label}} + . 000 diff --git a/src/views/eventsheet/sheet.hbs b/src/views/eventsheet/sheet.hbs index d19d460..88350ee 100644 --- a/src/views/eventsheet/sheet.hbs +++ b/src/views/eventsheet/sheet.hbs @@ -1,8 +1,7 @@ -
- {{>page_section_divider}} +
@@ -119,9 +118,9 @@
- -
{{>page_section_divider}} +
+
@@ -145,10 +144,8 @@
{{# if event.opponentName}} -
-
+
vs -
@@ -210,6 +207,7 @@
+
@@ -242,6 +240,7 @@
+
@@ -275,6 +274,6 @@
- + {{>page_section_divider}}