BTHLABS-66: Prepping for public release: Take four

Apple gonna Apple... ;)

services/backend/hotpocket_backend/apps/ui/templates/ui/page.html

@@ -130,6 +130,56 @@
             {% translate 'Log out' %}
           </a>
         </li>
+        <li class="nav-item px-3 d-flex justify-content-center">
+          {% spaceless %}
+            <a
+              class="btn btn-outline-info btn-sm"
+              href="https://apps.apple.com/pl/app/hotpocket-by-bthlabs/id6752321380"
+              rel="noopener noreferrer"
+              target="_blank"
+              title="{% translate 'Safari and Share extension for iOS and macOS' %}"
+            >
+              <i class="bi bi-apple"></i> 
+            </a>
+            <a
+              class="btn btn-outline-info btn-sm ms-1"
+              href="https://chromewebstore.google.com/detail/save-to-hotpocket/mkmoejhhgnadmijpgkkioicjmikkkjbd"
+              rel="noopener noreferrer"
+              target="_blank"
+              title="{% translate 'Chrome extension' %}"
+            >
+              <i class="bi bi-browser-chrome"></i> 
+            </a>
+            <a
+              class="btn btn-outline-info btn-sm ms-1"
+              href="https://addons.mozilla.org/en-GB/firefox/addon/save-to-hotpocket/"
+              rel="noopener noreferrer"
+              target="_blank"
+              title="{% translate 'Firefox extension' %}"
+            >
+              <i class="bi bi-browser-firefox"></i> 
+            </a>
+            <a
+              class="btn btn-outline-info btn-sm ms-1"
+              data-bs-toggle="modal"
+              data-bs-target="#modalPWA"
+              href="#"
+              title="{% translate 'Android PWA' %}"
+            >
+              <i class="bi bi-android2"></i> 
+            </a>
+            <div class="vr my-1 ms-1 opacity-75"></div>
+            <a
+              class="btn btn-outline-info btn-sm ms-1"
+              href="https://git.bthlabs.pl/tomekwojcik/hotpocket"
+              rel="noopener noreferrer"
+              target="_blank"
+              title="{% translate 'Source code repository' %}"
+            >
+              <i class="bi bi-git"></i> 
+            </a>
+          {% endspaceless %}
+        </li>
       {% else %}
         <li class="nav-item">
           <a class="nav-link" href="{% url 'ui.accounts.login' %}">
@@ -142,6 +192,38 @@
     {% include "ui/ui/partials/uname.html" %}
   </div>
 </div>
+
+{% if not request.user.is_anonymous %}
+  <div class="modal modal-fade" id="modalPWA" tabindex="-1">
+    <div class="modal-dialog">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h1 class="modal-title fs-5" id="modalPWALabel">
+            {% translate 'HotPocket on Android and others' %}
+          </h1>
+          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+        </div>
+        <div class="modal-body">
+          <p class="mb-1">
+            {% blocktranslate %}
+              HotPocket doesn't natively support Android and other systems. However, it's a Progressive Web Application. You can install it from your browser and it'll register itself as share target.
+            {% endblocktranslate %}
+          </p>
+          <p class="mb-0">
+            {% blocktranslate %}
+              This is currently supported on Android and Windows 11 (when installed using Edge).
+            {% endblocktranslate %}
+          </p>
+        </div>
+        <div class="modal-footer">
+          <button type="button" class="btn btn-primary" data-bs-dismiss="modal">
+            {% translate 'Cool' %}
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+{% endif %}
 {% endblock %}
 
 {% block scripts %}