Add vendor support details to Ecosystem page

data/ecosystem.yml

@@ -121,6 +121,21 @@ ecosystem:
       logo: "sigma-logo.png"
     - name: "Snowflake"
       logo: "snowflake-logo.png"
+      details:
+        description: "Snowflake is committed to keeping Semantic Views and other semantic context interoperable with Apache Ossie."
+        features:
+          - title: "Export to Ossie"
+            description: "Convert any Snowflake Semantic View to an Ossie YAML file."
+            url: "https://docs.snowflake.com/en/sql-reference/functions/system_read_ossie_yaml_from_semantic_view"
+            url_label: "Documentation"
+          - title: "Import from Ossie"
+            description: "Create a Snowflake Semantic View from an Ossie YAML file."
+            url: "https://docs.snowflake.com/en/sql-reference/stored-procedures/system_create_semantic_view_from_ossie_yaml"
+            url_label: "Documentation"
+          - title: "Snowflake Converter"
+            description: "Programmatic conversion tooling maintained in the Ossie repository."
+            url: "https://github.com/apache/ossie/tree/main/converters/snowflake"
+            url_label: "View on GitHub"
     - name: "Starburst Data"
       logo: "starburst-logo.png"
     - name: "Strategy"

docs/assets/javascripts/ecosystem.js

@@ -0,0 +1,40 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+document.addEventListener("DOMContentLoaded", function () {
+  document.querySelectorAll(".ossie-details-link").forEach(function (btn) {
+    btn.addEventListener("click", function () {
+      var name = btn.getAttribute("data-vendor").toLowerCase().replace(/ /g, "-");
+      var modal = document.getElementById("modal-" + name);
+      if (modal) modal.showModal();
+    });
+  });
+
+  document.querySelectorAll(".ossie-vendor-modal__close").forEach(function (btn) {
+    btn.addEventListener("click", function () {
+      btn.closest("dialog").close();
+    });
+  });
+
+  document.querySelectorAll(".ossie-vendor-modal").forEach(function (modal) {
+    modal.addEventListener("click", function (e) {
+      if (e.target === modal) modal.close();
+    });
+  });
+});

docs/assets/stylesheets/home.css

@@ -768,3 +768,141 @@
   font-size: 0.8rem;
   line-height: 1.6;
 }
