caddy_data is not external

persist caddy data, move domain to .env
Merge branch 'docker'
2024-05-26 11:36:21 -05:00 · 2024-05-26 11:34:35 -05:00 · 2024-05-26 10:42:45 -05:00 · 2024-05-26 10:42:21 -05:00 · 2024-05-25 19:49:20 -05:00 · 2024-05-24 13:40:59 -05:00
17 changed files with 508 additions and 201 deletions
--- a/.dockerignore
+++ b/.dockerignore
@@ -0,0 +1,4 @@
+node_modules
+npm-debug.log
+Dockerfile
+.dockerignore
--- a/.vscode/launch.json
+++ b/.vscode/launch.json
@@ -4,10 +4,21 @@
  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
+    {
+      "name": "Attach",
+      "port": 9229,
+      "request": "attach",
+      "skipFiles": [
+        "<node_internals>/**"
+      ],
+      "type": "node",
+      "localRoot": "${workspaceFolder}/src",
+      "remoteRoot": "/home/node/app/src"
+    },
    {
      "console": "integratedTerminal",
      "internalConsoleOptions": "neverOpen",
-      "name": "nodemon",
+      "name": "nodemon (dev)",
      "program": "dev",
      "request": "launch",
      "restart": true,
@@ -16,8 +27,8 @@
        "<node_internals>/**"
      ],
      "type": "node",
-      "env": {"NODE_ENV": "development"},
-      "preLaunchTask": "npm: scss"
-    }
+      "env": {"NODE_ENV": "development", "DEBUG": "app"},
+      "preLaunchTask": "npm: build-css"
+    }    
  ]
 }
--- a/.vscode/tasks.json
+++ b/.vscode/tasks.json
@@ -3,17 +3,21 @@
 	"tasks": [
 		{
 			"type": "npm",
-			"script": "scss",
+			"script": "watch-scss",
 			"problemMatcher": [],
-			"label": "npm: scss watch",
-			"detail": "sass --watch src/scss/application.scss public/css/application.css src/scss/eventsheet.scss:public/css/eventsheet.css"
+			"label": "npm: watch-scss",
+			"detail": "npm run watch-css",
+			"icon": {
+        "id": "eye",
+        "color": "terminal.ansiBlue"
+      }
 		},
 		{
 			"type": "npm",
-			"script": "scss",
+			"script": "build-css",
 			"problemMatcher": [],
-			"label": "npm: scss",
-			"detail": "sass src/scss/application.scss:public/css/application.css src/scss/eventsheet.scss:public/css/eventsheet.css"
+			"label": "npm: build-css",
+			"detail": "npm build-css"
 		}
 	]
 }
--- a/14
+++ b/14
@@ -0,0 +1,14 @@
+FROM node:21
+
+RUN mkdir -p /home/node/app/node_modules && chown -R node:node /home/node/app
+RUN mkdir -p /home/node/app/var/db && chown -R node:node /home/node/app
+WORKDIR /home/node/app
+
+USER node
+COPY --chown=node:node package*.json ./
+RUN npm install
+COPY --chown=node:node src src
+COPY --chown=node:node bin bin
+
+EXPOSE 3000
+CMD [ "npm", "start" ]
--- a/bin/www
+++ b/bin/www
@@ -10,8 +10,7 @@ var https = require("https");
 var fs = require("fs");
 var debug = require("debug")("https");
 const path = require("path");
-
-
+var livereload = require("livereload");

 /**
 * Get port from environment and store in Express.
@@ -19,32 +18,18 @@ const path = require("path");

 var port = normalizePort(process.env.PORT || "3000");
 app.set("port", port);
-
-/**
- * Create HTTPS server.
- */
-const https_options = {
-  key: fs.readFileSync("certs/key.pem"),
-  cert: fs.readFileSync("certs/cert.pem"),
-};
+var server = http.createServer(app);

 if (process.env.NODE_ENV === "development") {
-  // console.log(`starting livereload, watching ${path.join(__dirname, "../src/views")}`)
-  var livereload = require("livereload");
-  var connectLiveReload = require("connect-livereload");
-
-  const liveReloadServer = livereload.createServer({https: https_options, extraExts: ['pug']});
+  const liveReloadServer = livereload.createServer({port:35729});
  liveReloadServer.watch(path.join(__dirname, "../src/views"));
  liveReloadServer.server.once("connection", () => {
    setTimeout(() => {
      liveReloadServer.refresh("/");
    }, 100);
  });
-
 }

-var server = https.createServer(https_options, app);
-
 /**
 * Listen on provided port, on all network interfaces.
 */
--- a/caddy/Caddyfile
+++ b/caddy/Caddyfile
@@ -0,0 +1,26 @@
+{
+    {$LOG_LEVEL}   # Set via environment variable
+}
+
+localhost {
+    # Development configuration
+    @notProd {
+        expression {env.ENVIRONMENT} == 'development'
+    }
+    handle @notProd {
+        # Configuration that only applies when not in production
+        reverse_proxy app-dev:3000
+    }
+}
+
+{$DOMAIN} {
+    # Production configuration
+    @prod {
+        expression {env.ENVIRONMENT} == 'production'
+    }
+    handle @prod {
+        # Configuration that only applies in production
+        # header Strict-Transport-Security "max-age=31536000;"
+        reverse_proxy app:3000
+    }
+}
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -0,0 +1,50 @@
+services:
+  app: &app
+    env_file:
+      - .env
+    build: .
+    networks:
+      - web
+    profiles:
+      - production
+    expose:
+      - 3000
+  
+  app-dev:
+    <<: *app
+    ports:
+      - 9229:9229 #debugger
+      - 35729:35729 #livereload
+    profiles:
+      - development
+    command: npm run dev
+    volumes:
+      - ./src:/home/node/app/src
+      - ./package.json:/home/node/app/package.json
+      - ./package-lock.json:/home/node/app/package-lock.json
+      - ./certs:/home/node/app/certs
+      - ./bin/www:/home/node/app/bin/www
+    environment:
+      DEBUG: "app"
+      NODE_ENV: "development"
+
+  caddy:
+    image: caddy
+    ports:
+      - 80:80
+      - 443:443
+    volumes:
+      - ./caddy/Caddyfile:/etc/caddy/Caddyfile
+      - caddy_data:/data
+      - caddy_config:/config
+    networks:
+      - web
+    env_file:
+      - .env    
+
+networks:
+  web:
+
+volumes:
+  caddy_data:
+  caddy_config:
--- a/package-lock.json
+++ b/package-lock.json
@@ -33,6 +33,7 @@
        "passport-teamsnap": "^1.1.1",
        "pluralize": "^8.0.0",
        "pug": "^3.0.2",
