diff --git a/backend/__pycache__/main.cpython-313.pyc b/backend/__pycache__/main.cpython-313.pyc
index 72a1bb6..add390f 100644
Binary files a/backend/__pycache__/main.cpython-313.pyc and b/backend/__pycache__/main.cpython-313.pyc differ
diff --git a/frontend/index.html b/frontend/index.html
index 0c589ec..ca5b307 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -2,9 +2,11 @@
-
+
+
+
- Vite + React
+ Navix
diff --git a/frontend/public/navix-logo.svg b/frontend/public/navix-logo.svg
new file mode 100644
index 0000000..83201b2
--- /dev/null
+++ b/frontend/public/navix-logo.svg
@@ -0,0 +1,2 @@
+
+
\ No newline at end of file
diff --git a/frontend/src/App.css b/frontend/src/App.css
index 9e36f1e..9fc1cd5 100644
--- a/frontend/src/App.css
+++ b/frontend/src/App.css
@@ -17,6 +17,19 @@ body {
}
.main-title {
- margin-bottom: 2rem;
+ display: flex;
+ align-items: center;
+ justify-content: center;
font-size: 2rem;
+ font-weight: bold;
+ color: white;
+ gap: 0.6rem;
+ font-family: 'Orbitron', sans-serif;
+}
+
+.navix-logo {
+ width: 40px;
+ height: 40px;
+ display: inline-block;
+ vertical-align: middle;
}
diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx
index 40e526d..c63be15 100644
--- a/frontend/src/App.jsx
+++ b/frontend/src/App.jsx
@@ -19,7 +19,10 @@ function App() {
return (
-
🔷 Navix
+
+ 
+ Navix
+
window.location.reload()} />
{sections.map((section) => (
diff --git a/frontend/src/components/AddAppModal.jsx b/frontend/src/components/AddAppModal.jsx
index 364d6f1..0608d0a 100644
--- a/frontend/src/components/AddAppModal.jsx
+++ b/frontend/src/components/AddAppModal.jsx
@@ -1,7 +1,7 @@
import { useState } from 'react';
import { addAppToSection } from '../services/api';
import '../style/AddAppModal.css';
-import { IoIosAddCircleOutline } from "react-icons/io";
+import { IoIosAdd } from "react-icons/io";
function AddAppModal({ onAdded }) {
const [open, setOpen] = useState(false);
@@ -31,7 +31,7 @@ function AddAppModal({ onAdded }) {
return (
<>
- setOpen(true)}
/>
diff --git a/frontend/src/style/AddAppModal.css b/frontend/src/style/AddAppModal.css
index c9995ee..20ed770 100644
--- a/frontend/src/style/AddAppModal.css
+++ b/frontend/src/style/AddAppModal.css
@@ -2,23 +2,25 @@
position: fixed;
bottom: 2rem;
right: 2rem;
- background-color: #007bff;
- color: white;
- font-size: 2rem;
+ width: 64px;
+ height: 64px;
border-radius: 50%;
- width: 60px;
- height: 60px;
+ background: linear-gradient(145deg, #206064, #182b41);
+ box-shadow: 0 0 12px #00f0ff;
+ color: white;
+ font-size: 2.2rem;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
- z-index: 999;
- box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
- transition: background-color 0.3s ease;
+ z-index: 1000;
+ transition: transform 0.3s ease, box-shadow 0.3s ease;
+ border: none;
}
.add-button:hover {
- background-color: #0056b3;
+ transform: rotate(90deg) scale(1.1);
+ box-shadow: 0 0 20px #00f0ff;
}
.modal-overlay {
@@ -35,43 +37,58 @@
}
.modal {
- background: #1e1e1e;
+ background: #111;
padding: 2rem;
- border-radius: 12px;
- width: 340px;
- height: 420px;
- box-shadow: 0 0 10px #000;
-
- /* Flexbox centering */
+ border-radius: 16px;
+ width: 380px;
+ box-shadow: 0 0 20px rgba(0, 255, 255, 0.1);
display: flex;
flex-direction: column;
align-items: center;
- justify-content: center;
+ font-family: 'Rajdhani', sans-serif;
+}
+
+.modal h2 {
+ color: #fff;
+ font-size: 1.8rem;
+ margin-bottom: 1.5rem;
+ text-shadow: 0 0 5px #00f0ff;
}
.modal input {
- width: 90%;
- height: 35px;
- padding: 0.5rem;
- margin-bottom: 0.75rem;
- background-color: #2c2c2c;
- border: none;
- color: white;
- border-radius: 6px;
+ width: 95%;
+ height: 40px;
+ padding: 0.6rem;
+ margin-bottom: 1rem;
+ background-color: #1f1f1f;
+ border: 1px solid #2c2c2c;
+ color: #fff;
+ border-radius: 8px;
+ transition: border 0.3s;
+ font-family: inherit;
+}
+
+.modal input:focus {
+ border: 1px solid #00f0ff;
+ outline: none;
+ box-shadow: 0 0 6px #00f0ff40;
}
.modal button {
- width: 90%;
- padding: 0.5rem;
- background-color: #007bff;
+ width: 80%;
+ padding: 0.6rem;
+ background: linear-gradient(to right, #007bff, #00f0ff);
color: white;
+ font-weight: 600;
border: none;
- border-radius: 6px;
+ border-radius: 8px;
cursor: pointer;
+ transition: background 0.3s ease;
+ font-family: inherit;
}
.modal button:hover {
- background-color: #0056b3;
+ background: linear-gradient(to right, #00f0ff, #007bff);
}
.add-button {
diff --git a/frontend/src/style/AppCard.css b/frontend/src/style/AppCard.css
index 8e57227..5fa515b 100644
--- a/frontend/src/style/AppCard.css
+++ b/frontend/src/style/AppCard.css
@@ -5,8 +5,8 @@
border-radius: 12px;
text-align: center;
text-decoration: none;
- width: 150px;
- height: 150px;
+ width: 170px;
+ height: 170px;
transition: transform 0.2s ease;
display: flex;
flex-direction: column;
@@ -36,3 +36,17 @@
object-fit: contain;
display: block;
}
+
+.app-card h3 {
+ font-family: 'Rajdhani', sans-serif;
+ font-size: 1.1rem;
+ margin: 0.4rem 0;
+ color: white;
+}
+
+.app-card p {
+ font-family: 'Rajdhani', sans-serif;
+ font-size: 0.9rem;
+ color: #ccc;
+}
+
diff --git a/frontend/src/style/SectionGrid.css b/frontend/src/style/SectionGrid.css
index 3235698..74f4c3b 100644
--- a/frontend/src/style/SectionGrid.css
+++ b/frontend/src/style/SectionGrid.css
@@ -5,10 +5,11 @@
}
.section-title {
- font-size: 1.5rem;
- color: #ffffff;
- margin-bottom: 1rem;
- border-bottom: 1px solid #444;
- padding-bottom: 0.5rem;
+ font-family: 'Rajdhani', sans-serif;
+ font-size: 1.8rem;
text-align: left;
+ border-bottom: 1px solid #2e6dc0;
+ font-weight: 500;
+ margin-bottom: 1rem;
+ color: white;
}