From deb8d4969e30f9c54deadf52dc87fcc5982bc076 Mon Sep 17 00:00:00 2001
From: kaotisk <kaotisk@arching-kaos.org>
Date: Sat, 30 Nov 2024 16:45:38 +0200
Subject: Refactoring final

---
 src/js/ui/sections/aboutSection.js | 45 +++++++++++++++++++++-----------------
 1 file changed, 25 insertions(+), 20 deletions(-)

(limited to 'src/js/ui/sections/aboutSection.js')

diff --git a/src/js/ui/sections/aboutSection.js b/src/js/ui/sections/aboutSection.js
index 3ab4d1e..902783d 100644
--- a/src/js/ui/sections/aboutSection.js
+++ b/src/js/ui/sections/aboutSection.js
@@ -9,30 +9,35 @@ import { makeElement } from "../../arching-kaos-generator.js";
 
 export function aboutSection()
 {
+    var whereAmI = {
+        element: "div",
+        className: "where-am-i",
+        innerHTML: [
+            { element: "img", src:"./img/logo.png", onclick:"menusel({id:'#/welcome-section'})"},
+            { element: "span", innerText:">"},
+            { element: "h2", innerText:"About"}
+        ]
+    };
     var aboutSection = {
         element: "div",
         hidden: true,
         id:"about-section",
-        innerHTML: `
-            <div class="where-am-i">
-                <img src="./img/logo.png" onclick="menusel({id:'#/welcome-section'})"/>
-                <span>&gt;</span>
-                <h2>About</h2>
-            </div>
-            <p>Arching Kaos is a project about radio, music, communications and decentralization.</p>
-            <p>On site, you can listen to the latest mixes of music (menu entry "Mixtapes"), read latest news ("News") of the network and chat (you guessed it, "Chat" menu entry).</p>
-            <p>You can see the zchains appearing in "zchain" and logs of the process on "Logs"</p>
-            <p>Note that to participate you will need to set up your Arching Kaos set, which is not so convinient yet but possible.</p>
-            <p>Furthermore, if you are using Freighter extension you can additionally see:</p>
-            <ol>
-                <li>Your balances on your wallet</li>
-                <li>Your configuration IPNS address (if any)</li>
-                <li>Your Arching Kaos configuration (if any)</li>
-                <li>Your zchain (...)</li>
-                <li>Your posted newsfeed (...)</li>
-            </ol>
-            <p>Finally, on the stats page you can find people that are participating over the Stellar Network, using the ARCHINGKAOS token/asset/coin.</p>
-                    `
+        innerHTML: [
+            whereAmI,
+            { element: "p", innerText:"Arching Kaos is a project about radio, music, communications and decentralization."},
+            { element: "p", innerText:'On site, you can listen to the latest mixes of music (menu entry "Mixtapes"), read latest news ("News") of the network and chat (you guessed it, "Chat" menu entry).'},
+            { element: "p", innerText:'You can see the zchains appearing in "zchain" and logs of the process on "Logs"'},
+            { element: "p", innerText:"Note that to participate you will need to set up your Arching Kaos set, which is not so convinient yet but possible."},
+            { element: "p", innerText:"Furthermore, if you are using Freighter extension you can additionally see:"},
+            { element: "ol", innerHTML: [
+                { element:"li", innerText:"Your balances on your wallet"},
+                { element:"li", innerText:"Your configuration IPNS address (if any)"},
+                { element:"li", innerText:"Your Arching Kaos configuration (if any)"},
+                { element:"li", innerText:"Your zchain (...)"},
+                { element:"li", innerText:"Your posted newsfeed (...)"}
+            ]},
+            { element:"p", innerText:"Finally, on the stats page you can find people that are participating over the Stellar Network, using the ARCHINGKAOS token/asset/coin."}
+                    ]
     };
 
     makeElement(aboutSection, document.querySelector('.main'));
-- 
cgit v1.2.3