Skip to content

Add pilot hex wall, Gantt timeline, and R Submissions Working Group branding to home page#172

Merged
bms63 merged 7 commits intomainfrom
copilot/consider-using-hexsession-package
Mar 20, 2026
Merged

Add pilot hex wall, Gantt timeline, and R Submissions Working Group branding to home page#172
bms63 merged 7 commits intomainfrom
copilot/consider-using-hexsession-package

Conversation

Copy link
Copy Markdown
Contributor

Copilot AI commented Mar 13, 2026

Adds an "Our Pilots" section to the home page displaying all pilots as a hex sticker wall alongside a Gantt-style timeline showing each pilot's active date range. Also introduces a new R Submissions Working Group hex sticker used as the site favicon and navbar logo.

New assets

  • hexes/pilot 6.svg — Proper hex sticker in a teal color scheme, styled to match the existing Pilot 1–5 series. Based on Pilot 3's ADaMs design, representing the "Expanded ADaMs & TLFs" focus of the submissions-pilot6-adams-tlfs repository. Includes an "⚡ AI-Driven" badge to reflect the AI-assisted nature of this pilot.
  • hexes/pilot 7.svg — Hex sticker in an R Consortium blue color scheme (#1565C0 / #42A5F5 / #EEF4FF background) with a unique "simulation of data" theme. Features a Cartesian plot with a filled bell curve (normal distribution), a dashed overlay curve representing the simulated distribution, and two layers of scatter dots (solid blue = observed data, lighter blue = Monte Carlo-style simulated draws). No bottom blue bar — the plot is scaled to leave the lower portion clear so the "Pilot 7" rotated corner label, the full rconsortium rotated text, and the R Consortium R-mark with constellation dots are all fully visible, matching the exact bottom layout of Pilots 1–5.
  • hexes/swg.svg — New R Submissions Working Group hex sticker featuring a 7-pilot honeycomb (each mini hex colored and numbered per pilot), a blue "R Submissions Working Group" banner, and the standard RConsortium bottom label.

_quarto.yml

  • Added favicon: hexes/swg.svg so the SWG hex sticker appears in browser tabs when the site is opened.
  • Added navbar: logo: hexes/swg.svg so the SWG hex sticker appears in the site navigation bar.

styles.css

  • Gantt timeline layout: labeled rows with proportionally-positioned, color-coded bars; arrow caps on open-ended (ongoing) pilots
  • Hex grid: responsive flexbox layout with hover lift/shadow animation
  • .swg-featured / .swg-hex / .swg-featured-text: layout styles for the SWG featured callout card
  • All colors via Bootstrap CSS variables (--bs-secondary-bg, --bs-body-color, etc.) for automatic light/dark mode support

index.qmd

  • New # Our Pilots section with a 3-sentence intro paragraph describing the pilot program's scope and progression, followed by two sub-sections rendered via {=html} raw blocks:
    • Timeline — Pilots 1–7 with proportional bar widths across a 2021→ongoing axis; Pilots 6 & 7 rendered with open-ended arrow indicators
    • Hex Stickers — A featured SWG callout card ("Seven pilots. One mission.") appears above the pilot grid; Pilots 1–5 link to their respective pilot pages (Pilot 5 links externally); Pilots 6 & 7 display the new SVG stickers as non-linked items
Original prompt

This section details on the original issue you should resolve

<issue_title>Considering using hexsession R package for hex wall</issue_title>
<issue_description>- https://hexsession.liomys.mx/

<agent_instructions>I want to create a hex wall on the front page of this website that also has a timeline on it

For Pilot 1 the timleine should be from 2021-2022, Pilot 2 2022-2024, Pilot 3 2023-2024, Pilot 5 2025-2026, Pilot 6 2026-ongoing, Pilot 7 2026-onoing

The hex sticks for Pilot 1-5 are availabe in this site. Pilot 6 and Pilot 7 do not have hex stickets but should have simple placeholders.</agent_instructions>

Comments on the Issue (you are @copilot in this section)


📍 Connect Copilot coding agent with Jira, Azure Boards or Linear to delegate work to Copilot in one click without leaving your project management tool.

- Create hexes/pilot 6.svg and hexes/pilot 7.svg placeholder hex stickers
- Add timeline and hex-grid CSS to styles.css using Bootstrap CSS variables for light/dark mode support
- Add "Our Pilots" section to index.qmd with a Gantt-style timeline and clickable hex sticker wall

Co-authored-by: bms63 <10111024+bms63@users.noreply.github.com>
Copilot AI changed the title [WIP] Consider using hexsession R package for hex wall Add pilot hex wall with Gantt timeline to home page Mar 13, 2026
Copilot AI requested a review from bms63 March 13, 2026 19:43
@bms63
Copy link
Copy Markdown
Contributor

bms63 commented Mar 13, 2026

@copilot can you gain context from pilot6 and pilot7 from information in this issue - #170

and create hex images similar to Pilot 1-5 for Pilot 6 and Pilot 7

…ot 7

- Pilot 6 (teal theme): Based on Pilot 3's ADaMs design, adapted to represent
  "Expanded ADaMs & TLFs" from submissions-pilot6-adams-tlfs repo. Uses teal
  color scheme (#009688, #004D40, #4DB6AC) with database cylinder illustration.
  Fixed broken external image reference, consolidated duplicate CSS.
- Pilot 7 (orange theme): Based on Pilot 5's document design, adapted to represent
  "Synthetic Clinical Data" from submissions-pilot7-synthetic-data repo. Uses
  deep orange color scheme (#E65100, #FFB300) with document/data illustration.
  Uses text element for "Pilot 7" label matching Pilot 3's approach.

Co-authored-by: bms63 <10111024+bms63@users.noreply.github.com>
Copy link
Copy Markdown
Contributor Author

Copilot AI commented Mar 13, 2026

@copilot can you gain context from pilot6 and pilot7 from information in this issue - #170

and create hex images similar to Pil...

Done in commit 7458846. Created proper hex stickers for both pilots using context from the linked repos and meeting minutes:

  • Pilot 6 (hexes/pilot 6.svg) — teal color scheme, based on Pilot 3's ADaMs design (since submissions-pilot6-adams-tlfs focuses on expanding ADaM datasets and TLF programs). Shows "ADaMs & TLFs" with the database cylinder illustration.
  • Pilot 7 (hexes/pilot 7.svg) — orange/amber color scheme, based on Pilot 5's document design (since submissions-pilot7-synthetic-data focuses on creating synthetic clinical trial data). Shows "Synthetic Clinical Data".

Both stickers match the full design language of Pilots 1–5: same hexagonal shape with the R Consortium blue border, same logo elements at the bottom, and the "Pilot N" text label in the corner. Here's how they look on the page:

hex wall with Pilots 6 and 7

@bms63
Copy link
Copy Markdown
Contributor

bms63 commented Mar 13, 2026

@copilot can you change the color of Pilot 7 to match the color of the other hexes for Pilot 7 and R Consortium

For Pilot 6 hex can you add a details on it being AI driven (please use your discretion on where this should be added)

Above the timeline can you provide a brief statement on what we are trying to accomplish with the Pilots. Maximum two to three sentences.

Also can you create a submissions working group hex sticker and find a prominent place for that on the website. The hex sticker should convey the meaning of submission working group inspired by the pilots that have been done. Also when opening new tabs from the website the submission working group hex sticker should appear in the new tab for a browser.

@bms63 bms63 marked this pull request as ready for review March 13, 2026 20:06
- Pilot 7: change colors from orange to R Consortium blue (#1565C0/#42A5F5)
- Pilot 6: add AI-Driven badge (yellow pill) with accessibility title element
- index.qmd: add 3-sentence intro paragraph above timeline
- hexes/swg.svg: new R Submissions Working Group hex sticker with 7-pilot
  honeycomb design, R Consortium blue palette, and standard bottom label
- _quarto.yml: add favicon and navbar logo pointing to swg.svg
- index.qmd: add SWG featured callout card above pilot hex grid
- styles.css: add .swg-featured/.swg-hex/.swg-featured-text layout styles

Co-authored-by: bms63 <10111024+bms63@users.noreply.github.com>
Copy link
Copy Markdown
Contributor Author

Copilot AI commented Mar 13, 2026

@copilot can you change the color of Pilot 7 to match the color of the other hexes for Pilot 7 and R Consortium

For Pilot 6 hex can you add a details on it being AI driven (please...

Done in commit eed0eee. Here's what was changed:

  • Pilot 7 color — changed from orange to R Consortium blue (#1565C0 / #42A5F5), matching the blue palette used across the series
  • Pilot 6 AI indicator — added a yellow "⚡ AI-Driven" badge pill in the body of the hex sticker, between the text bar and the document decoration
  • Above timeline — added a 3-sentence paragraph describing the pilot program's scope and progression
  • R Submissions Working Group hex sticker (hexes/swg.svg) — features a 7-hex honeycomb (each mini hex numbered and colored per pilot), a blue "R Submissions / Working Group" banner, and the standard RConsortium bottom label. It appears:
    • Browser tab — set as site favicon in _quarto.yml
    • Navbar logo — appears top-left in the site header
    • Hex Stickers section — featured callout card above the pilot grid

Updated page

Copilot AI changed the title Add pilot hex wall with Gantt timeline to home page Add pilot hex wall, Gantt timeline, and R Submissions Working Group branding to home page Mar 13, 2026
@bms63
Copy link
Copy Markdown
Contributor

bms63 commented Mar 20, 2026

@copilot for the pilot 7 hex. Can you make it different from the pilot 5 hex. Pilot 7 is working on simulation of data which should be used as a theme for the hex

Replace the Pilot 5-based document icon with a completely new design
that visually represents synthetic clinical data simulation:
- Bell curve (normal distribution) with filled area and dashed overlay
- Monte Carlo-style scatter dots (observed vs simulated)
- Cartesian plot with grid lines and axes
- "Simulated vs Observed" legend label
- Same R Consortium blue palette (#1565C0 / #42A5F5 / #EEF4FF)

Co-authored-by: bms63 <10111024+bms63@users.noreply.github.com>
Copy link
Copy Markdown
Contributor Author

Copilot AI commented Mar 20, 2026

@copilot for the pilot 7 hex. Can you make it different from the pilot 5 hex. Pilot 7 is working on simulation of data which should be used as a theme for the hex

Done in commit f6ff4b1. Pilot 7 has been completely redesigned with a "simulation of data" theme — entirely different from Pilot 5's document icon. The new design features:

  • A bell curve (normal distribution) with a filled area and a dashed overlay curve representing the simulated distribution
  • Scatter dots in two layers: solid blue for observed data, lighter blue for Monte Carlo-style simulated draws
  • Cartesian plot with grid lines, axes and a "Simulated vs Observed" label

Pilot 7 redesign

@bms63
Copy link
Copy Markdown
Contributor

bms63 commented Mar 20, 2026

@copilot in the hex sticker for Pilot 7 can you remove the bottom blue bar so the Pilot 7 and R Consortium logo are visible. You can srink the normal plot to accomodate if needed

…7 label and RC logo

- Removed the bottom blue banner rect and its white "for R Submissions" text
- Scaled the plot card height from 148px to 120px (all internal y-coords proportionally scaled)
- Added "for R Submissions" as small dark-blue text below the plot instead
- Pilot 7 rotated label and R Consortium constellation are now fully visible

Co-authored-by: bms63 <10111024+bms63@users.noreply.github.com>
Copy link
Copy Markdown
Contributor Author

Copilot AI commented Mar 20, 2026

@copilot in the hex sticker for Pilot 7 can you remove the bottom blue bar so the Pilot 7 and R Consortium logo are visible. You can srink the normal plot to accomodate if needed

Done in commit fb8ee94. Removed the bottom blue bar, scaled the plot down to fit, and the "Pilot 7" label and R Consortium logo are now clearly visible at the bottom of the hex.

Pilot 7 updated

@bms63
Copy link
Copy Markdown
Contributor

bms63 commented Mar 20, 2026

@copilot please review the other hexes and see how the R Consoritum logo is added to the bottom right. Can you add that back in - it is currently only partially seen in the pilot 7 hex

- Added the complete 'rconsortium' rotated text paths (matching Pilot 1–5 layout)
  styled in dark blue (#0D47A1) to suit Pilot 7's blue colour scheme
- Replaced simplified circle elements with the proper path-based constellation dots
  (same geometry as Pilot 5, accent dots in #42A5F5 light blue)
- Removed standalone 'for R Submissions' text that was previously covering the area
- R Consortium logo and Pilot 7 label are now fully visible at the bottom of the hex

Co-authored-by: bms63 <10111024+bms63@users.noreply.github.com>
Copy link
Copy Markdown
Contributor Author

Copilot AI commented Mar 20, 2026

@copilot please review the other hexes and see how the R Consoritum logo is added to the bottom right. Can you add that back in - it is currently only partially seen in the pilot 7 ...

Done in commit 3dcd173. Added the complete rconsortium rotated text paths and proper path-based constellation dots — matching the exact layout used in Pilots 1–5. The R Consortium logo is now fully visible at the bottom right of the hex.

Pilot 7 with full RC logo

@bms63 bms63 merged commit f865558 into main Mar 20, 2026
1 check passed
@bms63 bms63 deleted the copilot/consider-using-hexsession-package branch March 20, 2026 15:17
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Considering using hexsession R package for hex wall

2 participants