+        "sass": "^1.77.2",
        "sortablejs": "^1.15.0",
        "teamsnap.js": "github:anthonyscorrea/teamsnap-javascript-sdk#link-with-null-link",
        "tinymce": "^6.8.3",
@@ -663,7 +664,6 @@
      "version": "3.1.3",
      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
      "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
-      "dev": true,
      "dependencies": {
        "normalize-path": "^3.0.0",
        "picomatch": "^2.0.4"
@@ -834,7 +834,6 @@
      "version": "2.2.0",
      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
      "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
-      "dev": true,
      "engines": {
        "node": ">=8"
      }
@@ -997,7 +996,6 @@
      "version": "3.0.2",
      "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
      "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
-      "dev": true,
      "dependencies": {
        "fill-range": "^7.0.1"
      },
@@ -1169,7 +1167,6 @@
      "version": "3.6.0",
      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
      "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==",
-      "dev": true,
      "dependencies": {
        "anymatch": "~3.1.2",
        "braces": "~3.0.2",
@@ -2040,7 +2037,6 @@
      "version": "7.0.1",
      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
      "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
-      "dev": true,
      "dependencies": {
        "to-regex-range": "^5.0.1"
      },
@@ -2195,7 +2191,6 @@
      "version": "2.3.3",
      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
      "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
-      "dev": true,
      "hasInstallScript": true,
      "optional": true,
      "os": [
@@ -2304,7 +2299,6 @@
      "version": "5.1.2",
      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
-      "dev": true,
      "dependencies": {
        "is-glob": "^4.0.1"
      },
@@ -2564,6 +2558,11 @@
      "integrity": "sha512-Ius2VYcGNk7T90CppJqcIkS5ooHUZyIQK+ClZfMfMNFEF9VSE73Fq+906u/CWu92x4gzZMWOwfFYckPObzdEbA==",
      "dev": true
    },
+    "node_modules/immutable": {
+      "version": "4.3.6",
+      "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.6.tgz",
+      "integrity": "sha512-Ju0+lEMyzMVZarkTn/gqRpdqd5dOPaz1mCZ0SH3JV6iFw81PldE/PEB1hWVEA288HPt4WXW8O7AWxB10M+03QQ=="
+    },
    "node_modules/inherits": {
      "version": "2.0.3",
      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
@@ -2632,7 +2631,6 @@
      "version": "2.1.0",
      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
      "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
-      "dev": true,
      "dependencies": {
        "binary-extensions": "^2.0.0"
      },
@@ -2704,7 +2702,6 @@
      "version": "2.1.1",
      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
      "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
-      "dev": true,
      "engines": {
        "node": ">=0.10.0"
      }
@@ -2722,7 +2719,6 @@
      "version": "4.0.3",
      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
      "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
-      "dev": true,
      "dependencies": {
        "is-extglob": "^2.1.1"
      },
@@ -2745,7 +2741,6 @@
      "version": "7.0.0",
      "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
      "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
-      "dev": true,
      "engines": {
        "node": ">=0.12.0"
      }
@@ -3373,7 +3368,6 @@
      "version": "3.0.0",
      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
      "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
-      "dev": true,
      "engines": {
        "node": ">=0.10.0"
      }
@@ -3667,7 +3661,6 @@
      "version": "2.3.1",
      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
      "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
-      "dev": true,
      "engines": {
        "node": ">=8.6"
      },
@@ -4078,7 +4071,6 @@
      "version": "3.6.0",
      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
      "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
-      "dev": true,
      "dependencies": {
        "picomatch": "^2.2.1"
      },
@@ -4228,6 +4220,22 @@
      "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
    },
+    "node_modules/sass": {
+      "version": "1.77.2",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.77.2.tgz",
+      "integrity": "sha512-eb4GZt1C3avsX3heBNlrc7I09nyT00IUuo4eFhAbeXWU2fvA7oXI53SxODVAA+zgZCk9aunAZgO+losjR3fAwA==",
+      "dependencies": {
+        "chokidar": ">=3.0.0 <4.0.0",
+        "immutable": "^4.0.0",
+        "source-map-js": ">=0.6.2 <2.0.0"
+      },
+      "bin": {
+        "sass": "sass.js"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
    "node_modules/semver": {
      "version": "7.6.0",
      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
@@ -4466,6 +4474,14 @@
        "node": ">=0.10.0"
      }
    },
+    "node_modules/source-map-js": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz",
+      "integrity": "sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
    "node_modules/source-map-support": {
      "version": "0.5.21",
      "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.21.tgz",
@@ -4735,7 +4751,6 @@
      "version": "5.0.1",
      "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
      "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
-      "dev": true,
      "dependencies": {
        "is-number": "^7.0.0"
      },
--- a/package.json
+++ b/package.json
@@ -24,9 +24,13 @@
  },
  "scripts": {
    "start": "node ./bin/www",
-    "dev": "nodemon . & npm run scss",
-    "scss": "sass src/scss/application.scss:src/public/css/application.css src/scss/eventsheet.scss:src/public/css/eventsheet.css",
-    "scss watch": "sass --watch src/scss/application.scss:src/public/css/application.css src/scss/eventsheet.scss:src/public/css/eventsheet.css"
+    "dev": "nodemon --inspect=0.0.0.0 ./bin/www",
+    "build-css": "sass src/scss:src/public/css",
+    "watch-scss": "nodemon -e scss -x \"npm run build-css\""
+  },
+  "nodemonConfig": {
+    "ext": "js,hbs,scss",
+    "watch": ["src"]
  },
  "dependencies": {
    "@teamsnap/teamsnap-ui": "^3.12.3",
@@ -54,6 +58,7 @@
    "passport-teamsnap": "^1.1.1",
    "pluralize": "^8.0.0",
    "pug": "^3.0.2",
+    "sass": "^1.77.2",
    "sortablejs": "^1.15.0",
    "teamsnap.js": "github:anthonyscorrea/teamsnap-javascript-sdk#link-with-null-link",
    "tinymce": "^6.8.3",
--- a/src/app.js
+++ b/src/app.js
@@ -62,8 +62,10 @@ app.set("view engine", "hbs");
 app.locals.pluralize = require("pluralize");

 if (process.env.NODE_ENV === "development") {
+  console.log('adding connectLiveReload')
  var connectLiveReload = require("connect-livereload");
-  app.use(connectLiveReload());
+  app.use("/scss", express.static(path.join(__dirname, "scss")));
+  app.use(connectLiveReload({port: 35729, src:"http://localhost:35729/livereload.js?snipver=1"}));
 }

 app.use(bodyParser.json());
@@ -172,7 +174,10 @@ app.use(function (err, req, res, next) {

 // catch 404 and forward to error handler
 app.use(function (req, res, next) {
-  next(createError(404));
+  // next(createError(404));
+  res.status(404).send('not found')
 });

+app.set('trust proxy')
+
 module.exports = {app};
--- a/src/helpers/eventsheet.js
+++ b/src/helpers/eventsheet.js
@@ -1,5 +1,6 @@
 const { parsePositionLabel, teamsnapMembersSortLineupAvailabilityLastName, teamsnapMembersSortAvailabilityLastName } = require('../lib/utils')
 const {attachBenchcoachPropertiesToMember} = require('../controllers/eventlineup')
+const Handlebars = require("handlebars");

 exports.offenseLineup = (number_of_slots, event_lineup_entries, members, options) => {
    var results = ""
@@ -112,8 +113,15 @@ exports.repeat = (n, options) => {

 exports.loopEvents = (events, options) => {
  var results = "";
-  events.forEach(event => {
-    results += options.fn(event)
+  if (options.data) {
+    data = Handlebars.createFrame(options.data);
+  }
+
+  events.forEach((event,i) => {
+    if (data) {
+      data.index = i;
+    }
+    results += options.fn(event, {data: data })
  }
  )
  return results;
@@ -121,6 +129,9 @@ exports.loopEvents = (events, options) => {

 exports.timepointForMember = (member, timeline, event, options) => {
  var results = ""
+  if (options.data) {
+    data = Handlebars.createFrame(options.data);
+  }
  const availability = timeline.availabilities.find(a=>a.memberId==member.id && a.eventId==event.id)
  const eventLineupEntry = timeline.event_lineup_entries.find(a=>(a.memberId==member.id || a.memberName == `${member.firstName} ${member.lastName}`) && a.eventId==event.id)
  var value = ""
@@ -130,5 +141,13 @@ exports.timepointForMember = (member, timeline, event, options) => {
  else {
    value = availability.status[0]
  }
-    return options.fn({availability: availability, eventLineupEntry: eventLineupEntry, value})
+    return options.fn({availability: availability, eventLineupEntry: eventLineupEntry, value}, {data: data })
+}
+
+exports.ifEquals = (testValue, targetValue, options) => {
+  if (testValue === targetValue) {
+    return options.fn();
+  } else {
+    return '';
+  }
 }
--- a/src/public/css/eventsheet.css
+++ b/src/public/css/eventsheet.css
@@ -83,7 +83,7 @@ body {
  text-transform: uppercase;
 }

-table, .lineup-card table {
+table, #roster-and-history table, .lineup-card table {
  font-size: inherit;
  border-collapse: collapse;
  empty-cells: show;
@@ -93,20 +93,20 @@ table, .lineup-card table {
  overflow-y: hidden;
  width: 100%;
 }
-table th, .lineup-card table th {
+table th, #roster-and-history table th, .lineup-card table th {
  color: var(--color-grey-700);
 }
-table th, .lineup-card table th, table td, table #roster-and-history .position, #roster-and-history table .position, .lineup-card table td {
+table th, #roster-and-history table th, .lineup-card table th, table td, table #roster-and-history .position, #roster-and-history table .position, #roster-and-history table td, .lineup-card table td {
  overflow: hidden;
  padding: 0 2px 0 2px;
 }
-table th:empty::after, table td:empty::after, table #roster-and-history .position:empty::after, #roster-and-history table .position:empty::after {
+table th:empty::after, #roster-and-history table th:empty::after, table td:empty::after, table #roster-and-history .position:empty::after, #roster-and-history table .position:empty::after, #roster-and-history table td:empty::after {
  content: " ";
 }
-table.striped tr:nth-child(odd), .lineup-card table tr:nth-child(odd) {
+table.striped tr:nth-child(odd) td, table.striped tr:nth-child(odd) #roster-and-history .position, #roster-and-history table tr:nth-child(odd) td, #roster-and-history table tr:nth-child(odd) .position, .lineup-card table tr:nth-child(odd) td, .lineup-card table tr:nth-child(odd) #roster-and-history .position, table.striped tr:nth-child(odd) th, #roster-and-history table tr:nth-child(odd) th, .lineup-card table tr:nth-child(odd) th {
  background-color: whitesmoke;
 }
-table.striped tr:nth-child(even), .lineup-card table tr:nth-child(even) {
+table.striped tr:nth-child(even) td, table.striped tr:nth-child(even) #roster-and-history .position, #roster-and-history table tr:nth-child(even) td, #roster-and-history table tr:nth-child(even) .position, .lineup-card table tr:nth-child(even) td, .lineup-card table tr:nth-child(even) #roster-and-history .position, table.striped tr:nth-child(even) th, #roster-and-history table tr:nth-child(even) th, .lineup-card table tr:nth-child(even) th {
  background-color: white;
 }

@@ -173,6 +173,10 @@ table.striped tr:nth-child(even), .lineup-card table tr:nth-child(even) {
  outline-offset: var(--page-margin);
 }

+.letter .eventsheet.quarters {
+  --header-height: 0.5in;
+}
+
 .letter .eventsheet.index-cards-4x6 {
  --section-margin: calc(var(--page-margin)/2);
  grid-template-columns: 1fr 1fr;
@@ -201,9 +205,7 @@ table.striped tr:nth-child(even), .lineup-card table tr:nth-child(even) {
  border: var(--section-border);
 }
 .lineup-card header {
-  font-size: inherit;
  text-transform: uppercase;
-  font-stretch: 85%;
  border-style: none;
  border-bottom: var(--border);
  height: var(--header-height);
@@ -230,7 +232,7 @@ table.striped tr:nth-child(even), .lineup-card table tr:nth-child(even) {
  font-size: 0.7em;
  border-bottom: var(--border);
 }
-.lineup-card table {
+.lineup-card table, .lineup-card #roster-and-history table, #roster-and-history .lineup-card table {
  font-size: 21px;
 }
 .lineup-card td, .lineup-card #roster-and-history .position, #roster-and-history .lineup-card .position {
@@ -252,7 +254,7 @@ table.striped tr:nth-child(even), .lineup-card table tr:nth-child(even) {
  padding-left: 2.5px;
  padding-right: 2.5px;
 }
-.lineup-card tr + tr {
+.lineup-card tr + tr td, .lineup-card tr + tr #roster-and-history .position, #roster-and-history .lineup-card tr + tr .position, .lineup-card tr + tr th {
  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 {
@@ -262,6 +264,12 @@ table.striped tr:nth-child(even), .lineup-card table tr:nth-child(even) {
 .lineup-card.dugout .position, .lineup-card.dugout .jersey-number, .lineup-card.dugout .substitution {
  font-stretch: 75%;
 }
+.lineup-card.exchange header {
+  text-align: center;
+}
+.lineup-card.exchange header .float-left, .lineup-card.exchange header .float-right {
+  float: none;
+}
 .lineup-card.exchange .player-name {
  font-stretch: 100%;
 }
@@ -269,7 +277,7 @@ table.striped tr:nth-child(even), .lineup-card table tr:nth-child(even) {
  display: none;
 }

-section.blank img, section.blank header {
+section.blank svg, section.blank header {
  filter: grayscale(1) opacity(0.4);
 }
 section.blank > div {
@@ -306,12 +314,12 @@ section.blank > div td.substitution, section.blank > div #roster-and-history .su
  outline: none;
  border-style: none;
 }
-#todays-game .footer table tr {
+#todays-game .footer table tr td, #todays-game .footer table tr #roster-and-history .position, #roster-and-history #todays-game .footer table tr .position, #todays-game .footer table tr th {
  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 td, #todays-game .footer table tr :last-child #roster-and-history .position, #roster-and-history #todays-game .footer table tr :last-child .position {
  background-color: white;
  outline: none;
  border-bottom-style: none;
@@ -380,9 +388,23 @@ section.blank > div td.substitution, section.blank > div #roster-and-history .su
  width: 100%;
  z-index: 2;
 }
-#defense-pane img {
+#defense-pane svg {
  position: absolute;
+  stroke-linecap: round;
+  stroke-miterlimit: 1.5;
  z-index: -1;
+  opacity: 70%;
+}
+#defense-pane svg #outfield-path {
+  stroke: #4AA1D5;
+  fill: none;
+  stroke-width: 4px;
+}
+#defense-pane svg #infield-path {
+  stroke: #4AA1D5;
+  fill: #D1E6F7;
+  stroke-width: 4px;
+  fill-opacity: 50%;
 }
 #defense-pane .slot-set {
  display: flex;
@@ -399,7 +421,7 @@ section.blank > div td.substitution, section.blank > div #roster-and-history .su
 #defense-pane .slot-set table tr:first-child th {
  border-bottom: var(--border);
 }
-#defense-pane .slot-set table tr + tr {
+#defense-pane .slot-set table tr + tr td, #defense-pane .slot-set table tr + tr #roster-and-history .position, #roster-and-history #defense-pane .slot-set table tr + tr .position, #defense-pane .slot-set table tr + tr th {
  border-top: var(--border);
 }
 #defense-pane .slot-set table tr th.position {
@@ -529,7 +551,7 @@ section.blank > div td.substitution, section.blank > div #roster-and-history .su

 header {
  background-color: #cadcf9;
-  font-family: "Oswald";
+  height: var(--header-height);
  width: auto;
  text-align: center;
  padding-left: 10px;
@@ -545,18 +567,12 @@ header {
  font-weight: bold;
 }

-.gametitle {
-  font-weight: bold;
-  text-transform: uppercase;
+.event-title {
  font-stretch: semi-condensed;
 }

 .homeaway {
-  text-transform: uppercase;
-  font-stretch: normal;
-  font-weight: bolder;
-  float: right;
-  text-transform: uppercase;
+  font-weight: 900;
 }

 .cell-smalltext {
@@ -596,36 +612,30 @@ header {
  font-stretch: condensed;
 }

-.available-status-code-1 {
-  color: rgb(0, 85, 0);
-  background-color: #b7e1cd;
-}
-
-.available-status-code-0 {
-  color: rgb(170, 0, 0);
-  background-color: #f4c7c3;
-}
-
-.past.available-status-code-0,
-.past.available-status-code-null {
-  color: var(--color-grey-600);
-  background-color: inherit;
-}
-
-.past.available-status-code-1.Y {
-  color: inherit;
-  background-color: var(--color-warning);
-}
-
-.available-status-code-2 {
-  color: blue;
-  background-color: #acc9fe;
-}
-
 #roster-and-history {
  --border: var(--section-border);
 }
-#roster-and-history thead {
+#roster-and-history table tr td.available-status-code-1, #roster-and-history table tr .available-status-code-1.position {
+  color: rgb(0, 85, 0);
+  background-color: #b7e1cd;
+}
+#roster-and-history table tr td.available-status-code-0, #roster-and-history table tr .available-status-code-0.position {
+  color: rgb(170, 0, 0);
+  background-color: #f4c7c3;
+}
+#roster-and-history table tr td.past.available-status-code-0, #roster-and-history table tr .past.available-status-code-0.position, #roster-and-history table tr td.past.available-status-code-null, #roster-and-history table tr .past.available-status-code-null.position {
+  color: var(--color-grey-600);
+  background-color: inherit;
+}
+#roster-and-history table tr td.past.available-status-code-1.Y, #roster-and-history table tr .past.available-status-code-1.Y.position {
+  color: inherit;
+  background-color: var(--color-warning);
+}
+#roster-and-history table tr td.available-status-code-2, #roster-and-history table tr .available-status-code-2.position {
+  color: blue;
+  background-color: #acc9fe;
+}
+#roster-and-history table thead tr {
  border: black solid 1px;
  height: var(--header-height);
 }
@@ -677,6 +687,12 @@ header {
  text-align: center;
  padding: 0;
 }
+#roster-and-history td.spacer, #roster-and-history .spacer.position, #roster-and-history th.spacer {
+  display: none;
+}
+#roster-and-history td.spacer.first-of-group, #roster-and-history .spacer.first-of-group.position, #roster-and-history td.spacer.last-of-group, #roster-and-history .spacer.last-of-group.position, #roster-and-history th.spacer.first-of-group, #roster-and-history th.spacer.last-of-group {
+  border: none;
+}
 #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);
@@ -699,17 +715,19 @@ header {
  color: var(--color-grey-500);
 }
 #roster-and-history td.player-name, #roster-and-history .player-name.position {
-  color: black;
+  color: black !important;
  text-align: left;
  font-stretch: 95%;
 }
 #roster-and-history td.jersey-number, #roster-and-history .jersey-number.position {
-  color: black;
+  color: black !important;
 }
-#roster-and-history colgroup {
+#roster-and-history .first-of-group {
  border-left-width: 1px;
  border-left-style: solid;
  border-left-color: black;
+}
+#roster-and-history .last-of-group {
  border-right-width: 1px;
  border-right-style: solid;
  border-right-color: black;
@@ -717,12 +735,11 @@ header {
 #roster-and-history col.player-stats {
  border: inherit;
 }
-#roster-and-history th {
+#roster-and-history table tr:nth-child(odd) th {
  background-color: #cadcf9;
  color: black;
-  border: none;
 }
-#roster-and-history th.availability-on-day div, #roster-and-history th.position div {
+#roster-and-history table tr:nth-child(odd) th.availability-on-day div, #roster-and-history table tr:nth-child(odd) th.position div {
  transform: rotate(270deg);
  /* font-stretch: 40%; */
  font-stretch: 75%;
@@ -735,16 +752,65 @@ header {
 #roster-and-history tbody {
  border-bottom: solid black 1px;
 }
-#roster-and-history tr.border-top {
+#roster-and-history tr.border-top td, #roster-and-history tr.border-top .position, #roster-and-history tr.border-top th {
  border-top: 1px solid black;
 }

-td.position-capability:not(:empty), #roster-and-history .position-capability.position:not(:empty) {
+.letter .eventsheet.quarters header {
+  font-size: xx-large;
+}
+.letter .eventsheet.quarters .lineup-card table, .letter .eventsheet.quarters .lineup-card #roster-and-history table, #roster-and-history .letter .eventsheet.quarters .lineup-card table, .letter .eventsheet.quarters #roster-and-history .lineup-card table {
+  font-size: 23;
+}
+.letter .eventsheet.quarters #defense-pane .slot-set.pos-p {
+  align-items: start;
+}
+.letter .eventsheet.quarters #roster-and-history .spacer {
+  display: table-cell;
+  width: 30%;
+}
+.letter .eventsheet.quarters #roster-and-history td.position.last-of-group, .letter .eventsheet.quarters #roster-and-history .position.last-of-group {
+  border-right: none;
+}
+.letter .eventsheet.quarters #roster-and-history .container {
+  --padding: 2px;
+  display: block;
+  flex: none;
+  transform: rotate(90deg) translateY(-100%);
+  transform-origin: top left;
+  height: calc(4.25in - 2 * var(--page-margin) - 2 * var(--padding));
+  width: calc(5.5in - 2 * var(--page-margin) - 2 * var(--padding));
+  padding: var(--padding);
+}
+.letter .eventsheet.quarters #roster-and-history table {
+  font-size: 11;
+  height: 100%;
+}
+.letter .eventsheet.quarters #roster-and-history table thead tr {
+  height: inherit;
+}
+.letter .eventsheet.quarters #roster-and-history table thead tr th {
+  padding-top: 2px;
+  padding-bottom: 2px;
+}
+.letter .eventsheet.quarters #roster-and-history table th.availability-on-day div, .letter .eventsheet.quarters #roster-and-history table th.position div {
+  transform: none;
+  text-align: center;
+}
+.letter .eventsheet.quarters #roster-and-history #defense-pane .slot-set.pos-p {
+  align-items: start;
+}
+
+table tr td.position-capability:not(:empty), #roster-and-history table tr td.position-capability:not(:empty), table tr #roster-and-history .position-capability.position:not(:empty), #roster-and-history table tr .position-capability.position:not(:empty) {
  color: var(--color-grey-700);
  background-color: var(--color-grey-200);
 }

