From 7939e6c6192ec6d21944537d139a1d5fd6a86552 Mon Sep 17 00:00:00 2001 From: Jannat Patel Date: Wed, 10 Nov 2021 17:08:46 +0530 Subject: [PATCH 1/3] style: course cards and templates --- .../course_cards/course_cards.html | 6 +++ school/lms/widgets/CourseCard.html | 12 +++--- school/public/css/style.css | 37 ++++++++++++++----- school/public/icons/black-arrow.svg | 4 +- school/public/icons/blue-arrow.svg | 3 ++ 5 files changed, 44 insertions(+), 18 deletions(-) create mode 100644 school/public/icons/blue-arrow.svg diff --git a/school/lms/web_template/course_cards/course_cards.html b/school/lms/web_template/course_cards/course_cards.html index 437ab432..301af868 100644 --- a/school/lms/web_template/course_cards/course_cards.html +++ b/school/lms/web_template/course_cards/course_cards.html @@ -6,4 +6,10 @@ {{ widgets.CourseCard(course=course, read_only=False) }} {% endfor %} + +
+ Explore More +
+
+ diff --git a/school/lms/widgets/CourseCard.html b/school/lms/widgets/CourseCard.html index f6bcd26d..73e034c3 100644 --- a/school/lms/widgets/CourseCard.html +++ b/school/lms/widgets/CourseCard.html @@ -77,36 +77,36 @@ {% if certificate %}
- _("Get Certificate") + {{ _("Get Certificate") }}
{% elif course.enable_certification and progress == 100 %} {% elif progress == 100 %}
- {{ _("Course Completed") }} + {{ _("Course Completed") }}
{% elif course.upcoming %}
- {{ _("Upcoming Course") }} + {{ _("Upcoming Course") }}
{% elif membership %}
- {{ _("Continue Course") }} + {{ _("Continue Course") }}
{% else %}
- {{ _("View Course") }} + {{ _("View Course") }}
diff --git a/school/public/css/style.css b/school/public/css/style.css index a63db3b7..d93b062f 100644 --- a/school/public/css/style.css +++ b/school/public/css/style.css @@ -13,7 +13,7 @@ --tag-color: var(--c7); --sidebar-bg: var(--c7); --h-color: var(--c2); - --text-color: #192734; + --text-color-dark: #192734; --text-color-light: #ccc; --cta-color: var(--c4); --send-message: var(--c7); @@ -29,6 +29,7 @@ --text-xl: 18px; --text-2xl: 20px; --text-3xl: 22px; + --navbar-shadow: 0px 1px 8px rgba(0, 0, 0, 0.08) } input[type=checkbox] { @@ -106,7 +107,7 @@ input[type=checkbox] { border-radius: 8px; position: relative; border: 1px solid #EEF0F2; - box-shadow: 0 0px 4px 2px #19273405; + box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.08); } .course-card { @@ -138,7 +139,7 @@ input[type=checkbox] { font-size: 18px; line-height: 156%; letter-spacing: -0.014em; - color: var(--text-color); + color: var(--text-color-dark); align-self: stretch; margin-bottom: 1.5rem; height: 56px; @@ -164,7 +165,7 @@ input[type=checkbox] { margin-left: 8px; font-size: 12px; line-height: 135%; - color: var(--text-color); + color: var(--text-color-dark); } .course-student-count { @@ -212,7 +213,7 @@ input[type=checkbox] { .courses-header { margin-bottom: 1.5rem; - color: var(--text-color); + color: var(--text-color-dark); font-weight: 600; font-size: var(--text-3xl); letter-spacing: -0.0175em @@ -422,7 +423,7 @@ input[type=checkbox] { font-weight: 600; font-size: 40px; line-height: 120%; - color: #192734; + color: var(--text-color-dark); margin-bottom: 8px; } @@ -493,7 +494,7 @@ input[type=checkbox] { .is-default { background: #F4F5F6; - color: #1F272E; + color: var(--text-color-dark); } @media (max-width: 600px) { @@ -738,7 +739,7 @@ input[type=checkbox] { font-weight: 600; font-size: var(--text-3xl); letter-spacing: -0.0175em; - color: #192734; + color: var(--text-color-dark); margin-bottom: 1rem; } @@ -911,7 +912,7 @@ input[type=checkbox] { align-items: center; font-size: 12px; line-height: 135%; - color: var(--text-color); + color: var(--text-color-dark); } .course-details-outline { @@ -1321,7 +1322,7 @@ pre { .certificate-heading { font-size: 3rem; font-weight: 500; - color: var(--text-color); + color: var(--text-color-dark); } .certificate-para { @@ -1380,3 +1381,19 @@ pre { display: flex; align-items: center; } + +.navbar { + box-shadow: var(--navbar-shadow); +} + +.interactive-arrow { + background-image: url("/assets/school/icons/black-arrow.svg"); + width: 1.5rem; + height: 1.5rem; + margin-left: 0.5rem; +} + +.intercative-link:hover .interactive-arrow{ + background-image: url("/assets/school/icons/blue-arrow.svg"); + margin-left: 1.5rem; +} diff --git a/school/public/icons/black-arrow.svg b/school/public/icons/black-arrow.svg index b242af38..93cefe4a 100644 --- a/school/public/icons/black-arrow.svg +++ b/school/public/icons/black-arrow.svg @@ -1,3 +1,3 @@ - - + + diff --git a/school/public/icons/blue-arrow.svg b/school/public/icons/blue-arrow.svg new file mode 100644 index 00000000..2eed8ea1 --- /dev/null +++ b/school/public/icons/blue-arrow.svg @@ -0,0 +1,3 @@ + + + From 091fefb60115fa1f9e1ac18a0759423d30c27512 Mon Sep 17 00:00:00 2001 From: Jannat Patel Date: Thu, 11 Nov 2021 09:48:11 +0530 Subject: [PATCH 2/3] fix: removed unused css variables --- school/public/css/school.bundle.less | 1 - school/public/css/style.css | 21 --------------------- school/public/css/vars.css | 6 ------ 3 files changed, 28 deletions(-) delete mode 100644 school/public/css/vars.css diff --git a/school/public/css/school.bundle.less b/school/public/css/school.bundle.less index 84e96562..f420befa 100644 --- a/school/public/css/school.bundle.less +++ b/school/public/css/school.bundle.less @@ -1,3 +1,2 @@ @import "./style.css"; -@import "./vars.css"; diff --git a/school/public/css/style.css b/school/public/css/style.css index d93b062f..8fa83659 100644 --- a/school/public/css/style.css +++ b/school/public/css/style.css @@ -1,26 +1,5 @@ :root { - --c1: #fefae0; - --c2: #264653; - --c3: #e9c46a; - --c4: #2a9d8f; - --c5: #f4a261; - --c6: #e76f51; - --c7: #ccd5ae; - --c8: #EEEEEE; - --bg: var(--c1); - --header-bg: var(--c2); - --header-color: var(--c3); - --tag-color: var(--c7); - --sidebar-bg: var(--c7); - --h-color: var(--c2); --text-color-dark: #192734; - --text-color-light: #ccc; - --cta-color: var(--c4); - --send-message: var(--c7); - --received-message: var(--c8); - --checkbox-size: 14px; - --control-bg: var(--gray-100); - --button-background: #EEF0F2; --text-xs: 11px; --text-sm: 12px; --text-md: 13px; diff --git a/school/public/css/vars.css b/school/public/css/vars.css deleted file mode 100644 index b499df29..00000000 --- a/school/public/css/vars.css +++ /dev/null @@ -1,6 +0,0 @@ -/* Define all your css variables here. */ -:root { - --tag-color: #737373; - --sidebar-bg: #F6F6F6; - --sidebar-border: #C4C4C4; -} From 1fa7dfe41f23de49e429b18a89e94ac8c7d01125 Mon Sep 17 00:00:00 2001 From: Jannat Patel Date: Fri, 12 Nov 2021 19:20:18 +0530 Subject: [PATCH 3/3] fix: removed arrow interaction --- school/lms/web_template/course_cards/course_cards.html | 2 +- school/public/css/style.css | 2 +- school/public/icons/{black-arrow.svg => arrow.svg} | 0 school/public/icons/down-arrow1.svg | 3 --- 4 files changed, 2 insertions(+), 5 deletions(-) rename school/public/icons/{black-arrow.svg => arrow.svg} (100%) delete mode 100644 school/public/icons/down-arrow1.svg diff --git a/school/lms/web_template/course_cards/course_cards.html b/school/lms/web_template/course_cards/course_cards.html index 301af868..16ef3012 100644 --- a/school/lms/web_template/course_cards/course_cards.html +++ b/school/lms/web_template/course_cards/course_cards.html @@ -10,6 +10,6 @@
Explore More
-
+ diff --git a/school/public/css/style.css b/school/public/css/style.css index 8fa83659..ffeda711 100644 --- a/school/public/css/style.css +++ b/school/public/css/style.css @@ -1366,7 +1366,7 @@ pre { } .interactive-arrow { - background-image: url("/assets/school/icons/black-arrow.svg"); + background-image: url("/assets/school/icons/arrow.svg"); width: 1.5rem; height: 1.5rem; margin-left: 0.5rem; diff --git a/school/public/icons/black-arrow.svg b/school/public/icons/arrow.svg similarity index 100% rename from school/public/icons/black-arrow.svg rename to school/public/icons/arrow.svg diff --git a/school/public/icons/down-arrow1.svg b/school/public/icons/down-arrow1.svg deleted file mode 100644 index cff41a0f..00000000 --- a/school/public/icons/down-arrow1.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - \ No newline at end of file