Hack #174
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,216 @@ | ||
| --- | ||
| layout: events | ||
| title: "Civic Hack DC 2025" | ||
| date: 2025-07-26 | ||
| location: "Washington DC" | ||
| url: /civichackdc | ||
| description: | | ||
| A data hackathon to build open-source tools for analyzing public comments on regulations. Join us for a day of civic innovation! | ||
| --- | ||
| <style> | ||
|
|
||
| * { margin: 0; padding: 0; box-sizing: border-box; } | ||
| body { font-family: 'Source Sans Pro Web', 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif; line-height: 1.6; color: #333; } | ||
| .container { max-width: 1200px; margin: 0 auto; padding: 0 20px; } | ||
|
|
||
| .hero { background: linear-gradient(0deg, #104377); color: white; padding: 4rem 0; text-align: center; } | ||
| .hero h1 { font-size: 3.5rem; font-weight: bold; margin-bottom: 1rem; text-shadow: 2px 2px 4px rgba(0,0,0,0.3); } | ||
| .hero-banner { background: rgba(255,255,255,0.1); padding: 1rem 2rem; border-radius: 10px; margin: 2rem auto; max-width: 600px; backdrop-filter: blur(10px); } | ||
|
|
||
| .section { padding: 3rem 0; } | ||
| .section.alt { background: #f8f9fa; } | ||
| .section-title { text-align: center; font-size: 2.5rem; margin-bottom: 2rem; color: #333; } | ||
|
|
||
| .cta-buttons { display: flex; gap: 1rem; justify-content: center; margin-top: 2rem; } | ||
| .btn { padding: 12px 30px; border: none; border-radius: 25px; font-weight: 600; text-decoration: none; display: inline-block; transition: all 0.3s; cursor: pointer; } | ||
| .btn-secondary { background: #f8f9fa; color: #333; border: 2px solid #e9ecef; } | ||
| .btn-secondary:hover { background: #104377; transform: translateY(-2px); } | ||
|
|
||
| .focus-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 1rem; margin: 2rem 0; } | ||
| .focus-icon { background: white; padding: 1.5rem; border-radius: 12px; text-align: center; box-shadow: 0 4px 6px rgba(0,0,0,0.1); transition: transform 0.3s; } | ||
| .focus-icon:hover { transform: translateY(-4px); } | ||
| .focus-icon-symbol { width: 40px; height: 40px; background: #4A90E2; border-radius: 50%; margin: 0 auto 0.5rem; display: flex; align-items: center; justify-content: center; color: white; font-size: 1.2rem; } | ||
|
|
||
| .goals-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 2rem; } | ||
| .goal-card { background: #f8f9fa; padding: 2rem; border-radius: 12px; border-left: 4px solid #4A90E2; transition: transform 0.3s, box-shadow 0.3s; } | ||
| .goal-card:hover { transform: translateY(-4px); box-shadow: 0 8px 25px rgba(0,0,0,0.15); } | ||
| .goal-number { background: #104377; color: white; width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: bold; margin-bottom: 1rem; } | ||
|
|
||
| .question-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 2rem; } | ||
| .question-card { background: #f8f9fa; padding: 0.8rem; border-radius: 12px; border-left: 4px solid #4A90E2; transition: transform 0.3s, box-shadow 0.3s; } | ||
| .question-card:hover { transform: translateY(-4px); box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15); } | ||
|
|
||
| .partners-grid { display: flex; justify-content: center; flex-wrap: wrap; margin-top: 1rem; gap: 2rem; padding: 0; } | ||
| .partner-logo { width: 120px; height: auto; object-fit: contain; } | ||
| .container { padding-left: 0; padding-right: 0; } | ||
|
|
||
| @media (max-width: 768px) { | ||
| .header-content { flex-direction: column; gap: 1rem; } | ||
| nav ul { gap: 1rem; } | ||
| .hero h1 { font-size: 2.5rem; } | ||
| .focus-grid { grid-template-columns: repeat(2, 1fr); } | ||
| .goals-grid { grid-template-columns: 1fr; } | ||
| .cta-buttons { flex-direction: column; align-items: center; } | ||
| .timeline-item { padding-left: 60px; } | ||
| } | ||
| </style> | ||
|
Comment on lines
+10
to
+56
There was a problem hiding this comment. Embedding styles directly in the markdown file with a |
||
|
|
||
| <section class="hero"> | ||
| <div class="container"> | ||
| <div class="hero-banner"> | ||
| <img class="usa-card__img" src="{{ '/assets/images/events/civichackdc/mainhackathonimage.png' | relative_url }}" alt="Civic Hack DC banner"> | ||
| </div> | ||
| <h2><b>Saturday, July 26</b></h2> | ||
| <h4><i>10:00 AM - 6:30 PM </i></h4> | ||
| <h3><b>Location: <span style="color: #FFD700;">TBA</span></b></h3> | ||
| <p><i>(metro-accessible)</i></p> | ||
| <br/> | ||
|
Comment on lines
+63
to
+67
There was a problem hiding this comment. The use of presentational tags like |
||
|
|
||
| <p>Please reach out to <a href="mailto:[email protected]" style="color: white;">[email protected]</a> if you are interested in sponsoring the event!</p> | ||
| <br/> | ||
| <p style="font-size: 1.2rem; text-align: center; max-width: 800px; margin: 0 auto;">A collaborative, hands-on hackathon dedicated to using AI, data science, and data engineering techniques to unlock public-comment data and illuminate how the public influences federal policies.</p> | ||
| <div class="cta-buttons"> | ||
| <a href="https://lu.ma/czi3y05y" class="btn btn-secondary">Register</a> | ||
| <a href="#about" class="btn btn-secondary">Learn More</a> | ||
| </div> | ||
| </div> | ||
| </section> | ||
|
|
||
| <section class="section"> | ||
| <div class="container"> | ||
| <div class="partners-grid"> | ||
| <a href="https://www.moravian.edu" target="_blank" rel="noopener noreferrer"> <img class="partner-logo" src="/assets/images/events/civichackdc/Moravian.png" alt="Moravian"></a> | ||
| <a href="https://careset.com/" target="_blank" rel="noopener noreferrer"> <img class="partner-logo" src="/assets/images/events/civichackdc/careset.png" alt="Careset"></a> | ||
| <a href="https://www.meetup.com/data-wranglers-dc/" target="_blank" rel="noopener noreferrer"> <img class="partner-logo" src="/assets/images/events/civichackdc/dataengineers.png" alt="Data Engineers"></a> | ||
| <a href="https://www.meetup.com/data-visualization-dc/" target="_blank" rel="noopener noreferrer"> <img class="partner-logo" src="/assets/images/events/civichackdc/dataviz.png" alt="Data Viz"></a> | ||
| <a href="https://www.dc2.org/data-science-dc" target="_blank" rel="noopener noreferrer"> <img class="partner-logo" src="/assets/images/events/civichackdc/dsdc.png" alt="DSDC"></a> | ||
| <a href="https://www.meetup.com/women-and-gender-expansive-coders-dc-wgxc-dc/" target="_blank" rel="noopener noreferrer"> <img class="partner-logo" src="/assets/images/events/civichackdc/WGXCDC.png" alt="WGXCDC"></a> | ||
| </div> | ||
| </div> | ||
| </section> | ||
|
|
||
| <section class="section" id="about"> | ||
| <div class="container"> | ||
| <h2 class="section-title">📊 Why this matters 📊</h2> | ||
| <div style="max-width: 800px; margin: 2rem auto 0; text-align: left;"> | ||
| <p>Each time a federal agency proposes new rules or seeks public input via <a href="https://www.regulations.gov/" target="_blank" rel="noopener noreferrer">regulations.gov</a>, thousands of comments pour in from individuals, advocacy groups, corporations, and more. Yet the data is notoriously difficult to access, analyze, and utilize effectively.</p> | ||
| <br> | ||
| <p>To bridge this gap, Professor Ben Coleman and his students at Moravian University developed a robust open-source data pipeline. Powered by donated API keys, their tool continuously downloads and publishes public comments across agencies to <a href="https://aws.amazon.com/marketplace/pp/prodview-ypmw3cvvwhv3y" target="_blank" rel="noopener noreferrer">S3 on AWS through its Open Data Platform</a>, making the comments freely available for exploration and analysis.</p> | ||
| <br> | ||
| <p>On July 26, we're hosting a hackathon to create open-source tools that can be used to examine public comments on any future or past regulations or RFIs. We will explore several datasets, including a <a href="https://www.federalregister.gov/documents/2025/05/16/2025-08701/request-for-information-health-technology-ecosystem">recent CMS RFI</a> seeking input on improving the health tech ecosystem for patients. Professor Coleman will be on-site to walk participants through the data download tool and structure.</p> | ||
| </div> | ||
| </div> | ||
| </section> | ||
|
|
||
| <section class="section alt"> | ||
| <div class="container"> | ||
| <h2 class="section-title">📝 Submit Your Problem Statements 📝</h2> | ||
| <div style="max-width: 800px; margin: 0 auto; text-align: center;"> | ||
| <p>We're actively seeking problem statements from policy experts to explore during the hackathon. If you have an idea, please submit it through our form; we'll review submissions and select key problems for participants to tackle. For example, one of our primary problem statements will address the recent CMS RFI on patient-centered health technology, but we encourage submissions on other topics as well.</p> | ||
| <div class="cta-buttons"> | ||
| <a href="https://docs.google.com/forms/d/e/1FAIpQLSfSGLrrTdu85aPlaLKGb2qZPPQ4wVJowmIpmAOu9e_MviG-sQ/viewform?usp=dialog" class="btn btn-secondary">Submit a Problem Statement</a> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </section> | ||
|
|
||
| <section class="section"> | ||
| <div class="container"> | ||
| <h2 class="section-title">✨ What We'll Build Together ✨</h2> | ||
| <p class="section-description" style="max-width: 800px; margin: 0 auto; text-align: center;"> | ||
| In this collaborative, non-competitive event, participants will develop open-source tools designed for reuse with any public comment dataset, past or future, exploring questions such as: | ||
| </p> | ||
| <br> | ||
| <div class="question-grid"> | ||
| <div class="question-card">Who's commenting? (Individuals, nonprofits, corporations)</div> | ||
| <div class="question-card">What are the major themes, sentiments, and sector-specific concerns?</div> | ||
| <div class="question-card">Can we detect copy-paste campaigns or coordinated submissions?</div> | ||
| <div class="question-card">What are organizations' historical commenting trends and motivations?</div> | ||
| <div class="question-card">Which public comments directly influenced the final regulatory outcomes?</div> | ||
| </div> | ||
| </div> | ||
| </section> | ||
|
|
||
|
|
||
| <section class="section"> | ||
| <div class="container"> | ||
| <h2 class="section-title">✨ Hackathon Goals ✨</h2> | ||
| <div class="goals-grid"> | ||
| <div class="goal-card"> | ||
| <div class="goal-number">1</div> | ||
| <h3>Bring Together Contributors</h3> | ||
| <p>Connect researchers, designers, data scientists, policy experts, and civic advocates to collaborate on civic tech solutions.</p> | ||
| </div> | ||
| <div class="goal-card"> | ||
| <div class="goal-number">2</div> | ||
| <h3>Build Open-Source Tools</h3> | ||
| <p>Develop tools for analyzing public comments, making it easier to extract meaningful insights from public feedback.</p> | ||
| </div> | ||
| <div class="goal-card"> | ||
| <div class="goal-number">3</div> | ||
| <h3>Promote Civic Engagement</h3> | ||
| <p>Demonstrate how public comments on regulations can inform better policymaking through improved engagement.</p> | ||
| </div> | ||
| <div class="goal-card"> | ||
| <div class="goal-number">4</div> | ||
| <h3>Have Fun!</h3> | ||
| <p>No prior experience is required! Just bring your curiosity, ideas, and laptop. We'll provide starter kits, roaming mentors, food, and drinks. This will be a collaborative, not competitive, hackathon.</p> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </section> | ||
|
|
||
| <section class="section"> | ||
| <div class="container"> | ||
| <h2 class="section-title">🤝 We're Looking For 🤝</h2> | ||
| <div class="goals-grid"> | ||
| <div class="goal-card"> | ||
| <h3>Partnerships</h3> | ||
| <p>Organizations interested in co-hosting, promoting, and helping us facilitate the event.</p> | ||
| </div> | ||
| <div class="goal-card"> | ||
| <h3>Subject Matter Experts</h3> | ||
| <p>Individuals with expertise willing to serve on our problem review board and provide insights on submitted problem statements.</p> | ||
| </div> | ||
| <div class="goal-card"> | ||
| <h3>Sponsorships</h3> | ||
| <p>Financial support, venue donations, food and beverage provision, or computing infrastructure; including cloud credits, AI resources, and infrastructure support. Please reach out to <a href="mailto:[email protected]">[email protected]</a></p> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </section> | ||
|
|
||
| <section class="section alt" id="schedule"> | ||
| <div class="container"> | ||
| <h2 class="section-title">📅 Event Schedule 📅</h2> | ||
| <p style="text-align: center; font-size: 2rem;">TBD</p> | ||
| </div> | ||
| </section> | ||
|
|
||
| <script> | ||
| document.addEventListener('DOMContentLoaded', function() { | ||
| // Smooth scrolling | ||
| document.querySelectorAll('a[href^="#"]').forEach(anchor => { | ||
| anchor.addEventListener('click', function (e) { | ||
| e.preventDefault(); | ||
| const target = document.querySelector(this.getAttribute('href')); | ||
| if (target) { | ||
| target.scrollIntoView({ behavior: 'smooth', block: 'start' }); | ||
| } | ||
| }); | ||
| }); | ||
|
|
||
| // Timeline animation | ||
| const observer = new IntersectionObserver((entries) => { | ||
| entries.forEach(entry => { | ||
| if (entry.isIntersecting) { | ||
| entry.target.classList.add('visible'); | ||
| } | ||
| }); | ||
| }, { threshold: 0.1, rootMargin: '0px 0px -50px 0px' }); | ||
|
|
||
| document.querySelectorAll('.timeline-item').forEach(item => { | ||
| observer.observe(item); | ||
| }); | ||
| }); | ||
| </script> | ||
|
Comment on lines
+190
to
+216
There was a problem hiding this comment. Embedding scripts directly in the HTML makes the code harder to manage, debug, and reuse across different pages. Place JavaScript code in external |
||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The CSS rule for
.timeline-itemappears unused, and the corresponding JavaScript on line 212 also targets non-existent elements. Remove this dead code to improve clarity and reduce file size.