diff --git a/_includes/about-page/about-card-our-locations.html b/_includes/about-page/about-card-our-locations.html new file mode 100644 index 0000000000..db5e27d9f9 --- /dev/null +++ b/_includes/about-page/about-card-our-locations.html @@ -0,0 +1,36 @@ +
+
+ + + + Our Locations +
+ +
+
+ From In-Person Events to Remote Collaboration +
+
+

+ In 2013, Hack for LA began as an in-person civic tech community, hosting events across Los Angeles—including the Westside, Downtown LA, and South LA—bringing volunteers together in shared spaces. +

+

+ During the COVID-19 pandemic, the organization transitioned to a fully remote operating model, expanding access and enabling broader participation beyond geographic boundaries. +

+
+ +
+ +
+ Former in-person event locations across Los Angeles +
+
+ {% include about-page/our-locations-images.html %} +
+
+

+ Today, Hack for LA continues to serve Los Angeles as a remote-first organization, supporting a distributed network of contributors. +

+
+
+
\ No newline at end of file diff --git a/_includes/about-page/our-locations-images.html b/_includes/about-page/our-locations-images.html new file mode 100644 index 0000000000..41ce0805e9 --- /dev/null +++ b/_includes/about-page/our-locations-images.html @@ -0,0 +1,13 @@ +
+
+
+ Westside +
+
+ Downtown L.A. +
+
+ South L.A. +
+
+
diff --git a/_sass/components/_about.scss b/_sass/components/_about.scss index 497a52768f..8c607337ad 100644 --- a/_sass/components/_about.scss +++ b/_sass/components/_about.scss @@ -552,6 +552,40 @@ a.anchor { margin-top: 18px; } +.locations-section-header { + font-size: 1.125rem; + font-weight: bolder; +} + +.locations-section-subheader { + font-size: 1rem; + font-weight: bolder; +} + +.locations-section-divider { + border-top: 2px solid $color-pink; + margin: 40px 0; +} + +.locations-card-container { + color: $color-white; + display: flex; + justify-content: center; + margin-top: 48px; + margin-bottom: 32px; + gap: 16px; +} + +.location-card { + flex: 1; +} + +.location-image { + width: 100%; + height: auto; + display: block; +} + .garcetti-mobile { display: block; } diff --git a/pages/about.html b/pages/about.html index 383791be9c..db4fd03bdd 100644 --- a/pages/about.html +++ b/pages/about.html @@ -34,6 +34,9 @@

About Us

{% assign accomplishments= site.data.internal.accomplishments %} {% include about-page/about-card-accomplishments.html %} + + {% include about-page/about-card-our-locations.html %} + {% include about-page/about-card-metrics.html %} @@ -59,6 +62,7 @@

About Us

  • Hack for LA Platform
  • Sustainability
  • Accomplishments
    • +
  • Our Locations
  • Metrics
  • Partners
  • Make a Donation