completed routes part 1

QuitoTactico · Nov 13, 2024 · 24b4aca · 24b4aca
1 parent cfb4ae8
commit 24b4aca
Show file tree

Hide file tree

Showing 7 changed files with 55 additions and 12 deletions.
diff --git a/SoftServeAcademy/urls.py b/SoftServeAcademy/urls.py
@@ -112,7 +112,9 @@
     # Skill
     path("skill/", skillViews.home, name="skill"),
     path("skill/create/", skillViews.create, name="skill_create"),
-    path('i18n/', include('django.conf.urls.i18n')),  # Add this line to include i18n URLs
+    path(
+        "i18n/", include("django.conf.urls.i18n")
+    ),  # Add this line to include i18n URLs
 ]
 
 urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
diff --git a/db.sqlite3 b/db.sqlite3
diff --git a/enums/enums.py b/enums/enums.py
@@ -45,7 +45,7 @@
 LANG_FLAG = {
     "es": "images/flags/es.svg",
     "en": "images/flags/um.svg",
-    "uk": "images/flags/uk.png", # <a href="https://www.flaticon.com/free-icons/ukraine" title="ukraine icons">Ukraine icons created by Freepik - Flaticon</a>
+    "uk": "images/flags/uk.png",  # <a href="https://www.flaticon.com/free-icons/ukraine" title="ukraine icons">Ukraine icons created by Freepik - Flaticon</a>
     "pt": "images/flags/pt.svg",
     "zh": "images/flags/cn.svg",
     "hi": "images/flags/in.svg",

diff --git a/learning_resource/learning_resource_extras.py b/learning_resource/learning_resource_extras.py
@@ -2,7 +2,10 @@
 
 register = template.Library()
 
+
 @register.filter
 def get_flag(lang_flag, language_code):
     """Retrieve the flag image path based on the language code."""
-    return lang_flag.get(language_code, 'images/flags/xx.svg')  # Provide a default flag if not found
+    return lang_flag.get(
+        language_code, "images/flags/xx.svg"
+    )  # Provide a default flag if not found
diff --git a/learning_resource/templatetags/learning_resource_extras.py b/learning_resource/templatetags/learning_resource_extras.py
@@ -2,7 +2,10 @@
 
 register = template.Library()
 
+
 @register.filter
 def get_flag(lang_flag, language_code):
     """Retrieve the flag image path based on the language code."""
-    return lang_flag.get(language_code, 'images/flags/xx.svg')  # Provide a default flag if not found
+    return lang_flag.get(
+        language_code, "images/flags/xx.svg"
+    )  # Provide a default flag if not found
diff --git a/learning_route/templates/learning_route.html b/learning_route/templates/learning_route.html
@@ -14,15 +14,33 @@
     </a>
     <div class="card-container">
         {% for learning_route in learning_routes %}
-            <a href="{% url 'learning_route_detail' learning_route.id %}" class="card-link">
-                <div class="card">
-                    <img src="{{ learning_route.skill_level.skill.image.url }}" alt="Card Image">
-                    <div class="card-content">
-                        <h3>{{ learning_route.skill_level.skill.name }}</h3>
-                        <p>Level {{ learning_route.skill_level.level }}</p>
+            {% if not learning_route.completed %}
+                <a href="{% url 'learning_route_detail' learning_route.id %}" class="card-link">
+                    <div class="card">
+                        <img src="{{ learning_route.skill_level.skill.image.url }}" alt="Card Image">
+                        <div class="card-content">
+                            <h3>{{ learning_route.skill_level.skill.name }}</h3>
+                            <p>Level {{ learning_route.skill_level.level }}</p>
+                        </div>
                     </div>
-                </div>
-            </a>
+                </a>
+            {% endif %}
+        {% endfor %}
+    </div>
+    <div class="card-container">
+        {% for learning_route in learning_routes %}
+            {% if learning_route.completed %}
+                <a href="{% url 'learning_route_detail' learning_route.id %}" class="card-link disabled">
+                    <div class="card">
+                        <img src="{{ learning_route.skill_level.skill.image.url }}" alt="Card Image">
+                        <div class="card-content">
+                            <h3>{{ learning_route.skill_level.skill.name }}</h3>
+                            <p>Level {{ learning_route.skill_level.level }}</p>
+                            <p>(Completed)</p>
+                        </div>
+                    </div>
+                </a>
+            {% endif %}
         {% endfor %}
     </div>
 {% else %}

diff --git a/static/css/learningroute.css b/static/css/learningroute.css
@@ -31,6 +31,23 @@ body {
 
 }
 
+/* Estilos para las tarjetas completadas */
+.card-link.disabled {
+    opacity: 0.6; /* Hacer que la tarjeta se vea desactivada */
+    filter: grayscale(100%); /* Aplicar un filtro en escala de grises */
+    pointer-events: auto; /* Asegurar que aún sean clickeables */
+}
+
+.card-link.disabled .card {
+    background-color: #f0f0f0; /* Fondo gris claro */
+    border: 1px solid #ccc; /* Borde gris */
+}
+
+.card-link.disabled .card-content h3,
+.card-link.disabled .card-content p {
+    color: #999; /* Texto gris */
+}
+
 .card {
     background-color: #fff;
     border-radius: 15px;