-td.is-present-checkbox, #roster-and-history .is-present-checkbox.position {
+table tr td.position-capability:empty, #roster-and-history table tr td.position-capability:empty, table tr #roster-and-history .position-capability.position:empty, #roster-and-history table tr .position-capability.position:empty {
+  background-color: white;
+}
+
+table tr td.is-present-checkbox, #roster-and-history table tr td.is-present-checkbox, table tr #roster-and-history .is-present-checkbox.position, #roster-and-history table tr .is-present-checkbox.position {
  font-size: 0.5em;
  text-align: center;
  color: white;
@@ -766,7 +832,6 @@ td.is-present-checkbox.available-status-code-None > span, #roster-and-history .i
 #front-cover Header {
  font-family: "Helvetica Now";
  font-weight: 600;
-  line-height: 1.5em;
  background-color: #323669;
  color: white;
  display: inline-flex;
@@ -779,6 +844,7 @@ td.is-present-checkbox.available-status-code-None > span, #roster-and-history .i
  font-family: "Futura Now";
  flex-grow: 1;
  align-content: center;
+  font-size: 14px;
 }
 #front-cover Header .homeaway {
  font-weight: 800;
@@ -817,7 +883,7 @@ td.is-present-checkbox.available-status-code-None > span, #roster-and-history .i
 #front-cover .opponent, #front-cover .team {
  text-align: center;
  font-weight: 800;
