diff --git a/Medarbetarpuls/medarbetarapp/static/go-back-btn.png b/Medarbetarpuls/medarbetarapp/static/go-back-btn.png
new file mode 100644
index 0000000000000000000000000000000000000000..8b6d7d56e0603b78eca3795f1561dcac9430b171
Binary files /dev/null and b/Medarbetarpuls/medarbetarapp/static/go-back-btn.png differ
diff --git a/Medarbetarpuls/medarbetarapp/static/styles.css b/Medarbetarpuls/medarbetarapp/static/styles.css
index 56f2e1da30e435a3e40133ee79a772a0ad44db05..bbb7bad99546b9dbfde7c0e7cbf574f83215feb5 100644
--- a/Medarbetarpuls/medarbetarapp/static/styles.css
+++ b/Medarbetarpuls/medarbetarapp/static/styles.css
@@ -333,7 +333,35 @@ button:hover {
color: #ff4b4b;
}
-/* Popup Content */
+.go-back-button {
+ position: absolute;
+ top: 30px;
+ left: 30px;
+ margin: 10px;
+ background-color: transparent;
+ border: none;
+ cursor: pointer;
+ outline: none;
+}
+.go-back-button:hover {
+ background-color: transparent; /* Prevent blue background */
+ outline: none; /* Remove focus outline */
+}
+
+.go-back-button:focus {
+ outline: none; /* Prevent focus outline */
+}
+
+.go-back-button:hover img {
+ filter: brightness(1.1); /* Lighten on hover */
+}
+
+.back-icon {
+ width: 50px;
+ height: 50px;
+}
+
+/* Use for popups */
.popup-content {
background-color: #e6f0fa;
padding: 20px;
@@ -358,6 +386,19 @@ button:hover {
padding: 5px;
}
+.trashcan-button:hover {
+ background-color: transparent; /* Prevent blue background */
+ outline: none; /* Remove focus outline */
+}
+
+.trashcan-button:hover img {
+ filter: sepia(100%) saturate(500%) hue-rotate(-30deg); /* Red hue */
+}
+
+.trashcan-button:focus {
+ outline: none; /* Prevent focus outline */
+}
+
.search-container {
margin: 15px auto;
display: flex;
@@ -406,19 +447,6 @@ th {
background-color: #e0e0e0;
}
-.trashcan-button:hover {
- background-color: transparent; /* Prevent blue background */
- outline: none; /* Remove focus outline */
-}
-
-.trashcan-button:hover img {
- filter: sepia(100%) saturate(500%) hue-rotate(-30deg); /* Red hue */
-}
-
-.trashcan-button:focus {
- outline: none; /* Prevent focus outline */
-}
-
.icon {
width: 20px;
height: 20px;
diff --git a/Medarbetarpuls/medarbetarapp/templates/add_employee.html b/Medarbetarpuls/medarbetarapp/templates/add_employee.html
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..36c6189d6bec3466439c897b19b5484d77bf4b72 100644
--- a/Medarbetarpuls/medarbetarapp/templates/add_employee.html
+++ b/Medarbetarpuls/medarbetarapp/templates/add_employee.html
@@ -0,0 +1,62 @@
+<!DOCTYPE html>
+<html lang="sv">
+ <head>
+ {% load static %}
+ <script src="https://unpkg.com/htmx.org@1.8.4"></script>
+ <meta charset="UTF-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+ <title>Lägg till medarbetare</title>
+ <link rel="stylesheet" href="{% static 'styles.css' %}" />
+ </head>
+ <body>
+ <div class="create-container">
+ <button
+ class="go-back-button"
+ onclick="window.location.href='{% url 'my_org' %}'"
+ >
+ <img
+ src="{% static 'go-back-btn.png' %}"
+ alt="Go Back"
+ class="back-icon"
+ />
+ </button>
+ <h1>Lägg till medarbetare i<br />{{organization.name}}</h1>
+ <!-- This form sends the input data to the server using a POST request -->
+ <form class="create-form">
+ <label for="email">Medarbetarens mejladress:</label>
+ <input
+ type="email"
+ id="email"
+ name="email"
+ placeholder="Mejladress"
+ required
+ />
+
+ <label for="team">Medarbetarens team:</label>
+ <!-- Fix so team options show up? -->
+ <input type="text" id="team" name="team" placeholder="Team" required />
+
+ <button type="submit" onclick="openPopup()">Lägg till</button>
+ <div id="added-popup" class="popup-overlay" style="display: none">
+ <div class="popup-content">
+ <h2>Din medarbetare är nu tillagd i systemet.</h2>
+ <p>
+ Observera att medarbetaren dyker upp i din organisation först när
+ medarbetaren har skapat sitt konto.
+ </p>
+ <button onclick="closePopup()">Fortsätt</button>
+ </div>
+ </div>
+ </form>
+ </div>
+ <script>
+ function openPopup() {
+ document.getElementById("added-popup").style.display = "flex";
+ }
+
+ function closePopup() {
+ document.getElementById("added-popup").style.display = "none";
+ }
+ </script>
+ </body>
+</html>
diff --git a/Medarbetarpuls/medarbetarapp/templates/my_org.html b/Medarbetarpuls/medarbetarapp/templates/my_org.html
index 7ec0cf38fd6ff0b0378b4905a653a5655faae40f..925e2c3da95008530bbebebd5598b5ca2120fc6b 100644
--- a/Medarbetarpuls/medarbetarapp/templates/my_org.html
+++ b/Medarbetarpuls/medarbetarapp/templates/my_org.html
@@ -54,7 +54,9 @@
</tbody>
</table>
</div>
- <button class="button">Lägg till medarbetare</button>
+ <a href="{% url 'add_employee' %}">
+ <button class="button">Lägg till medarbetare</button>
+ </a>
</div>
<!-- Script for filtering -->
diff --git a/Medarbetarpuls/medarbetarapp/templates/settings_user.html b/Medarbetarpuls/medarbetarapp/templates/settings_user.html
index ec04147d15d63a04c63c030f0dd6f8dd439dbb43..57f6e6cdcf27d89b8d7c14c9f622dd65f2d75893 100644
--- a/Medarbetarpuls/medarbetarapp/templates/settings_user.html
+++ b/Medarbetarpuls/medarbetarapp/templates/settings_user.html
@@ -51,7 +51,7 @@
<p>Är du säker på att du vill ta bort ditt konto?</p>
<p>Detta kommer genast logga ut dig och du kommer inte kunna logga in igen.</p>
<label for="password">Lösenord:</label>
- <input type="password" id="password" placeholder="*************"> <!--fix-->
+ <input type="password" id="password" placeholder="*************">
<button class="delete-button">Radera konto</button>
</div>
</div>
diff --git a/Medarbetarpuls/medarbetarapp/views.py b/Medarbetarpuls/medarbetarapp/views.py
index ab6d92e4ff7d4130a4ace063c8e1f806f0284773..456fa0d0af27364ef471ad6169669f2c2cba4498 100644
--- a/Medarbetarpuls/medarbetarapp/views.py
+++ b/Medarbetarpuls/medarbetarapp/views.py
@@ -84,7 +84,7 @@ def find_organization_by_email(email: str) -> models.Organization | None:
def add_employee_view(request):
- return render(request, "add_employee.html")
+ return render(request, "add_employee.html", {"organization": request.user.admin})
@csrf_exempt
@@ -273,8 +273,7 @@ def settings_user_view(request):
def start_admin_view(request):
return render(
- request,
- "start_admin.html"
+ request, "start_admin.html"
) # Fix so only works if the user is actually an admin