Add Open Collective to header (#27916)

_config.yml

@@ -38,6 +38,7 @@ current_ruby_version: 4.2.1
 docs_version:         4.2
 repo:                 "https://github.com/twbs/bootstrap"
 slack:                "https://bootstrap-slack.herokuapp.com"
+opencollective:       "https://opencollective.com/bootstrap"
 blog:                 "https://blog.getbootstrap.com"
 expo:                 "https://expo.getbootstrap.com"
 themes:               "https://themes.getbootstrap.com"

site/_includes/docs-navbar.html

@@ -60,6 +60,11 @@
         {%- include icons/slack.svg class="navbar-nav-svg" -%}
       </a>
     </li>
+    <li class="nav-item">
+      <a class="nav-link p-2" href="{{ site.opencollective }}/" target="_blank" rel="noopener" aria-label="Open Collective">
+        {%- include icons/opencollective.svg class="navbar-nav-svg" -%}
+      </a>
+    </li>
   </ul>
 
   <a class="btn btn-bd-download d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="{{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/download/">Download</a>

site/_includes/icons/opencollective.svg

@@ -0,0 +1 @@
+<svg{% if include.class %} class="{{ include.class }}"{% endif %} xmlns="http://www.w3.org/2000/svg" viewbox="0 0 40 41"{% if include.width %} width="{{ include.width }}"{% endif %}{% if include.height %} height="{{ include.height }}"{% endif %} focusable="false" role="img" fill="currentColor" fill-rule="evenodd"><title>Open Collective</title><path d="M32.8 21c0 2.4-.8 4.9-2 6.9l5.1 5.1c2.5-3.4 4.1-7.6 4.1-12 0-4.6-1.6-8.8-4-12.2L30.7 14c1.2 2 2 4.3 2 7z" fill-opacity=".4"/><path d="M20 33.7a12.8 12.8 0 0 1 0-25.6c2.6 0 5 .7 7 2.1L32 5a20 20 0 1 0 .1 31.9l-5-5.2a13 13 0 0 1-7 2z"/></svg>