Prevent image from overflowing on mobile

Author: s2t2

docs/_quarto.yml

@@ -225,7 +225,7 @@ format:
     theme: pulse
       #light: default #flatly
       #dark: darkly
-    #css: styles/my-style.css
+    css: styles/my-style.css
     code-copy: true
     #code-fold: false #show
     ##code-line-numbers: true

docs/index.qmd

@@ -1,11 +1,27 @@
-![](./images/predictive-modeling-book-banner-2025.png){fig-align="center" fig-alt="Predictive Modeling in Python (banner image)" height=400}
 
 # Welcome {.unnumbered}
 
-Welcome to the \"Predictive Modeling in Python\" book (2025 edition, online)!
+<img src="./images/predictive-modeling-book-banner-2025.png"
+    class="banner-image"
+    alt="Predictive Modeling in Python (banner image)"
+>
+
+Welcome to the \"Predictive Modeling in Python\" book (<span id="auto-copyright-year">2025</span> edition, online)!
 
 In an era where data-driven decision-making is essential, this book equips readers with the knowledge and practical skills needed to harness the power of predictive analytics.
 
 From understanding fundamental statistical principles to building and evaluating  machine learning models, readers will explore how to leverage Python to develop accurate and insightful predictions.
 
 Whether you are a beginner venturing into data science or an experienced practitioner seeking to refine your modeling expertise, this book seeks to empower you to turn data into actionable insights.
+
+
+<script type="text/javascript">
+
+    today = new Date();
+    thisYear =  today.getFullYear();
+    console.log("THE YEAR IS: ", thisYear);
+
+    var year = document.getElementById("auto-copyright-year");
+    year.innerText = thisYear;
+
+</script>

docs/styles/my-style.css

@@ -0,0 +1,7 @@
+.banner-image {
+  width: 100%;
+  height: auto;
+  max-width: 100%;
+  display: block;
+  object-fit: cover;
+}