feat: increase privacy by not sending referrer to external urls

feat: small layout change on the about page
feat: add update notification and release notes to the about page

about.php

@@ -1,92 +1,138 @@
 <?php
 require_once 'includes/header.php';
+
+$wallosIsUpToDate = true;
+if (!is_null($settings['latest_version'])) {
+    $latestVersion = $settings['latest_version'];
+    if (version_compare($version, $latestVersion) == -1) {
+        $wallosIsUpToDate = false;
+    }
+}
 ?>
 
 <section class="contain">
 
     <section class="account-section">
         <header>
-            <h2><?= translate('about_and_credits', $i18n) ?></h2>
+            <h2><?= translate('about', $i18n) ?></h2>
         </header>
         <div class="credits-list">
-            <h3><?= translate('about', $i18n) ?></h3>
+            <div>
-            <p>Wallos <?= $version ?> <?= $demoMode ? "Demo" : "" ?></p>
+                <h3>
-            <p><?= translate('license', $i18n) ?>:
+                    Wallos <?= $version ?> <?= $demoMode ? "Demo" : "" ?>
+                </h3>
+                <span>
+                    <?= translate('release_notes', $i18n) ?>
+                    <a href="https://github.com/ellite/Wallos/releases/tag/<?= $version ?>" target="_blank"
+                        title="<?= translate('external_url', $i18n) ?>" rel="noreferrer">
+                        <i class="fa-solid fa-arrow-up-right-from-square"></i>
+                    </a>
+                </span>
+            </div>
+            <?php if (!$wallosIsUpToDate): ?>
+                <div class="update-available">
+                    <h3>
+                        <i class="fa-solid fa-info-circle"></i>
+                        <?= translate('update_available', $i18n) ?> <?= $latestVersion ?>
+                    </h3>
+                    <span>
+                        <?= translate('release_notes', $i18n) ?>
+                        <a href="https://github.com/ellite/Wallos/releases/tag/<?= $latestVersion ?>" target="_blank"
+                            title="<?= translate('external_url', $i18n) ?>" rel="noreferrer">
+                            <i class="fa-solid fa-arrow-up-right-from-square"></i>
+                        </a>
+                    </span>
+                </div>
+            <?php endif; ?>
+            <div>
+                <h3><?= translate('license', $i18n) ?></h3>
                 <span>
                     GPLv3
                     <a href="https://www.gnu.org/licenses/gpl-3.0.en.html" target="_blank"
-                        title="<?= translate('external_url', $i18n) ?>">
+                        title="<?= translate('external_url', $i18n) ?>" rel="noreferrer">
                         <i class="fa-solid fa-arrow-up-right-from-square"></i>
                     </a>
                 </span>
-            </p>
+            </div>
-            <p>
+            <div>
-                <?= translate('issues_and_requests', $i18n) ?>:
+                <h3><?= translate('issues_and_requests', $i18n) ?></h3>
                 <span>
                     GitHub
                     <a href="https://github.com/ellite/Wallos/issues" target="_blank"
-                        title="<?= translate('external_url', $i18n) ?>">
+                        title="<?= translate('external_url', $i18n) ?>" rel="noreferrer">
                         <i class="fa-solid fa-arrow-up-right-from-square"></i>
                     </a>
                 </span>
-            </p>
+            </div>
-            <p>
+            <div>
-                <?= translate('the_author', $i18n) ?>:
+                <h3><?= translate('the_author', $i18n) ?></h3>
                 <span>
                     https://henrique.pt
-                    <a href="https://henrique.pt/" target="_blank" title="<?= translate('external_url', $i18n) ?>">
+                    <a href="https://henrique.pt/" target="_blank" title="<?= translate('external_url', $i18n) ?>"
+                        rel="noreferrer">
                         <i class="fa-solid fa-arrow-up-right-from-square"></i>
                     </a>
                 </span>
-            </p>
+            </div>
-            <h3><?= translate('credits', $i18n) ?></h3>
+
-            <p>
+        </div>
-                <?= translate('icons', $i18n) ?>:
+    </section>
+
+    <section class="account-section">
+        <header>
+            <h2><?= translate("credits", $i18n) ?></h2>
+        </header>
+        <div class="credits-list">
+            <div>
+                <h3><?= translate('icons', $i18n) ?></h3>
                 <span>
                     https://www.streamlinehq.com/freebies/plump-flat-free
                     <a href="https://www.streamlinehq.com/freebies/plump-flat-free" target="_blank"
-                        title="<?= translate('external_url', $i18n) ?>">
+                        title="<?= translate('external_url', $i18n) ?>" rel="noreferrer">
                         <i class="fa-solid fa-arrow-up-right-from-square"></i>
                     </a>
                 </span>
