fix: headers should use webp and remove the overlay (for accessibility and load)

Author: lwasser

_includes/page__hero.html

@@ -1,26 +1,25 @@
 {% capture overlay_img_path %}{{ page.header.overlay_image | relative_url }}{% endcapture %}
 
-{% if page.header.overlay_filter contains "gradient" %}
-  {% capture overlay_filter %}{{ page.header.overlay_filter }}{% endcapture %}
-{% elsif page.header.overlay_filter contains "rgba" %}
-  {% capture overlay_filter %}{{ page.header.overlay_filter }}{% endcapture %}
-  {% capture overlay_filter %}linear-gradient({{ overlay_filter }}, {{ overlay_filter }}){% endcapture %}
-{% elsif page.header.overlay_filter %}
-  {% capture overlay_filter %}rgba(0, 0, 0, {{ page.header.overlay_filter }}){% endcapture %}
-  {% capture overlay_filter %}linear-gradient({{ overlay_filter }}, {{ overlay_filter }}){% endcapture %}
-{% endif %}
-
 {% if page.header.image_description %}
   {% assign image_description = page.header.image_description %}
 {% else %}
   {% assign image_description = page.title %}
 {% endif %}
 
 {% assign image_description = image_description | markdownify | strip_html | strip_newlines | escape_once %}
-
+<!-- Add support for webp and remove overlay filter -->
 <div class="page__hero{% if page.header.overlay_color or page.header.overlay_image %}--overlay{% endif %}"
-  style="{% if page.header.overlay_color %}background-color: {{ page.header.overlay_color | default: 'transparent' }};{% endif %} {% if overlay_img_path %}background-image: {% if overlay_filter %}{{ overlay_filter }}, {% endif %}url('{{ overlay_img_path }}');{% endif %}"
->
+  style="
+    {% if page.header.overlay_color %}
+      background-color: {{ page.header.overlay_color | default: '#33205c' }};
+    {% endif %}
+    {% if overlay_img_path %}
+      background-image: image-set(
+        url('{{ overlay_img_path | replace: '.png', '.webp' }}') 1x,
+        url('{{ overlay_img_path }}') type('image/png') 2x
+      );
+    {% endif %}
+">
   {% if page.header.overlay_color or page.header.overlay_image %}
     <div class="wrapper">
       <h1 id="page-title" class="page__title" itemprop="headline">

_pages/about-peer-review.md

@@ -3,8 +3,7 @@ layout: splash
 permalink: /about-peer-review/
 title: "pyOpenSci Makes Python Software Better and Easier to Find Through Peer Review"
 header:
-  overlay_image: images/header.png
-  overlay_filter: 0.8
+  overlay_image: images/headers/pyos-peer-review-header.png
 intro:
   - excerpt: "Our open peer review process makes scientific software better and easier to discover. [Check out our accepted packages.](https://www.pyopensci.org/python-packages.html)"
 benefits_scientists:
@@ -16,7 +15,7 @@ benefits_scientists:
     btn_label: Learn more about scientific Python community partnerships
     btn_class: btn--primary
 benefits_maintainers:
-  - image_path: images/landing-pages/pyopensci-supports-maintainers.png
+  - image_path: images/landing-pages/peer-review-supports-maintainers.png
     alt: "A pencil sketch of a round table with people sitting around it from different backgrounds working on laptops and also writing together."
     excerpt: "The pyOpenSci peer review process multiplies shared knowledge, making it easier for Pythonistas of all levels to accomplish challenging tasks, such as navigating the Python packaging ecosystem, with relative ease. And our diverse community supports scientific package maintainers in their efforts to develop and build robust software."
     title: "Peer review benefits open source maintainers"

_pages/contributors.md

@@ -5,7 +5,7 @@ title: "The pyOpenSci Team & Contributors"
 excerpt: "pyOpenSci is a diverse community of people interested in building a community of practice around scientific software written in Python."
 classes:
 header:
-  overlay_image: images/header.png
+  overlay_image: images/headers/pyopensci-learn-header.png
   overlay_filter: 0.6
 redirect_from:
   - /contributors.html

_pages/events.md

@@ -5,7 +5,7 @@ classes: wide
 title: "pyOpenSci Events"
 excerpt: "pyOpenSci holds events that support scientists developing open science skills."
 header:
-  overlay_image: images/headers/scipy-2024-workshop.png
+  overlay_image: images/headers/pyopensci-learn-header.png
   overlay_filter: rgba(20, 13, 36, 0.8)
 author_profile: false
 ---

_pages/home.md

@@ -1,13 +1,13 @@
 ---
 layout: splash
 title: "Welcome to pyOpenSci"
-excerpt: "We make it easier for scientists to create, find, maintain and contribute to reusable code and software."
+excerpt: "We make it easier for scientists to create, find, maintain, and contribute to reusable code and software."
 author_profile: false
 published: true
 site-map: true
 permalink: /
 header:
-  overlay_image: /images/people/header-mentored-sprints-smaller.png
+  overlay_image: /images/headers/pyopensci-sprints.png
   overlay_filter: 0.7
   actions:
     - label: "Submit a Package"

_pages/how-to-submit-package.md

@@ -2,8 +2,7 @@
 layout: single
 title: "How to submit a Python package to pyOpenSci for review"
 header:
-  overlay_image: images/header.png
-  overlay_filter: 0.8
+  overlay_image: images/headers/pyos-peer-review-header.png
 author_profile: false
 published: true
 site-map: true

_pages/packaging-resources.md

@@ -5,7 +5,7 @@ permalink: /python-packaging-science.html
 title: "Python packaging resources for scientists"
 excerpt: "We make the Python package ecosystem easier to navigate through peer review and packaging resources."
 header:
-  overlay_image: images/header.png
+  overlay_image: images/headers/pyopensci-software.png
   overlay_filter: 0.8
 intro:
   - excerpt: "There are many tools and approaches that can be used to create a Python package. We build resources that help you both understand the tool ecosystem and also learn how to create a Python package using modern best practices."

_pages/partners.md

@@ -4,8 +4,7 @@ permalink: /partners.html
 title: "pyOpenSci Community Partners: affiliated package review"
 classes: flowing
 header:
-  overlay_image: images/header.png
-  overlay_filter: 0.6
+  overlay_image: images/headers/pyos-peer-review-header.png
 intro:
   - excerpt: "More here on community partners."
 scientists:

_pages/python-packages.md

@@ -4,8 +4,7 @@ permalink: /python-packages.html
 title: "pyOpenSci Open Peer Review & Accepted Packages"
 classes:
 header:
-    overlay_image: images/header.png
-    overlay_filter: 0.6
+    overlay_image: images/headers/pyopensci-software.png
 intro:
     - excerpt: "The Python packages below have
     been accepted into the pyOpenSci ecosystem through our [open software peer review process](/about-peer-review/)."

_posts/2019-10-25-welcome-to-pyopensci.md

@@ -5,8 +5,7 @@ excerpt: "pyOpenSci is a community organization devoted to the development of ro
 author: "Leah Wasser"
 permalink: blog/welcome-to-pyopensci/
 header:
-    overlay_filter: 0.6
-    overlay_color: "#333"
+  overlay_color: "#33205c"
 categories:
   - updates
   - blog-post