-  font-size: x-large;
+  font-size: xx-large;
  align-items: center;
  font-family: "Pacifico";
  text-transform: none;
--- 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;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"}
+{"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;;AAMkB;EAChB;;AAGiB;EACjB;;;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;;;AAGF;EACE;EACE;EACA;EACA;EACA;;AACA;EACE;;;AAIN;EACE;EACE;EACA;EACA;EACA;;AACA;EACE;;;AAIN;EACE;EAEA;EAEA;;AAEA;EACE;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;;AAKF;EAEA;;AAIA;EACE;EACA;;AAEF;EACE;;AAKF;EACE;;AACA;EACE;;AAGJ;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;;AAGE;EACA;EACA;EACA;;AAGA;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;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;AAIJ;EACE;EACA;;AAIA;EACE;;AAGF;EACE;EACA;EACA;;AAEE;EACE;;AAEM;EACN;;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;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAEF;EACE;;;AAGF;EACE;;;AAKF;EACE;;AAME;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EAEE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAIJ;EACE;EACA;;AAEF;AACE;EACA;EACA;AACA;;AAIA;EACA;;AAKF;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;EACE;;AACA;EACE;;AAGJ;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;;AAEF;EACE;EACA;EACA;;AAGF;EAEE;;AAGF;EACE;EACA;;AAEA;EACE;AACA;EACA;EACA;EACA;;AAQJ;EACE;;AAGF;EACE;;AAGa;EACb;;;AAMF;EACE;;AAEF;EACE;;AAEF;EACE;;AAIA;EACE;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EAQE;EACA;;AARA;EACE;;AACA;EACE;EACA;;AAWJ;EACE;EACA;;AAQJ;EACE;;;AAKN;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;AACA;AAAA;;;AAIF;EACE;;;AAGF;EACE;;;AAGF;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;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"}
--- a/src/scss/eventsheet.scss
+++ b/src/scss/eventsheet.scss
@@ -98,13 +98,13 @@ table {

  &.striped {
    tr {
-      &:nth-child(odd) {
+      &:nth-child(odd) {td, th {
        background-color: whitesmoke;
-      }
+      }}
      
-      &:nth-child(even) {
+      &:nth-child(even) {td,th {
        background-color: white;
-      }
+      }}
    }
  }
 }
