frontend/src/css/main.css

@@ -19,28 +19,4 @@
     margin-right: 10%; 
     margin-top: 1.25%; 
     margin-bottom: 1.25%;
-}
-
-.news-ui {
-    width: 40%;
-    margin-bottom:
-    calc(15vh);
-    margin-left: 30%;
-    margin-right: 30%;
-    backdrop-filter: blur(3px);
-}
-
-.light-news-ui {
-    background-color: rgba(255, 255, 255, 0.45) !important;
-}
-
-.dark-news-ui {
-    background-color: rgba(55, 55, 55, 0.45) !important;
-}
-
-#app {
-    margin: 0;
-    bottom: 0;
-    width: 100vw;
-    height: 100vh;
 }

frontend/src/main.ts

@@ -16,20 +16,6 @@ let currentStyle = defaultStyle;
 
 const api : ControllerAPI = new ControllerAPI();
 
-async function authInit() {
-    console.log("User is authenticated");
-    const newsFeed = await api.getNews(true) as NewsFeed;
-    newsFeed.style = currentStyle;
-    const appElement = document.getElementById("app");
-    if (appElement)
-        appElement.innerHTML = newsFeed.build();
-}
-
-async function logInInit () {
-    console.log("User is not authenticated");
-    // Load the auth page
-}
-
 async function main() {
     // init navbar
     const navbar = new Navbar();
@@ -37,9 +23,14 @@ async function main() {
     document.body.innerHTML = "<div id='app'></div>" + navbar.build();
 
     if (await api.isAuthenticated()) {
-        await authInit();
+        console.log("User is authenticated");
+        const newsFeed = await api.getNews(true) as NewsFeed;
+        const appElement = document.getElementById("app");
+        if (appElement)
+            appElement.innerHTML = newsFeed.build();
     } else {
-        await logInInit();
+        console.log("User is not authenticated");
+        // Load the auth page
     }
 }
 

frontend/src/modules/Gefest/element.ts

@@ -25,8 +25,8 @@ export abstract class GefestElement {
         if (this.clickHandler === null)
             return null;
         return () => {
-            this.clickHandler!();
             GefestEngine.activateOnClick();
+            this.clickHandler!();
         };
     }
 
@@ -65,13 +65,6 @@ export abstract class GefestElement {
         this.content = content;
     }
 
-    /** 
-     * Call to GefestEngine for rerender element
-    */
-    update (): void {
-        GefestEngine.reRenderByGI(this.gefestId);
-    }
-
     /** 
      * Builds the element and returns it as a string. If the element has a style, it applies the style to the rendered HTML.
      * @param isFromStyle Indicates if the build is being called from a style application. This prevents infinite recursion when applying styles.
@@ -80,9 +73,6 @@ export abstract class GefestElement {
     build (isFromStyle: boolean = false): string {
         if (this.isHidden)
             this.setAttribute('hidden', '');
-        else
-            this.removeAttribute('hidden');
-
         if (!isFromStyle)
             return this.applyStyle(this.render(), this);
         return this.render();
@@ -94,9 +84,7 @@ export abstract class GefestElement {
      */
     checkReservedAttribute(key: string): void {
         if (({ "style": true, "class": true })[key]) 
-            throw new Error(`The attribute "${
+            throw new Error(`The attribute "${key}" is reserved. Use the setStyle method for styles and setClass method for classes.`);
-                key
-            }" is reserved. Use the setPersonalStyle method for styles and setClass method for classes.`);
     }
 
     /**

frontend/src/modules/Gefest/engine.ts

@@ -2,14 +2,12 @@ import { GefestElement } from "./element";
 
 // For protecting the set of elements from direct access
 const elements: Set<GefestElement> = new Set();
-const elementsMapping: Map<string, GefestElement> = new Map<string, GefestElement> ();
 export class GefestEngine {
     static register (element: GefestElement) : string {
         elements.add(element);
         // Generate GefestID for the element
         const gefestId = `gefest-${Math.random().toString(36).substr(2, 9)}`;
         element.setAttribute('data-gefest-id', gefestId);
-        elementsMapping.set(gefestId, element);
 
         return gefestId;
     }
@@ -28,16 +26,4 @@ export class GefestEngine {
         await main();
         await GefestEngine.activateOnClick();
     }
-
-    static reRenderByGI (gefestId: string) {
-        const gefestElement = elementsMapping.get(gefestId);
-        if (!gefestElement) return;
-        const elementHTML = document.querySelectorAll(`[data-gefest-id="${gefestId}"]`);
-
-        if (elementHTML.length > 0) {
-            const htmlElement = elementHTML[0] as HTMLElement;
-            htmlElement.outerHTML = gefestElement.build();
-            GefestEngine.activateOnClick();
-        }
-    }
 }

frontend/src/pages/default-element.ts

@@ -6,9 +6,4 @@ export abstract class DefaultElement extends GefestElement {
     constructor(content: (GefestElement | string)[] | string) {
         super(content);
     }
-
-    build(isFromStyle?: boolean): string {
-        if (!this.style) throw new Error("Setup style is required");
-        return super.build(isFromStyle);
-    }
 }

frontend/src/pages/navbar.ts

@@ -2,7 +2,7 @@ import { GefestA } from "../modules/Gefest/primitives/a";
 import { GefestI } from "../modules/Gefest/primitives/i";
 import { DefaultElement } from "./default-element";
 
-type FontAwesomeGroup = "fas" | "far" | "fab"; // e.g. "fas fa-home"
+type FontAwesomeGroup = "fas" | "far" | "fab"; // e.g. "fa-solid fa-home"
 type FontAwesomeIcon = `${FontAwesomeGroup} fa-${string}`;
 
 class NavbarButton extends DefaultElement {