+
+
+/* ==========================================================================
+   Ecosystem — Vendor Details Modal
+   ========================================================================== */
+
+.ossie-details-link {
+  background: none;
+  border: none;
+  color: var(--ossie-blue, #2563eb);
+  font-size: 0.6rem;
+  font-weight: 500;
+  cursor: pointer;
+  margin-top: 0.25rem;
+  padding: 0;
+  border-radius: 4px;
+  transition: color 0.15s;
+  line-height: 1;
+}
+
+.ossie-details-link:hover {
+  color: var(--ossie-blue-dark, #1d4ed8);
+  text-decoration: underline;
+}
+
+.ossie-vendor-modal {
+  border: none;
+  border-radius: 12px;
+  padding: 0;
+  max-width: 520px;
+  width: 90vw;
+  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.2);
+  animation: ossie-modal-in 0.2s ease-out;
+}
+
+.ossie-vendor-modal::backdrop {
+  background: rgba(0, 0, 0, 0.5);
+  animation: ossie-backdrop-in 0.2s ease-out;
+}
+
+@keyframes ossie-modal-in {
+  from { opacity: 0; transform: translateY(16px) scale(0.97); }
+  to   { opacity: 1; transform: translateY(0) scale(1); }
+}
+
+@keyframes ossie-backdrop-in {
+  from { opacity: 0; }
+  to   { opacity: 1; }
+}
+
+.ossie-vendor-modal__content {
+  padding: 1.25rem 1.5rem;
+  position: relative;
+}
+
+.ossie-vendor-modal__header {
+  display: flex;
+  align-items: flex-start;
+  margin-bottom: 0.75rem;
+  padding-bottom: 0.75rem;
+  border-bottom: 1px solid var(--ossie-gray-200, #e2e8f0);
+}
+
+.ossie-vendor-modal__logo {
+  max-width: 160px;
+  max-height: 50px;
+  object-fit: contain;
+}
+
+.ossie-vendor-modal__title {
+  font-size: 1rem;
+  font-weight: 700;
+  margin: 0;
+  flex: 1;
+}
+
+.ossie-vendor-modal__close {
+  background: none;
+  border: none;
+  font-size: 1rem;
+  cursor: pointer;
+  color: var(--ossie-gray-500, #6c757d);
+  line-height: 1;
+  padding: 0.15rem 0.35rem;
+  border-radius: 4px;
+  position: absolute;
+  top: 0.75rem;
+  right: 0.75rem;
+}
+
+.ossie-vendor-modal__close:hover {
+  background: var(--ossie-gray-100, #f1f5f9);
+}
+
+.ossie-vendor-modal__desc {
+  font-size: 0.72rem;
+  color: var(--ossie-gray-700, #374151);
+  line-height: 1.6;
+  margin-bottom: 1.25rem;
+}
+
+.ossie-vendor-modal__features {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
+.ossie-vendor-modal__features li {
+  display: flex;
+  flex-direction: column;
+  gap: 0.15rem;
+  padding: 0.75rem 1rem;
+  background: var(--ossie-gray-50, #f8fafc);
+  border-radius: 8px;
+}
+
+.ossie-vendor-modal__features li strong {
+  font-size: 0.68rem;
+}
+
+.ossie-vendor-modal__features li span {
+  font-size: 0.64rem;
+  color: var(--ossie-gray-600, #4b5563);
+}
+
+.ossie-vendor-modal__features li a {
+  font-size: 0.64rem;
+  font-weight: 500;
+  color: var(--ossie-blue, #2563eb);
+  text-decoration: none;
+}
+
+.ossie-vendor-modal__features li a:hover {
+  text-decoration: underline;
+}

overrides/ecosystem.html

@@ -51,9 +51,40 @@ <h1 class="ossie-section-heading text-center mb-2">Ecosystem</h1>
                      loading="lazy"
                      class="ossie-member-card__logo">
                 <span class="ossie-member-card__name mt-2">{{ vendor.name }}</span>
+                {% if vendor.details %}
+                  <button class="ossie-details-link" data-vendor="{{ vendor.name | e }}">See Details</button>
+                {% endif %}
               </div>
             </div>
           </div>
+          {% if vendor.details %}
+          <dialog class="ossie-vendor-modal" id="modal-{{ vendor.name | lower | replace(' ', '-') }}">
+            <div class="ossie-vendor-modal__content">
+              <div class="ossie-vendor-modal__header">
+                <img src="{{ ('assets/images/logos/' ~ vendor.logo) | url }}"
+                     alt="{{ vendor.name }}"
+                     class="ossie-vendor-modal__logo">
+                <button class="ossie-vendor-modal__close" aria-label="Close">&times;</button>
+              </div>
+              {% if vendor.details.description %}
+                <p class="ossie-vendor-modal__desc">{{ vendor.details.description }}</p>
+              {% endif %}
+              {% if vendor.details.features %}
+                <ul class="ossie-vendor-modal__features">
+                  {% for feature in vendor.details.features %}
+                    <li>
+                      <strong>{{ feature.title }}</strong>
+                      <span>{{ feature.description }}</span>
+                      {% if feature.url %}
+                        <a href="{{ feature.url }}" target="_blank" rel="noopener">{{ feature.url_label | default("Learn more") }} &rarr;</a>
+                      {% endif %}
+                    </li>
+                  {% endfor %}
+                </ul>
+              {% endif %}
+            </div>
+          </dialog>
+          {% endif %}
         {% endfor %}
       </div>
 
@@ -71,3 +102,8 @@ <h1 class="ossie-section-heading text-center mb-2">Ecosystem</h1>
 {% block content %}
   {{ super() }}
 {% endblock %}
+
+{% block scripts %}
+  {{ super() }}
+  <script src="{{ 'assets/javascripts/ecosystem.js' | url }}"></script>
+{% endblock %}