From 4bac1a34b4aec5d796bae8f2a6642384514c685a Mon Sep 17 00:00:00 2001 From: Sandro Costa Date: Tue, 19 Mar 2024 11:57:17 +0000 Subject: [PATCH] fix: organization logo display * fix: platform logo on mobile display * fix: hide course name on mobile --- src/index.scss | 2 +- src/learning-header/LearningHeader.jsx | 28 +++++++++++++-------- src/learning-header/LearningHeader.test.jsx | 1 - src/learning-header/_header.scss | 10 ++++++++ 4 files changed, 28 insertions(+), 13 deletions(-) create mode 100644 src/learning-header/_header.scss diff --git a/src/index.scss b/src/index.scss index f6d231488e..fa39f1f460 100644 --- a/src/index.scss +++ b/src/index.scss @@ -42,7 +42,7 @@ $white: #fff; .user-dropdown { .btn { height: 3rem; - @media (max-width: -1 + map-get($grid-breakpoints, "sm")) { + @media (map-get($grid-breakpoints, "sm")) { padding: 0 0.5rem; } } diff --git a/src/learning-header/LearningHeader.jsx b/src/learning-header/LearningHeader.jsx index feae1cfab4..d8fe165b7c 100644 --- a/src/learning-header/LearningHeader.jsx +++ b/src/learning-header/LearningHeader.jsx @@ -26,6 +26,10 @@ LinkedLogo.propTypes = { alt: PropTypes.string.isRequired, }; +// this feature flag is not included on the frontend-platform, we have to get it directly from ENV +const enabledOrgLogo = process.env.ENABLED_ORG_LOGO || false; + + const LearningHeader = ({ courseOrg, courseTitle, intl, showUserDropdown, }) => { @@ -52,17 +56,19 @@ const LearningHeader = ({ {intl.formatMessage(messages.skipNavLink)}
{headerLogo} -
- { - (courseOrg && logoOrg) - && {`${courseOrg} - } - - {courseTitle} - +
+
+ {enabledOrgLogo ? ( + (courseOrg && logoOrg) + && {`${courseOrg} + ) : null} + + {courseTitle} + +
{showUserDropdown && authenticatedUser && ( { render(
); waitFor( () => { - expect(screen.getByAltText(`${courseData.courseOrg} logo`)).toHaveAttribute('src', 'logo-url'); expect(screen.getByText(`${courseData.courseOrg}`)).toBeInTheDocument(); expect(screen.getByText(courseData.courseTitle)).toBeInTheDocument(); diff --git a/src/learning-header/_header.scss b/src/learning-header/_header.scss new file mode 100644 index 0000000000..357cc6b3a9 --- /dev/null +++ b/src/learning-header/_header.scss @@ -0,0 +1,10 @@ +@import "../../node_modules/bootstrap/scss/bootstrap-grid"; +@import "../../node_modules/bootstrap/scss/mixins/breakpoints"; + +.logo { + img { + @include media-breakpoint-down(sm) { + max-width: 85% !important; + } + } +} \ No newline at end of file