-            </p>
+            </div>
-            <p>
+            <div>
-                <?= translate('payment_icons', $i18n) ?>:
+                <h3><?= translate('payment_icons', $i18n) ?></h3>
                 <span>
                     https://www.figma.com/file/5IMW8JfoXfB5GRlPNdTyeg/Credit-Cards-and-Payment-Methods-Icons-(Community)
                     <a href="https://www.figma.com/file/5IMW8JfoXfB5GRlPNdTyeg/Credit-Cards-and-Payment-Methods-Icons-(Community)"
-                        target="_blank" title="<?= translate('external_url', $i18n) ?>">
+                        target="_blank" title="<?= translate('external_url', $i18n) ?>" rel="noreferrer">
                         <i class="fa-solid fa-arrow-up-right-from-square"></i>
                     </a>
                 </span>
-            </p>
+            </div>
-            <p>
+            <div>
-                Chart.js:
+                <h3>Chart.js</h3>
                 <span>
                     https://www.chartjs.org/
-                    <a href="https://www.chartjs.org/" target="_blank" title="<?= translate('external_url', $i18n) ?>">
+                    <a href="https://www.chartjs.org/" target="_blank" title="<?= translate('external_url', $i18n) ?>"
+                        rel="noreferrer">
                         <i class="fa-solid fa-arrow-up-right-from-square"></i>
                     </a>
                 </span>
-            </p>
+            </div>
-            <p>
+            <div>
-                QRCode.js:
+                <h3>QRCode.js</h3>
                 <span>
                     https://github.com/davidshimjs/qrcodejs
-                    <a href="https://github.com/davidshimjs/qrcodejs" target="_blank" title="<?= translate('external_url', $i18n) ?>">
+                    <a href="https://github.com/davidshimjs/qrcodejs" target="_blank"
+                        title="<?= translate('external_url', $i18n) ?>" rel="noreferrer">
                         <i class="fa-solid fa-arrow-up-right-from-square"></i>
                     </a>
                 </span>
-            </p>
+            </div>
-            <p>
+            <div>
-                Icons by icons8:
+                <h3>Icons by icons8</h3>
                 <span>
                     https://icons8.com/
-                    <a href="https://icons8.com/" target="_blank" title="<?= translate('external_url', $i18n) ?>">
+                    <a href="https://icons8.com/" target="_blank" title="<?= translate('external_url', $i18n) ?>"
+                        rel="noreferrer">
                         <i class="fa-solid fa-arrow-up-right-from-square"></i>
                     </a>
                 </span>
-            </p>
+            </div>
         </div>
     </section>
 

includes/header.php

@@ -83,6 +83,7 @@ $mobileNavigation = $settings['mobile_nav'] ? "mobile-navigation" : "";
   <title>Wallos - Subscription Tracker</title>
   <meta name="apple-mobile-web-app-title" content="Wallos">
   <meta name="theme-color" content="<?= $theme == "light" ? "#FFFFFF" : "#222222" ?>" id="theme-color" />
+  <meta name="referrer" content="no-referrer">
   <link rel="icon" type="image/png" href="images/icon/favicon.ico" sizes="16x16">
   <link rel="apple-touch-icon" href="images/icon/apple-touch-icon.png">
   <link rel="apple-touch-icon" sizes="152x152" href="images/icon/apple-touch-icon-152.png">

includes/i18n/cs.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "O aplikaci a zásluhy",
     "credits" => "Zásluhy",
     "license" => "Licence",
+    "release_notes" => "Poznámky k vydání",
+    "update_available" => "Dostupná aktualizace",
     "issues_and_requests" => "Problémy a požadavky",
     "the_author" => "Autor",
     "icons" => "Ikony",

includes/i18n/de.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "Informationen und Danksagungen",
     "credits" => "Danksagungen",
     "license" => "Lizenz",
+    "release_notes" => "Versionshinweise",
+    "update_available" => "Update verfügbar",
     "issues_and_requests" => "Issues und Anfragen",
     "the_author" => "Der Autor",
     "icons" => "Icons",

includes/i18n/el.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "Σχετικά και Credits",
     "credits" => "Credits",
     "license" => "License",
+    "release_notes" => "Σημειώσεις έκδοσης",
+    "update_available" => "Διαθέσιμη ενημέρωση",
     "issues_and_requests" => "Προβλήματα και αιτήσεις",
     "the_author" => "Προγραμματιστής",
     "icons" => "Εικονίδια",

includes/i18n/en.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "About and Credits",
     "credits" => "Credits",
     "license" => "License",
+    "release_notes" => "Release Notes",
+    "update_available" => "Update Available",
     "issues_and_requests" => "Issues and Requests",
     "the_author" => "The author",
     "icons" => "Icons",

includes/i18n/es.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "Acerca de y Créditos",
     "credits" => "Créditos",
     "license" => "Licencia",