@@ -177,6 +177,10 @@ table {
    }
 }

+.letter .eventsheet.quarters {
+  --header-height: 0.5in;
+}
+
 .letter .eventsheet.index-cards-4x6 {
  --section-margin: calc(var(--page-margin)/2);
    grid-template-columns: 1fr 1fr;
@@ -207,9 +211,7 @@ table {
  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);
@@ -266,9 +268,10 @@ table {
  }

  tr + tr {
+    td, th{
    // border-top: 1px solid black;
    border-top: var(--border);
-  }  
+  }  }
  
  &.dugout {
    td.player-name {
@@ -281,6 +284,12 @@ table {
  }

  &.exchange {
+    header {
+      text-align: center;
+      .float-left, .float-right {
+        float:none;
+      }
+    }
    .player-name {
      font-stretch: 100%;
    }
@@ -292,7 +301,7 @@ table {
 } 

 section.blank {
-  img, header {
+  svg, header {
    filter: grayscale(1) opacity(0.4);
  }
  > div {
@@ -338,11 +347,13 @@ section.blank {
      border-style: none;
  
      tr {
+        td, th {
        background-color: white;
        outline: none;
        border-bottom: 0.5px solid var(--color-grey-500);
+        }
  
-        :last-child {
+        :last-child td {
          background-color: white;
          outline: none;
          border-bottom-style: none;
@@ -391,7 +402,7 @@ section.blank {
    table {
      font-size: 14px;
      width: 120px;
-      tbody > tr:last-child { 
+      tbody > tr:last-child td { 
        // display: none; 
      }
      }
@@ -437,9 +448,23 @@ section.blank {
    z-index: 2;
  }

-  img {
+  svg {
    position: absolute;
+    stroke-linecap: round;
+    stroke-miterlimit: 1.5;
    z-index: -1;
+    opacity: 70%;
+    #outfield-path {
+      stroke: #4AA1D5;
+      fill: none;
+      stroke-width: 4px;
+    }
+    #infield-path {
+      stroke: #4AA1D5;
+      fill: #D1E6F7;
+      stroke-width: 4px;
+      fill-opacity: 50%;  
+    }
  }

  .slot-set {
@@ -457,12 +482,12 @@ section.blank {
      border: var(--border);
      opacity: 85%;
      tr {
-        &:first-child th{
+        &:first-child th {
          border-bottom: var(--border);
        }
-        & + tr {
+        & + tr {td,th {
          border-top: var(--border);
-        }
+        }}
        th.position {
        font-family: var(--monospace-font);
        width: 2ch;
@@ -567,13 +592,12 @@ section.blank {

 header {
  background-color: #cadcf9;
-  font-family: "Oswald";
+  height: var(--header-height);
  width: auto;
  text-align: center;
  padding-left: 10px;
  padding-right: 10px;
  border-bottom: var(--section-border);
-
 }

 .cell-checkbox {
@@ -584,18 +608,12 @@ header {
  font-weight: bold;
 }

-.gametitle {
-  font-weight: bold;
-  text-transform: uppercase;
+.event-title {
  font-stretch: semi-condensed;
 }

 .homeaway {
-  text-transform: uppercase;
-  font-stretch: normal;
-  font-weight: bolder;
-  float: right;
-  text-transform: uppercase;
+  font-weight: 900;
 }

 .cell-smalltext {
@@ -634,35 +652,43 @@ header {
  font-stretch: condensed;
 }

-.available-status-code-1 {
-  color: rgb(0, 85, 0);
-  background-color: #b7e1cd;
-}

-.available-status-code-0 {
-  color: rgb(170, 0, 0);
-  background-color: #f4c7c3;
-}
-
-.past.available-status-code-0,
-.past.available-status-code-null {
-  color: var(--color-grey-600);
-  background-color: inherit;
-}
-
-.past.available-status-code-1.Y {
-  color: inherit;
-  background-color: var(--color-warning);
-}
-
-.available-status-code-2 {
-  color: blue;
-  background-color: #acc9fe;
-}

 #roster-and-history {
  --border: var(--section-border);
-  thead {
+  table {
+    @extend table, .striped;
+  }
+  
+  table tr td {
+    &.available-status-code-1 {
+      color: rgb(0, 85, 0);
+      background-color: #b7e1cd;
+    }
+    
+    &.available-status-code-0 {
+      color: rgb(170, 0, 0);
+      background-color: #f4c7c3;
+    }
+    
+    &.past.available-status-code-0,
+    &.past.available-status-code-null {
+      color: var(--color-grey-600);
+      background-color: inherit;
+    }
+    
+    &.past.available-status-code-1.Y {
+      color: inherit;
+      background-color: var(--color-warning);
+    }
+    
+    &.available-status-code-2 {
+      color: blue;
+      background-color: #acc9fe;
+    }
+  }
+
+  table thead tr {
    border: black solid 1px;
    height: var(--header-height);
  }
@@ -679,6 +705,7 @@ header {
    }
  }

+
  .player-name {
    font-stretch: 95%;
  }
@@ -728,6 +755,12 @@ header {
        text-align: center;
        padding: 0;
      }
+    &.spacer {
+      display: none;
+      &.first-of-group, &.last-of-group {
+        border: none;
+      }
+    }
    &.player-stats {
        display:none;
        font-family: var(--monospace-font);
@@ -754,19 +787,21 @@ header {

  td{
    &.player-name {
-      color: black;
+      color: black !important;
      text-align: left;
      font-stretch: 95%;
    }
    &.jersey-number {
-      color: black;
+      color: black !important;
    }
  }

-  colgroup {
+  .first-of-group {
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: black;
+  }
+  .last-of-group {
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: black;
@@ -777,10 +812,9 @@ header {
    border: inherit;
  }

-  th {
+  table tr:nth-child(odd) th { //needs to have n-thchild to override .striped
    background-color: #cadcf9;
    color: black;
-    border: none;

    &.availability-on-day div {
      transform: rotate(270deg);
@@ -803,20 +837,86 @@ header {
    border-bottom: solid black 1px;
  }

-  tr.border-top {
+  tr.border-top {td, th {
    border-top: 1px solid black;
-  }
-
-
+  }}

 }

-td.position-capability:not(:empty) {
+.letter .eventsheet.quarters {
+  header {
+    font-size: xx-large;
+  }
+  .lineup-card table {
+    font-size: 23;
+  }
+  #defense-pane .slot-set.pos-p {
+    align-items: start;
+  }
+
+  #roster-and-history {
+    .spacer {
+      display:table-cell;
+      width: 30%;
+    }
+
+    td.position.last-of-group {
+      border-right: none;
+    }
+
+    .container {
+      --padding: 2px;
+      display: block;
+      flex: none;
+      transform: rotate(90deg) translateY(-100%);
+      transform-origin: top left;
+      height: calc(4.25in - 2 * var(--page-margin) - 2 * var(--padding));
+      width: calc(5.5in - 2 * var(--page-margin) - 2 * var(--padding));
+      padding: var(--padding)
+    }
+
+    table {
+      thead tr {
+        height: inherit;
+        th {
+          padding-top: 2px; 
+          padding-bottom: 2px;
+        }
+      }
+      font-size: 11;
+      height:100%;
+      td, th {
+        &.player-name {
+          // width: 38%;
+        }
+      }
+    
+      th.availability-on-day div {
+        transform: none;
+        text-align: center;
+      }
+    }
+
+    .position, .availability-on-day, .is-present-checkbox {
+      // width: 3ch;
+    }
+
+    #defense-pane .slot-set.pos-p {
+      align-items: start;
+    }
+}}
+
+
+table tr td.position-capability:not(:empty) {
  color: var(--color-grey-700);
  background-color: var(--color-grey-200);
 }

-td.is-present-checkbox {
+table tr td.position-capability:empty {
+  background-color: white;
+}
+
+table tr td.is-present-checkbox {
  font-size: 0.5em;
  text-align: center;
  color: white;
@@ -838,7 +938,6 @@ td.is-present-checkbox.available-status-code-None > span {
  Header {
    font-family: "Helvetica Now";
    font-weight: 600;
-    line-height: 1.5em;
    background-color: #323669;
    color: white;
    display: inline-flex;
@@ -850,6 +949,7 @@ td.is-present-checkbox.available-status-code-None > span {
      font-family: "Futura Now";
      flex-grow: 1;
      align-content: center; 
+      font-size: 14px;
    }

    .homeaway {
@@ -898,7 +998,7 @@ td.is-present-checkbox.available-status-code-None > span {
  .opponent, .team {
    text-align: center;
    font-weight: 800;
-    font-size: x-large;
+    font-size: xx-large;
    align-items: center;
    font-family: 'Pacifico';
    text-transform: none;
--- a/src/views/eventsheet/partials/defense_pane.hbs
+++ b/src/views/eventsheet/partials/defense_pane.hbs
@@ -1,5 +1,5 @@
 <div class="field-container">
-  <img src="/media/baseball-diamond.svg" />
+  {{{embeddedSvgFromPath "/media/baseball-diamond.svg" 'baseball-diamond'}}}
  {{#defenseLineup event_lineup_entries members}}
  <div class="slot-set pos-{{this.position}}">
    <table class="striped">
--- a/src/views/eventsheet/partials/roster_and_history.hbs
+++ b/src/views/eventsheet/partials/roster_and_history.hbs
@@ -1,14 +1,16 @@
 <table>
-  <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="player"></colgroup> --}}
+  {{!-- <colgroup><col span="1" class="spacer"></colgroup> --}}
+  {{!-- <colgroup><col span="1" 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>
+  <colgroup><col span="4" class="availability-on-day past"></colgroup> --}}
  <thead>
    <tr>
      <th colspan="4" id="today-availability">
      Available ({{availabilitySummary.playerGoingCount}}|{{availabilitySummary.playerMaybeCount}})
      </th>
+      <th class="spacer first-of-group last-of-group"></th>
      <th class="player-stats">
        <span class="decimal-point">.</span>AVG 
        <span class="delimiter">/</span>
@@ -17,17 +19,17 @@
        <span class="decimal-point">.</span>SLG 
        <span class="delimiter">:</span>PA 
      </th>
-      <th class="position-capability pitcher">P</th>
+      <th class="position-capability pitcher first-of-group">P</th>
      <th class="position-capability catcher">C</th>
      <th class="position-capability infield">I</th>
-      <th class="position-capability outfield">O</th>
+      <th class="position-capability outfield last-of-group">O</th>
      {{!-- <% for timepoint, i in timeline.select{|tp| tp[:comparison_to_selected]>0}.sort{|tp| -tp[:comparison_to_selected]}.each_with_index do%> --}}

      {{#loopEvents upcoming_events}}
-        <th class="availability-on-day avail-today-plus-{{@index}}" date="{{this.startDate}}"><div>{{dateFormat this.startDate "ddd" }}</div></th>
+        <th class="availability-on-day avail-today-plus-{{@index}} {{#ifEquals @index 0}}first-of-group{{/ifEquals}}{{#ifEquals @index 3}}last-of-group{{/ifEquals}}" date="{{this.startDate}}"><div>{{dateFormat this.startDate "ddd" }}</div></th>
      {{/loopEvents}}
      {{#loopEvents recent_events}}
-        <th class="availability-on-day avail-today-minus-{{@index}}" date="{{this.startDate}}"><div>{{dateFormat this.startDate "ddd" }}</div></th>
+        <th class="availability-on-day avail-today-minus-{{@index}} {{#ifEquals @index 0}}first-of-group{{/ifEquals}}{{#ifEquals @index 3}}last-of-group{{/ifEquals}}" date="{{this.startDate}}"><div>{{dateFormat this.startDate "ddd" }}</div></th>
      {{/loopEvents}}
    </tr>
  </thead>
@@ -35,7 +37,7 @@
  {{!-- <% by_member.select{|m,d| !m.is_non_player}.each_with_index do |(member, d), i|%> --}}
  {{#rosterHistory event event_lineup_entries members availabilities}}
  <tr class="roster-history-slot{{#if (isStarting this)}} starting-today{{/if}}">
-    <td class="is-present-checkbox available-status-code-{{this.benchcoach.availability.statusCode}}">
+    <td class="is-present-checkbox available-status-code-{{this.benchcoach.availability.statusCode}} first-of-group">
      <span>■</span>
    </td>
    <td class="jersey-number available-status-code-{{this.benchcoach.availability.statusCode}}">
@@ -44,10 +46,11 @@
    <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 class="position available-status-code-{{this.benchcoach.availability.statusCode}} last-of-group">
+      <span>{{this.benchcoach.eventLineupEntry.label}}</span>
    </td>
-    <td class="player-stats border-left border-right">
+    <td class="spacer"></td>
+    <td class="player-stats first-of-group last-of-group">
      <span class="decimal-point">.</span>
      <span class="avg">000</span>
      <span class="delimiter">/</span>
@@ -59,20 +62,20 @@
      <span class="delimiter">:</span>
      <span class="pa">00</span>
    </td>
-    <td class="position-capability pitcher">{{positionCapabilityFor this "P"}}</td>
+    <td class="position-capability pitcher first-of-group">{{positionCapabilityFor this "P"}}</td>
    <td class="position-capability catcher">{{positionCapabilityFor this "C"}}</td>
    <td class="position-capability infield">{{positionCapabilityFor this "IF"}}</td>
-    <td class="position-capability outfield">{{positionCapabilityFor this "OF"}}</td>
+    <td class="position-capability outfield last-of-group">{{positionCapabilityFor this "OF"}}</td>
    {{#loopEvents ../upcoming_events}}
      {{#timepointForMember ../this ../../timeline this}}
-      <td class="availability-on-day future available-status-code-{{this.availability.statusCode}} {{this.value}}">
+      <td class="availability-on-day future available-status-code-{{this.availability.statusCode}} {{this.value}} {{#ifEquals @index 0}}first-of-group{{/ifEquals}}{{#ifEquals @index 3}}last-of-group{{/ifEquals}}">
        {{this.value}}
      </td>
      {{/timepointForMember}}
    {{/loopEvents}}
    {{#loopEvents ../recent_events}}
      {{#timepointForMember ../this ../../timeline this}}
-      <td class="availability-on-day past available-status-code-{{this.availability.statusCode}} {{this.value}}">
+      <td class="availability-on-day past available-status-code-{{this.availability.statusCode}} {{this.value}} {{#ifEquals @index 0}}first-of-group{{/ifEquals}}{{#ifEquals @index 3}}last-of-group{{/ifEquals}}">
        {{this.value}}
      </td>
      {{/timepointForMember}}
--- a/src/views/eventsheet/sheet.hbs
+++ b/src/views/eventsheet/sheet.hbs
@@ -5,7 +5,7 @@
    <section class="NE" id="defense-card">
      <header>
        <div class="event-title float-left">
-          {{event.formattedTitle}} – {{dateFormat event.startDate "ddd, MMM D h:mm A" }}
+          {{event.formattedTitle}}
        </div>
        <div class="homeaway float-right">
          {{event.gameType}}
@@ -32,12 +32,12 @@
      </div>
    </section>
    <section class="SW" 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 
+      <div class="container">
+        {{> roster_and_history
+          event=event
+          event_lineup_entries=event_lineup_entries
+          members=members availabilities=availabilities
+          recent_events=recent_events
          upcoming_events=upcoming_events
          }}
      </div>
@@ -82,7 +82,7 @@
    </section>
    <section class="SE lineup-card exchange" id="lineup-card-exchange">
      <header>
-        <div class="float-left event-title">{{event.formattedTitle}}</div>
+        <div class="float-left event-title">{{event.formattedTitleForMultiTeam}}</div>
        <div class="float-right homeaway">{{event.gameType}}</div>
      </header>
    <div class="starting-lineup-table">
Author	SHA1	Message	Date
Anthony Correa	5f02ea4d5c	caddy_data is not external	2024-05-26 11:36:21 -05:00
Anthony Correa	39380eaf03	persist caddy data, move domain to .env	2024-05-26 11:34:35 -05:00
Anthony Correa	cb131353dc	Merge branch 'docker'	2024-05-26 10:42:45 -05:00
Anthony Correa	e1c9a7b81b	cleanup to allow for debugging	2024-05-26 10:42:21 -05:00
Anthony Correa	c495b265ee	Merge branch 'main' into docker	2024-05-25 19:49:20 -05:00
Anthony Correa	49864874fc	dev script updates for scss watch	2024-05-24 13:40:59 -05:00
Anthony Correa	e9fd60e619	404 fix	2024-05-24 13:40:42 -05:00
Anthony Correa	84da372330	Merge branch 'main' into docker	2024-05-24 10:42:19 -05:00
Anthony Correa	c696ffb4bc	Merge branch 'eventsheet-development'	2024-05-24 10:42:06 -05:00
Anthony Correa	07be459781	cleanup some styling	2024-05-22 16:47:25 -05:00
Anthony Correa	769fa60196	incorporating changes for updated svg	2024-05-22 16:09:33 -05:00
Anthony Correa	d377399c10	incorporating changes for updated svg	2024-05-22 16:07:08 -05:00
Anthony Correa	fa50ab93dc	incorporate letter sized sheet accessible when url parameter ?sheet_size=letter	2024-05-22 13:41:17 -05:00
Anthony Correa	73e3afcecc	Merge branch 'main' into docker	2024-05-20 09:11:25 -05:00
Anthony Correa	6b9e6734fe	Merge branch 'main' into docker	2024-05-19 12:35:31 -05:00
Anthony Correa	6592f2eeae	Merge branch 'main' into docker	2024-05-10 17:55:15 -05:00
Anthony Correa	1c3cafdcda	Merge branch 'main' into docker	2024-05-06 16:51:00 -05:00
Anthony Correa	5e1facf24a	Merge branch 'main' into docker	2024-05-03 07:47:05 -05:00