Add GitHub logos

core/models.py

@@ -1,3 +1,4 @@
+from itertools import chain
 from django.db import models
 from django.db.models import Q
 from django.contrib.auth.models import User
@@ -46,6 +47,16 @@ def __str__(self):
     def is_published(self):
         return self.published_at and self.published_at >= timezone.now()
 
+    @property
+    def url_providers(self):
+        documentation_items =  self.documentationitem_set.all()
+        schema_refs = self.schemaref_set.all()
+        provider_names = {
+            reference_item.url_provider_info.provider_name
+            for reference_item in chain(documentation_items, schema_refs)
+        }
+        return provider_names
+
     def _latest_documentation_item_of_type(self, role):
         return self.documentationitem_set.filter(role=role).order_by('-created_at').first()
 

core/static/css/site.css

@@ -51,6 +51,12 @@ a:hover {
   color: var(--text-link-color-highlight);
 }
 
+.text-with-icon {
+  display: flex;
+  align-items: center;
+  gap: 0.25rem;
+}
+
 input,
 select {
   border-radius: 8px;
@@ -557,6 +563,15 @@ a.badge--w3c {
   color: #005a9c;
 }
 
+.badge--github {
+  padding: 0;
+}
+
+.badge--github svg {
+  width: 1.5rem;
+  height: 1.5rem;
+}
+
 .info-box {
   background: #172554;
   color: #bfdbfe;
@@ -740,6 +755,11 @@ a.badge--w3c {
   color: var(--text-secondary);
 }
 
+.schema-layout .schema-layout__extra .badges {
+  display: flex;
+  flex-wrap: wrap;
+}
+
 .schema-layout .schema-layout__extra .detail-list,
 .schema-layout .schema-layout__extra .detail-list li {
   display: flex;

core/templates/core/index.html

@@ -56,22 +56,20 @@ <h2>A public schema registry</h2>
       {% for schema in schemas %}
       <li class="schema">
         <a href="{% url 'schema_detail' schema_id=schema.id %}">{{ schema.name }}</a>
-        {% if schema.latest_rfc %}
         <ul class="schema__badges">
+          {% if schema.latest_rfc %}
           <li class="badge badge--rfc">
             <i data-lucide="file-text" class="icon--sm"></i>
             RFC
           </li>
-        </ul>
-        {% endif %}
-        {% if schema.latest_w3c %}
-        <ul class="schema__badges">
+          {% endif %}
+          {% if schema.latest_w3c %}
           <li class="badge badge--w3c">
             <i data-lucide="file-text" class="icon--sm"></i>
             W3C
           </li>
+          {% endif %}
         </ul>
-        {% endif %}
       </li>
       {% endfor %}
     </ul>

core/templates/core/schemas/detail.html

@@ -1,25 +1,41 @@
 {% extends "core/schemas/layout.html" %}
+{% load filters %}
 {% block head_title %}
 {{ schema.name }} - Schemas.Pub
 {% endblock %}
 
 {% block schema_content %}
 <div>
-  {% if latest_readme_format == 'markdown' %}
+  {% if latest_readme.format == 'markdown' %}
   <div class="markdown">
     {{ latest_readme_content }}
   </div>
-  {% elif latest_readme_format == 'plaintext' %}
+  <hr />
+  <div class="external-readme-link">
+    <a href="{{ latest_readme|try_github_repo_url }}" class="text-with-icon">
+      View source
+      {{ latest_readme|branded_external_link_icon_for_reference_item }}
+    </a>
+  </div>
+  {% elif latest_readme.format == 'plaintext' %}
   <div class="plaintext">
     {{ latest_readme_content }}
   </div>
-  {% elif latest_readme_url %}
+  <hr />
+  <div class="external-readme-link">
+    <a href="{{ latest_readme|try_github_repo_url }}" class="text-with-icon">
+      View source
+      {{ latest_readme|branded_external_link_icon_for_reference_item }}
+    </a>
+  </div>
+  {% elif latest_readme %}
   <div class="external-readme-link">
-    <a href="{{ latest_readme_url }}">View external README
-      <i data-lucide="external-link" class="icon--sm"></i>
+    <a href="{{ latest_readme|try_github_repo_url }}" class="text-with-icon">
+      View external README
+      {{ latest_readme|branded_external_link_icon_for_reference_item }}
     </a>
   </div>
-    {% endif %}
+  {% endif %}
 </div>
 {% endblock %}
 

core/templates/core/schemas/detail_schema_ref.html

@@ -1,4 +1,5 @@
 {% extends "core/schemas/layout.html" %}
+{% load filters %}
 {% load static %}
 {% block extra_head %}
 <script src="{% static 'js/initialize-syntax-highlighting.js' %}"></script>
@@ -28,8 +29,9 @@ <h2>Unnamed definition</h2>
   <!-- Please don't add whitespace to this line!-->
   <pre class="schema-definition"><code>{{ schema_ref.content|escape }}</code></pre>
   {% endif %}
+  <hr />
   <p>
-    <a href="{{ schema_ref.url }}">View source</a>
+    <a href="{{ schema_ref|try_github_repo_url }}" class="text-with-icon">View source{{ schema_ref|branded_external_link_icon_for_reference_item }}</a>
   </p>
 </div>
 {% endblock %}

core/templates/core/schemas/layout.html

@@ -50,9 +50,9 @@ <h1>
       <ul class="nav-group">
         {% for documentation_item in schema.additional_documentation_items.all %}
         <li>
-          <a href="{{ documentation_item.url }}">
+          <a href="{{ documentation_item|try_github_repo_url }}">
             {{ documentation_item.name }}
-            <i data-lucide="external-link" class="icon--sm"></i>
+            {{ documentation_item|branded_external_link_icon_for_reference_item }}
           </a>
         </li>
         {% endfor %}
@@ -91,13 +91,34 @@ <h1>
     {% endblock %}
   </main>
   <aside class="schema-layout__extra">
+    {% if schema.latest_rfc or schema.latest_w3c or 'GitHub' in schema.url_providers %}
+    <ul class="badges">
+      {% if 'GitHub' in schema.url_providers %}
+      <li class="badge badge--github">
+        {% include "core/icons/GitHub_Invertocat_Light.svg" %}
+      </li>
+      {% endif %}
+      {% if schema.latest_rfc %}
+      <li class="badge badge--rfc">
+        <i data-lucide="file-text" class="icon--sm"></i>
+        RFC
+      </li>
+      {% endif %}
+      {% if schema.latest_w3c %}
+      <li class="badge badge--w3c">
+        <i data-lucide="file-text" class="icon--sm"></i>
+        W3C
+      </li>
+      {% endif %}
+    </ul>
+    {% endif %}
     {% if latest_license %}
     Details
     <ul class="detail-list">
       <li>
-        <a href="{{ latest_license.url }}">
+        <a href="{{ latest_license|try_github_repo_url }}" class="text-with-icon">
           License
-          <i data-lucide="external-link" class="icon--sm"></i>
+          {{ latest_license|branded_external_link_icon_for_reference_item }}
         </a>
       </li>
     </ul>

core/templatetags/filters.py

@@ -1,9 +1,62 @@
 from django import template
 from django.utils import timezone
+from django.utils.safestring import mark_safe
+from core.models import GitHubURLInfo
 
 register = template.Library()
 
 @register.filter
 def exists_and_is_in_past(value):
     return value != None and value.timestamp() <= timezone.now().timestamp()
 
+#"GitHub_Invertocat_Light.svg" from https://brand.github.com/foundations/logo
+GITHUB_LOGO = '''<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 28.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 97.6 96" style="enable-background:new 0 0 97.6 96;" xml:space="preserve" class="icon--sm">
+<style type="text/css">
+	.st0{fill:#FFFFFF;}
+</style>
+<path class="st0" d="M48.9,0C21.8,0,0,22,0,49.2C0,71,14,89.4,33.4,95.9c2.4,0.5,3.3-1.1,3.3-2.4c0-1.1-0.1-5.1-0.1-9.1
+	c-13.6,2.9-16.4-5.9-16.4-5.9c-2.2-5.7-5.4-7.2-5.4-7.2c-4.4-3,0.3-3,0.3-3c4.9,0.3,7.5,5.1,7.5,5.1c4.4,7.5,11.4,5.4,14.2,4.1
+	c0.4-3.2,1.7-5.4,3.1-6.6c-10.8-1.1-22.2-5.4-22.2-24.3c0-5.4,1.9-9.8,5-13.2c-0.5-1.2-2.2-6.3,0.5-13c0,0,4.1-1.3,13.4,5.1
+	c3.9-1.1,8.1-1.6,12.2-1.6s8.3,0.6,12.2,1.6c9.3-6.4,13.4-5.1,13.4-5.1c2.7,6.8,1,11.8,0.5,13c3.2,3.4,5,7.8,5,13.2
+	c0,18.9-11.4,23.1-22.3,24.3c1.8,1.5,3.3,4.5,3.3,9.1c0,6.6-0.1,11.9-0.1,13.5c0,1.3,0.9,2.9,3.3,2.4C83.6,89.4,97.6,71,97.6,49.2
+	C97.7,22,75.8,0,48.9,0z"/>
+</svg>'''
+
+@register.filter(is_safe=True)
+def branded_external_link_icon_for_reference_item(reference_item):
+    """
+    Returns a branded icon matching the Reference Item's URL if possible,
+    or a fallback icon otherwise.
+    """
+    if reference_item.url_provider_info.provider_name == GitHubURLInfo.provider_name:
+        return mark_safe(GITHUB_LOGO)
+    return mark_safe('<i data-lucide="external-link" class="icon--sm"></i>')
+
+
+@register.filter()
+def try_github_repo_url(reference_item):
+    """
+    If the Reference Item's URL is from GitHub, tries to return its
+    repo url. If it's not from GitHub or the repo URL is None,
+    just returns the URL.
+    """
+    provider_info = reference_item.url_provider_info
+    if provider_info.provider_name == GitHubURLInfo.provider_name and provider_info.repo_url:
+        return provider_info.repo_url
+    return reference_item.url
+
+
+@register.filter()
+def try_github_raw_url(reference_item):
+    """
+    If the Reference Item's URL is from GitHub, tries to return its
+    raw url. If it's not from GitHub or the raw URL is None,
+    just returns the URL.
+    """
+    provider_info = reference_item.url_provider_info
+    if provider_info.provider_name == GitHubURLInfo.provider_name and provider_info.raw_url:
+        return provider_info.raw_url
+    return reference_item.url

core/views.py

@@ -125,9 +125,8 @@ def schema_detail(request, schema):
 
     return render(request, "core/schemas/detail.html", {
         "schema": schema,
-        "latest_readme_format": latest_readme.format if latest_readme else None,
+        "latest_readme": latest_readme,
         "latest_readme_content": latest_readme_content,
-        "latest_readme_url": latest_readme.url if latest_readme else None,
         "latest_license": schema.latest_license()
     })