Andal Learning branding: Apply orange color #ff4f00 to buttons/navbar/tabs, hide footer
Some checks failed
validate / tests (push) Has been cancelled
validate / coverage (push) Has been cancelled
Lockfile Version check / version-check (push) Has been cancelled
Update Browserslist DB / update-browserslist (push) Has been cancelled

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Neo
2026-03-17 14:52:43 +07:00
parent 449af65d01
commit c751c8b19a

View File

@@ -1,5 +1,81 @@
@use "@openedx/paragon/styles/css/core/custom-media-breakpoints.css" as paragonCustomMediaBreakpoints; @use "@openedx/paragon/styles/css/core/custom-media-breakpoints.css" as paragonCustomMediaBreakpoints;
// Remove global primary color overrides - only apply to specific elements
// Button overrides - Andal orange
.btn-primary {
background-color: #ff4f00 !important;
border-color: #ff4f00 !important;
&:hover {
background-color: #cc3f00 !important;
border-color: #cc3f00 !important;
}
}
.btn-outline-primary {
color: #ff4f00 !important;
border-color: #ff4f00 !important;
&:hover {
background-color: #ff4f00 !important;
color: #fff !important;
}
}
.btn-brand {
background-color: #ff4f00 !important;
border-color: #ff4f00 !important;
color: #fff !important;
}
// Navbar/Header - Andal orange
.header {
background-color: #ff4f00 !important;
.nav-link.active,
.nav-item.active {
background-color: #cc3f00 !important;
}
}
// Tabs - Andal orange
.nav-tabs {
.nav-link.active {
background-color: #ff4f00 !important;
border-color: #ff4f00 !important;
color: #fff !important;
}
.nav-link:hover {
border-color: #ff4f00 !important;
}
}
// Search field - keep original colors
.pgn__searchfield {
// Remove any orange overrides - keep default
}
// Dropdowns - keep original
.dropdown-toggle {
// Keep original colors
}
// Cards - keep original
.pgn__card {
// Keep original colors
}
// Links - keep original black
a {
color: #000;
&:hover {
color: #ff4f00;
}
}
@import "~@edx/frontend-component-header/dist/index"; @import "~@edx/frontend-component-header/dist/index";
@import "assets/scss/variables"; @import "assets/scss/variables";
@import "assets/scss/form"; @import "assets/scss/form";
@@ -41,7 +117,7 @@ div.row:has(> div > div.highlight) {
// To apply selection style to selected Section/Subsecion/Units, in the Course Outline // To apply selection style to selected Section/Subsecion/Units, in the Course Outline
div.row:has(> div > div.outline-card-selected) { div.row:has(> div > div.outline-card-selected) {
box-shadow: 0 0 3px 3px var(--pgn-color-primary-500) !important; box-shadow: 0 0 3px 3px #ff4f00 !important;
} }
// To apply the glow effect to the selected xblock, in the Unit Outline // To apply the glow effect to the selected xblock, in the Unit Outline
@@ -52,7 +128,7 @@ div.xblock-highlight {
@keyframes glow { @keyframes glow {
0% { 0% {
box-shadow: 0 0 5px 5px var(--pgn-color-primary-500); box-shadow: 0 0 5px 5px #ff4f00;
} }
100% { 100% {