diff --git a/changelog.d/20240227_192724_hina.khadim_indigo.md b/changelog.d/20240227_192724_hina.khadim_indigo.md new file mode 100644 index 000000000..cbf661829 --- /dev/null +++ b/changelog.d/20240227_192724_hina.khadim_indigo.md @@ -0,0 +1 @@ +- [Improvement] Style static pages of About, Contact, Privacy and bookmarks page (by @tanveer65) diff --git a/tutorindigo/templates/indigo/lms/static/images/about.svg b/tutorindigo/templates/indigo/lms/static/images/about.svg new file mode 100644 index 000000000..5ab21a9be --- /dev/null +++ b/tutorindigo/templates/indigo/lms/static/images/about.svg @@ -0,0 +1,177 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/tutorindigo/templates/indigo/lms/static/images/blog.svg b/tutorindigo/templates/indigo/lms/static/images/blog.svg new file mode 100644 index 000000000..cc0c64a02 --- /dev/null +++ b/tutorindigo/templates/indigo/lms/static/images/blog.svg @@ -0,0 +1,50 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/tutorindigo/templates/indigo/lms/static/images/contact.svg b/tutorindigo/templates/indigo/lms/static/images/contact.svg new file mode 100644 index 000000000..de7797727 --- /dev/null +++ b/tutorindigo/templates/indigo/lms/static/images/contact.svg @@ -0,0 +1,48 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/tutorindigo/templates/indigo/lms/static/images/donate.svg b/tutorindigo/templates/indigo/lms/static/images/donate.svg new file mode 100644 index 000000000..fd48fc3c5 --- /dev/null +++ b/tutorindigo/templates/indigo/lms/static/images/donate.svg @@ -0,0 +1,59 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/tutorindigo/templates/indigo/lms/static/images/help.svg b/tutorindigo/templates/indigo/lms/static/images/help.svg new file mode 100644 index 000000000..57b1bd41f --- /dev/null +++ b/tutorindigo/templates/indigo/lms/static/images/help.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + + + + + + diff --git a/tutorindigo/templates/indigo/lms/static/images/privacy.svg b/tutorindigo/templates/indigo/lms/static/images/privacy.svg new file mode 100644 index 000000000..65c6d1e69 --- /dev/null +++ b/tutorindigo/templates/indigo/lms/static/images/privacy.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/tutorindigo/templates/indigo/lms/static/images/tos.svg b/tutorindigo/templates/indigo/lms/static/images/tos.svg new file mode 100644 index 000000000..56536032d --- /dev/null +++ b/tutorindigo/templates/indigo/lms/static/images/tos.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + + + + + + diff --git a/tutorindigo/templates/indigo/lms/static/sass/courseware/_about.scss b/tutorindigo/templates/indigo/lms/static/sass/courseware/_about.scss index 652fc8ef9..982e6ba78 100644 --- a/tutorindigo/templates/indigo/lms/static/sass/courseware/_about.scss +++ b/tutorindigo/templates/indigo/lms/static/sass/courseware/_about.scss @@ -2,7 +2,7 @@ .course-info.about { &.container { padding-top: 50px; - padding-bottom: 50px; + padding-bottom: 20px; @include media-breakpoint-up(md) { padding-top: 70px; padding-bottom: 70px; @@ -33,22 +33,18 @@ padding: 0 0 70px; } h1 { - font-size: 30px; + font-size: 24px; font-weight: 800; - margin: 0 0 10px; - line-height: 40px; + margin: 0 0 8px; + line-height: 30px; color: #111827; text-align: left; - @include media-breakpoint-up(lg) { - font-size: 36px; - line-height: 45px; - } } .org { display: block; color: #6B7280; - font-size: 20px; - line-height: 28px; + font-size: 16px; + line-height: 22px; } } .media { @@ -69,6 +65,8 @@ position: relative; z-index: 1; border-radius: 8px; + height: 180px; + object-fit: cover; } .hero { position: relative; @@ -140,15 +138,22 @@ } } .about-content { + display: flex; + flex-flow: column-reverse; + flex-wrap: wrap; + @include media-breakpoint-up(md) { + display: block; + } &:after { display: block; clear: both; content: ""; } .details { + width: 100%; @include media-breakpoint-up(md) { width: calc(100% - 32% - 35px); - margin-right: 57px; + margin-right: 35px; } @include media-breakpoint-up(lg) { width: calc(100% - 32% - 57px); @@ -250,8 +255,12 @@ background: $primary-light; padding: 24px; border-radius: 8px; + width: 100%; + box-sizing: border-box; + margin: 0 0 25px; @include media-breakpoint-up(md) { width: 32%; + margin: 0; } h2 { color:#111827; diff --git a/tutorindigo/templates/indigo/lms/static/sass/courseware/_bookmarks.scss b/tutorindigo/templates/indigo/lms/static/sass/courseware/_bookmarks.scss new file mode 100644 index 000000000..b242a999e --- /dev/null +++ b/tutorindigo/templates/indigo/lms/static/sass/courseware/_bookmarks.scss @@ -0,0 +1,168 @@ +// Include custom bookmarks +.navbar.course-tabs { + display: block; + max-width: 1090px; + margin: 0 auto; + padding: 20px 15px !important; + border: none; + overflow-x: auto; + ul.navbar-nav { + border-bottom: 1px solid $primary-light; + .nav-item { + margin-right: 10px; + @include media-breakpoint-up(md) { + margin-right: 32px; + } + a { + border-width: 0 0 2px; + padding: 0.5rem 1rem; + font-weight: 500; + font-size: 14px; + line-height: 20px; + } + } + } +} +.page-content-container { + .page-content { + padding: 20px 0; + } + .page-header.has-secondary { + padding: 8px 10px; + border: none; + background: #F2F7F8; + border-radius: 6px; + .breadcrumbs { + font-weight: 500; + font-size: 14px; + color: #6B7280; + } + } + .courseware-results.search-result { + max-width: 100%; + } + .bookmarks-empty { + box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.05); + border: none; + border-radius: 8px; + padding: 20px; + color: #6B7280; + font-size: 14px; + max-width: 540px; + margin: 0 auto; + text-align: center; + h3 { + font-size: 16px; + font-weight: 700; + color: #111827; + margin: 0 0 10px; + .bookmarks-empty-header-icon { + display: block; + margin: 0 0 10px; + font-size: 30px; + color: $primary; + } + } + } + .search-results { + max-width: 100%; + margin: 0; + .search-count { + font-size: 14px; + } + .paging-header, .bookmarks-results-list, .paging-footer { + margin-left: 0; + max-width: 856px; + } + } +} +.course-bookmarks { + .bookmarks-results-list { + a.bookmarks-results-list-item { + border: 1px solid #E5E7EB; + border-left: 8px solid $primary-light; + padding: 20px 30px; + border-radius: 8px; + position: relative; + &:before { + position: absolute; + top: -1px; + left: 5px; + font-size: 17px; + line-height: 17px; + } + &:hover { + text-decoration: none; + } + h3 { + font-size: 18px; + font-weight: 600; + color: $drak; + .icon { + width: 12px; + height: 12px; + border: 2px solid #9CA3AF; + border-width: 2px 2px 0 0; + margin: 0 12px 0 10px; + transform: rotate(45deg); + &:before { + display: none; + } + } + } + .list-item-date { + font-size: 14px; + font-weight: 500; + color: #4B5563; + } + p { + margin: 0; + } + .list-item-left-section { + width: 100%; + margin: 0 0 10px; + @include media-breakpoint-up(md) { + width: calc(100% - 82px); + margin: 0; + } + } + .list-item-right-section { + display: inline-block; + font-size: 14px; + line-height: 16px; + font-weight: 500; + color: #fff; + background: $primary; + padding: 9px 13px; + border-radius: 6px; + bottom: 0; + position: static; + @include media-breakpoint-up(md) { + position: absolute; + } + .icon { + display: none; + } + } + } + } +} +.pagination { + .nav-link { + font-size: 30px; + padding: 0; + background: none !important; + color: #6B7280 !important; + line-height: 30px; + } + .current-page, .page-number-input, .total-pages { + color: #313131; + font-size: 14px; + font-weight: 600; + margin: 0 4px; + } + .page-divider { + font-weight: bold; + color: #6B7280; + } +} diff --git a/tutorindigo/templates/indigo/lms/static/sass/extra/_footer.scss b/tutorindigo/templates/indigo/lms/static/sass/extra/_footer.scss index 8d1070a5a..6ae66b2ce 100644 --- a/tutorindigo/templates/indigo/lms/static/sass/extra/_footer.scss +++ b/tutorindigo/templates/indigo/lms/static/sass/extra/_footer.scss @@ -11,6 +11,7 @@ footer.tutor-container { padding: 0 15px; max-width: 1090px; text-align: center; + box-sizing: border-box; @include media-breakpoint-up(lg) { text-align: left; } diff --git a/tutorindigo/templates/indigo/lms/static/sass/extra/_header.scss b/tutorindigo/templates/indigo/lms/static/sass/extra/_header.scss index 48e06df08..4b21aff45 100644 --- a/tutorindigo/templates/indigo/lms/static/sass/extra/_header.scss +++ b/tutorindigo/templates/indigo/lms/static/sass/extra/_header.scss @@ -1,4 +1,7 @@ // Include custom header +body { + font-family: $font-family-title; +} header.global-header { border: none; padding: 0; diff --git a/tutorindigo/templates/indigo/lms/static/sass/partials/lms/theme/_extras.scss b/tutorindigo/templates/indigo/lms/static/sass/partials/lms/theme/_extras.scss index 6fd42329c..80f0ba6f2 100644 --- a/tutorindigo/templates/indigo/lms/static/sass/partials/lms/theme/_extras.scss +++ b/tutorindigo/templates/indigo/lms/static/sass/partials/lms/theme/_extras.scss @@ -8,6 +8,15 @@ $footer-height: 125.5px; body, body.view-profile { min-height: initial; background-color: #fff; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + text-rendering: optimizeLegibility; +} +.page-content-container { + max-width: 1090px; + margin: 0 auto; + padding: 0 15px; + border: none; } %btn-pl-default-base { @@ -239,12 +248,46 @@ nav.wrapper-preview-menu { } } } +.container { + &.about{ + padding: 30px 0; + font-size: 16px; + line-height: 24px; + color: #6B7280; + h1 { + font-size: 24px; + font-weight: 700; + line-height: 34px; + margin: 0 0 12px; + text-align: left; + color: $drak; + } + p { + margin: 0 0 20px; + } + a { + color: $primary; + text-decoration: underline; + } + .graphic-img { + margin: 0 auto; + max-width: 178px; + padding: 30px 0; + img { + width: 100%; + display: block; + height: auto; + } + } + } +} @import '../../../extra/footer'; @import '../../../extra/header'; @import '../../../dashbord/dashbord'; @import '../../../courseware/discover'; @import '../../../courseware/about'; +@import '../../../courseware/bookmarks'; @import '../../../home/home'; diff --git a/tutorindigo/templates/indigo/lms/templates/static_templates/about.html b/tutorindigo/templates/indigo/lms/templates/static_templates/about.html new file mode 100644 index 000000000..40a54fc18 --- /dev/null +++ b/tutorindigo/templates/indigo/lms/templates/static_templates/about.html @@ -0,0 +1,21 @@ +<%namespace name='static' file='../static_content.html'/> +<%page expression_filter="h"/> +<%! from django.utils.translation import gettext as _ %> +<%inherit file="../main.html" /> + +<%block name="pagetitle">${_("About")} + +
+
+

+ <%block name="pageheader">${page_header or _("About")} +

+

+ <%block name="pagecontent">${page_content or _("This page left intentionally blank. Feel free to add your own content.")} +

+ +
+ Runs on Tutor +
+
+
diff --git a/tutorindigo/templates/indigo/lms/templates/static_templates/blog.html b/tutorindigo/templates/indigo/lms/templates/static_templates/blog.html new file mode 100644 index 000000000..21f04ccd5 --- /dev/null +++ b/tutorindigo/templates/indigo/lms/templates/static_templates/blog.html @@ -0,0 +1,21 @@ +<%namespace name='static' file='../static_content.html'/> +<%page expression_filter="h"/> +<%! from django.utils.translation import gettext as _ %> +<%inherit file="../main.html" /> + +<%block name="pagetitle">${_("Blog")} + +
+
+

+ <%block name="pageheader">${page_header or _("Blog")} +

+

+ <%block name="pagecontent">${page_content or _("This page left intentionally blank. Feel free to add your own content.")} +

+ +
+ Runs on Tutor +
+
+
diff --git a/tutorindigo/templates/indigo/lms/templates/static_templates/contact.html b/tutorindigo/templates/indigo/lms/templates/static_templates/contact.html new file mode 100644 index 000000000..680008d46 --- /dev/null +++ b/tutorindigo/templates/indigo/lms/templates/static_templates/contact.html @@ -0,0 +1,21 @@ +<%namespace name='static' file='../static_content.html'/> +<%page expression_filter="h"/> +<%! from django.utils.translation import gettext as _ %> +<%inherit file="../main.html" /> + +<%block name="pagetitle">${_("Contact Us")} + +
+
+

+ <%block name="pageheader">${page_header or _("Contact Us")} +

+

+ <%block name="pagecontent">${page_content or _("This page left intentionally blank. Feel free to add your own content.")} +

+ +
+ Runs on Tutor +
+
+
diff --git a/tutorindigo/templates/indigo/lms/templates/static_templates/donate.html b/tutorindigo/templates/indigo/lms/templates/static_templates/donate.html new file mode 100644 index 000000000..9ea2c38fc --- /dev/null +++ b/tutorindigo/templates/indigo/lms/templates/static_templates/donate.html @@ -0,0 +1,21 @@ +<%namespace name='static' file='../static_content.html'/> +<%page expression_filter="h"/> +<%! from django.utils.translation import gettext as _ %> +<%inherit file="../main.html" /> + +<%block name="pagetitle">${_("Donate")} + +
+
+

+ <%block name="pageheader">${page_header or _("Donate")} +

+

+ <%block name="pagecontent">${page_content or _("This page left intentionally blank. Feel free to add your own content.")} +

+ +
+ Runs on Tutor +
+
+
diff --git a/tutorindigo/templates/indigo/lms/templates/static_templates/help.html b/tutorindigo/templates/indigo/lms/templates/static_templates/help.html new file mode 100644 index 000000000..e65e6529c --- /dev/null +++ b/tutorindigo/templates/indigo/lms/templates/static_templates/help.html @@ -0,0 +1,21 @@ +<%namespace name='static' file='../static_content.html'/> +<%page expression_filter="h"/> +<%! from django.utils.translation import gettext as _ %> +<%inherit file="../main.html" /> + +<%block name="pagetitle">${_("Help")} + +
+
+

+ <%block name="pageheader">${page_header or _("Help")} +

+

+ <%block name="pagecontent">${page_content or _("This page left intentionally blank. Feel free to add your own content.")} +

+ +
+ Runs on Tutor +
+
+
diff --git a/tutorindigo/templates/indigo/lms/templates/static_templates/privacy.html b/tutorindigo/templates/indigo/lms/templates/static_templates/privacy.html new file mode 100644 index 000000000..d180d5032 --- /dev/null +++ b/tutorindigo/templates/indigo/lms/templates/static_templates/privacy.html @@ -0,0 +1,23 @@ +<%namespace name='static' file='../static_content.html'/> +<%page expression_filter="h"/> +<%! from django.utils.translation import gettext as _ %> + + +<%inherit file="../main.html" /> + +<%block name="pagetitle">${_("Privacy Policy")} + +
+
+

+ <%block name="pageheader">${page_header or _("Privacy Policy")} +

+

+ <%block name="pagecontent">${page_content or _("This page left intentionally blank. Feel free to add your own content.")} +

+ +
+ Runs on Tutor +
+
+
diff --git a/tutorindigo/templates/indigo/lms/templates/static_templates/tos.html b/tutorindigo/templates/indigo/lms/templates/static_templates/tos.html new file mode 100644 index 000000000..ded8948d6 --- /dev/null +++ b/tutorindigo/templates/indigo/lms/templates/static_templates/tos.html @@ -0,0 +1,21 @@ +<%namespace name='static' file='../static_content.html'/> +<%page expression_filter="h"/> +<%! from django.utils.translation import gettext as _ %> +<%inherit file="../main.html" /> + +<%block name="pagetitle">${_("Terms of Service")} + +
+
+

+ <%block name="pageheader">${page_header or _("Terms of Service")} +

+

+ <%block name="pagecontent">${page_content or _("This page left intentionally blank. Feel free to add your own content.")} +

+ +
+ Runs on Tutor +
+
+