Set Community Engine hero background via Rails asset helpers

Author: rsmithlal

app/views/better_together/static_pages/community_engine.html.erb

@@ -1,6 +1,5 @@
-
-<!-- Hero Section with Background Image from Unsplash -->
-<section class="text-center" style="background: url('https://source.unsplash.com/featured/?community') no-repeat center center; background-size: cover;">
+<!-- Hero Section with Background Image -->
+<section class="text-center" style="background: url(<%= asset_path('better_together/unsplash-community-1.jpeg') %>) no-repeat center center; background-size: cover;">
   <div class="container py-5 my-5 text-white">
     <div class="row py-lg-5">
       <div class="col-lg-8 mx-auto">
@@ -61,7 +60,7 @@
 
 <!-- Interspersed Hero Images and Content Sections -->
 <!-- Section with Background Image -->
-<section class="text-center" style="background: url('https://source.unsplash.com/featured/?collaboration') no-repeat center center; background-size: cover;">
+<section class="text-center" style="background: url(<%= asset_path('better_together/unsplash-collaborate-1.jpeg') %>) no-repeat center center; background-size: cover;">
   <div class="container py-5 my-5 text-white">
     <h2>Collaborate Effectively</h2>
     <p>Join projects, share ideas, and collaborate in real-time with community tools that empower.</p>
@@ -77,10 +76,9 @@
 </section>
 
 <!-- Another Interspersed Image Section with CSS Class for Overlay -->
-<section class="text-center image-overlay-container" style="background: url('https://source.unsplash.com/featured/?innovation') no-repeat center center; background-size: cover;">
+<section class="text-center image-overlay-container" style="background: url(<%= asset_path('better_together/unsplash-community-2.jpeg') %>) no-repeat center center; background-size: cover;">
   <div class="container py-5 my-5 image-overlay">
     <h2>Innovate Together</h2>
     <p>Explore new possibilities and innovations sparked by community-driven initiatives.</p>
   </div>
 </section>
-