Add about page and start adding pro page to web UI

src/ui/app/routes/about.py

@@ -0,0 +1,11 @@
+from flask import Blueprint, render_template
+from flask_login import login_required
+
+
+about = Blueprint("about", __name__)
+
+
+@about.route("/about")
+@login_required
+def about_page():
+    return render_template("about.html")

src/ui/app/routes/pro.py

@@ -0,0 +1,11 @@
+from flask import Blueprint, render_template
+from flask_login import login_required
+
+
+pro = Blueprint("pro", __name__)
+
+
+@pro.route("/pro")
+@login_required
+def pro_page():
+    return render_template("pro.html")

src/ui/app/static/css/overrides.css

@@ -179,9 +179,7 @@ button.list-group-item-secondary.active {
   background-color: var(--bs-bw-green); /* Initial background color */
   color: #fff;
   animation: colorPhase 3s infinite; /* Apply the color phasing animation */
-  transition:
-    background-color 0.3s ease-in-out,
-    box-shadow 0.3s ease-in-out; /* Smooth transitions */
+  transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out; /* Smooth transitions */
 }
 
 .buy-now .btn-buy-now:hover {
@@ -511,9 +509,7 @@ a.badge:hover {
 
 .setting-highlight {
   background-color: rgba(var(--bs-bw-green-rgb), 0.5);
-  transition:
-    background-color 2s ease,
-    opacity 2s ease;
+  transition: background-color 2s ease, opacity 2s ease;
   opacity: 1;
 }
 
@@ -759,3 +755,12 @@ a.text-decoration-underline.link-underline-primary:hover {
   padding-top: 1.625rem !important;
   padding-bottom: 0.625rem !important;
 }
+
+.footer-container .footer-link:hover {
+  font-style: italic;
+  text-decoration: underline;
+}
+
+.w-70 {
+  width: 70% !important;
+}