+    "release_notes" => "Notas de la Versión",
+    "update_available" => "Actualización Disponible",
     "issues_and_requests" => "Problemas y Solicitudes",
     "the_author" => "El autor",
     "icons" => "Iconos",

includes/i18n/fr.php

@@ -123,6 +123,8 @@ $i18n = [
     "about_and_credits" => "À propos et crédits",
     "credits" => "Crédits",
     "license" => "Licence",
+    "release_notes" => "Notes de version",
+    "update_available" => "Mise à jour disponible",
     "issues_and_requests" => "Problèmes et demandes",
     "the_author" => "L'auteur",
     "icons" => "Icônes",

includes/i18n/it.php

@@ -129,6 +129,8 @@ $i18n = [
     "about_and_credits" => 'Informazioni e crediti',
     "credits" => "Crediti",
     "license" => 'Licenza',
+    "release_notes" => "Note sulla versione",
+    "update_available" => "Aggiornamento disponibile",
     "issues_and_requests" => 'Problemi e richieste',
     "the_author" => "L'autore",
     "icons" => 'Icone',

includes/i18n/jp.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "概要とクレジット",
     "credits" => "クレジット",
     "license" => "ライセンス",
+    "release_notes" => "リリースノート",
+    "update_available" => "利用可能な更新",
     "issues_and_requests" => "問題と要望",
     "the_author" => "著者",
     "icons" => "アイコン",

includes/i18n/ko.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "개요 및 크레딧",
     "credits" => "크레딧",
     "license" => "라이선스",
+    "release_notes" => "릴리즈 노트",
+    "update_available" => "업데이트 가능",
     "issues_and_requests" => "이슈 및 요청",
     "the_author" => "제작자",
     "icons" => "아이콘",

includes/i18n/nl.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "Over en credits",
     "credits" => "Credits",
     "license" => "Licentie",
+    "release_notes" => "Release notes",
+    "update_available" => "Update beschikbaar",
     "issues_and_requests" => "Problemen en verzoeken",
     "the_author" => "De auteur",
     "icons" => "Iconen",

includes/i18n/pl.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "Informacje i podziękowania",
     "credits" => "Podziękowania",
     "license" => "Licencja",
+    "release_notes" => "Notatki wydania",
+    "update_available" => "Dostępna aktualizacja",
     "issues_and_requests" => "Problemy i prośby",
     "the_author" => "Autor",
     "icons" => "Ikony",

includes/i18n/pt.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "Sobre e Créditos",
     "credits" => "Créditos",
     "license" => "Licença",
+    "release_notes" => "Notas de Lançamento",
+    "update_available" => "Atualização Disponível",
     "issues_and_requests" => "Problemas e Pedidos",
     "the_author" => "O Autor",
     "icons" => "Ícones",

includes/i18n/pt_br.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "Sobre e Créditos",
     "credits" => "Créditos",
     "license" => "Licença",
+    "release_notes" => "Notas de lançamento",
+    "update_available" => "Atualização disponível",
     "issues_and_requests" => "Problemas e Pedidos",
     "the_author" => "O autor",
     "icons" => "Ícones",

includes/i18n/ru.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "О компании и авторах",
     "credits" => "Благодарности",
     "license" => "Лицензия",
+    "release_notes" => "Заметки о выпуске",
+    "update_available" => "Доступно обновление",
     "issues_and_requests" => "Проблемы и вопросы",
     "the_author" => "Автор",
     "icons" => "Значки",

includes/i18n/sl.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "O programu in zahvale",
     "credits" => "Zahvale",
     "license" => "Licenca",
+    "release_notes" => "Opombe o izdaji",
+    "update_available" => "Na voljo je posodobitev",
     "issues_and_requests" => "Težave in zahteve",
     "the_author" => "Avtor",
     "icons" => "Ikone",

includes/i18n/sr.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "О апликацији и заслугама",
     "credits" => "Заслуге",
     "license" => "Лиценца",
+    "release_notes" => "Белешке о издању",
+    "update_available" => "Доступно је ажурирање",
     "issues_and_requests" => "Проблеми и захтеви",
     "the_author" => "Аутор",
     "icons" => "Иконе",

includes/i18n/sr_lat.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "O aplikaciji i zasluge",
     "credits" => "Zasluge",
     "license" => "Licenca",
+    "release_notes" => "Beleške o izdanju",
+    "update_available" => "Dostupno ažuriranje",
     "issues_and_requests" => "Problemi i zahtevi",
     "the_author" => "Autor",
     "icons" => "Ikone",

includes/i18n/tr.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "Hakkında ve Teşekkürler",
     "credits" => "Teşekkürler",
     "license" => "Lisans",
+    "release_notes" => "Sürüm Notları",
+    "update_available" => "Güncelleme mevcut",
     "issues_and_requests" => "Sorunlar ve İstekler",
     "the_author" => "Yazar",
     "icons" => "İkonlar",

includes/i18n/uk.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "Про компанію та авторів",
     "credits" => "Подяки",
     "license" => "Ліцензія",
+    "release_notes" => "Примітки до випуску",
+    "update_available" => "Доступне оновлення",
     "issues_and_requests" => "Проблеми та запити",
     "the_author" => "Автор",
     "icons" => "Значки",

includes/i18n/vi.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "Giới thiệu và cảm ơn",
     "credits" => "Cảm ơn",
     "license" => "Giấy phép",
+    "release_notes" => "Ghi chú phát hành",
+    "update_available" => "Cập nhật có sẵn",
     "issues_and_requests" => "Vấn đề và yêu cầu",
     "the_author" => "Tác giả",
     "icons" => "Biểu tượng",

includes/i18n/zh_cn.php

@@ -129,6 +129,8 @@ $i18n = [
     "about_and_credits" => "关于和鸣谢",
     "credits" => "鸣谢",
     "license" => "许可证",
+    "release_notes" => "发布说明",
+    "update_available" => "可用更新",
     "issues_and_requests" => "问题反馈与功能请求",
     "the_author" => "作者",
     "icons" => "图标",

includes/i18n/zh_tw.php

@@ -122,6 +122,8 @@ $i18n = [
     "about_and_credits" => "關於和致謝",
     "credits" => "致謝",
     "license" => "授權條款",
+    "release_notes" => "版本資訊",
+    "update_available" => "有新版本可用",
     "issues_and_requests" => "問題回報與功能建議",
     "the_author" => "作者",
     "icons" => "圖示",

includes/list_subscriptions.php

@@ -272,7 +272,7 @@ function printSubscriptions($subscriptions, $sort, $categories, $members, $i18n,
                         }
                         ?>
                         <span class="url" title="<?= translate('external_url', $i18n) ?>"><a href="<?= $url ?>"
-                                target="_blank"><?php include $imagePath . "images/siteicons/svg/web.php"; ?></a></span>
+                                target="_blank" rel="noreferrer"><?php include $imagePath . "images/siteicons/svg/web.php"; ?></a></span>
                         <?php
                     }
                     ?>

includes/version.php

@@ -1,3 +1,3 @@
 <?php
-$version = "v2.47.1";
+$version = "v2.48.0";
 ?>

index.php

@@ -163,7 +163,7 @@ $headerClass = count($subscriptions) > 0 ? "main-actions" : "main-actions hidden
         <div class="update-banner">
           <?= translate('new_version_available', $i18n) ?>:
           <span><a href="https://github.com/ellite/Wallos/releases/tag/<?= htmlspecialchars($latestVersion) ?>"
-              target="_blank">
+              target="_blank" rel="noreferer">
               <?= htmlspecialchars($latestVersion) ?>
             </a></span>
         </div>

styles/styles.css

@@ -1118,15 +1118,27 @@ header #avatar {
   line-break: anywhere;
 }
 
-.credits-list>p {
+.credits-list>div {
   margin: 0px;
   font-size: 18px;
+  display: flex;
+  flex-direction: column;
 }
 
-.updates-list>p {
+.updates-list>div {
   margin: 0px;
 }
 
+.credits-list>div>h3 {
+  margin: 2px 0px 0px 0px;
+  font-size: 20px;
+}
+
+.credits-list>div>h3>i {
+  color: var(--accent-color);
+  font-size: 18px;
+}
+
 .settings-notes {
   margin-bottom: 1.5em;
 }
@@ -1135,19 +1147,19 @@ header #avatar {
   margin-bottom: 0px;
 }
 
-.credits-list>p>span,
+.credits-list>div>span,
 .updates-list>p>span,
 .settings-notes>p>span {
   color: #AAA;
   font-size: 14px;
 }
 
-.credits-list>p>span,
+.credits-list>div>span,
 .updates-list>p>span {
   font-size: 16px;
 }
 
-.credits-list>p>span>a,
+.credits-list>div>span>a,
 .updates-list>p>span>a,
 .settings-notes>p>span>a {
   margin-left: 5px;
@@ -1155,14 +1167,14 @@ header #avatar {
   color: var(--accent-color);
 }
 
-.rtl .credits-list>p>span>a,
+.rtl .credits-list>div>span>a,
 .rtl .updates-list>p>span>a,
 .rtl .settings-notes>p>span>a {
   margin-left: 0px;
   margin-right: 5px;
 }
 
-.credits-list>p>span>a:visited,
+.credits-list>div>span>a:visited,
 .updates-list>p>span>a:visited,
 .settings-notes>p>span>a:visited {
   color: var(--accent-color);