From e70478711a1c0aeeea0e516e187c127364a8c634 Mon Sep 17 00:00:00 2001
From: Sunil Mohan Adapa <sunil@medhas.org>
Date: Thu, 12 Mar 2026 11:40:03 -0700
Subject: [PATCH] firstboot: Use inline SVG icons

Tests:

- All the icons appear as before in both light/dark themes.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
---
 .../first_boot/templates/firstboot_complete.html    | 13 +++++++------
 static/themes/default/css/main.css                  |  5 ++---
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/plinth/modules/first_boot/templates/firstboot_complete.html b/plinth/modules/first_boot/templates/firstboot_complete.html
index c05747a51..d3a7217a6 100644
--- a/plinth/modules/first_boot/templates/firstboot_complete.html
+++ b/plinth/modules/first_boot/templates/firstboot_complete.html
@@ -5,6 +5,7 @@
 
 {% load bootstrap %}
 {% load i18n %}
+{% load plinth_extras %}
 
 {% block breadcrumbs %}
 {% endblock %}
@@ -15,7 +16,7 @@
 
   <ol class='next-steps'>
     <li>
-      <div class="app-icon fa fa-refresh"></div>
+      {% icon 'refresh' class='svg-icon app-icon' %}
       <div class="step-text">
         {% url 'upgrades:index' as upgrades_url %}
         {% blocktrans trimmed %}
@@ -33,7 +34,7 @@
     </li>
 
     <li>
-      <div class="app-icon fa fa-eye-slash"></div>
+      {% icon 'eye-slash' class='svg-icon app-icon' %}
       <div class="step-text">
         {% url 'privacy:index' as privacy_url %}
         {% blocktrans trimmed %}
@@ -43,7 +44,7 @@
     </li>
 
     <li>
-      <div class="app-icon fa fa-signal"></div>
+      {% icon 'signal' class='svg-icon app-icon' %}
       <div class="step-text">
         {% url 'networks:index' as networks_url %}
         {% blocktrans trimmed %}
@@ -54,7 +55,7 @@
     </li>
 
     <li>
-      <div class="app-icon fa fa-tags"></div>
+      {% icon 'tags' class='svg-icon app-icon' %}
       <div class="step-text">
         {% url 'names:index' as names_url %}
         {% blocktrans trimmed %}
@@ -64,7 +65,7 @@
     </li>
 
     <li>
-      <div class="app-icon fa fa-files-o"></div>
+      {% icon 'files-o' class='svg-icon app-icon' %}
       <div class="step-text">
         {% url 'backups:index' as backups_url %}
         {% blocktrans trimmed %}
@@ -75,7 +76,7 @@
     </li>
 
     <li>
-      <div class="app-icon fa fa-th"></div>
+      {% icon 'th' class='svg-icon app-icon' %}
       <div class="step-text">
         {% url 'apps' as apps_url %}
         {% blocktrans trimmed %}
diff --git a/static/themes/default/css/main.css b/static/themes/default/css/main.css
index 0210344de..dc916eaba 100644
--- a/static/themes/default/css/main.css
+++ b/static/themes/default/css/main.css
@@ -699,10 +699,9 @@ footer {
 }
 
 .next-steps .app-icon {
-    font-size: 3rem;
-    margin-right: 1rem;
+    margin: 0.375rem 1rem 0.375rem 0;
     width: 3rem;
-    text-align: center;
+    height: auto;
 }
 
 .next-steps form {