diff --git a/resources/assets/stylesheets/scss/courseware.scss b/resources/assets/stylesheets/scss/courseware.scss index 804165129e439fb02d5ec409cb53acf059ceecf5..87d7bc734ee510e49fa8b4f758d5c18d779ae25c 100644 --- a/resources/assets/stylesheets/scss/courseware.scss +++ b/resources/assets/stylesheets/scss/courseware.scss @@ -260,7 +260,7 @@ $consum_ribbon_width: calc(100% - 58px); .cw-ribbon-wrapper-consume { position: fixed; - padding: 1em; + padding: 15px; background-color: $white; width: $consum_ribbon_width; height: 46px; @@ -268,8 +268,8 @@ $consum_ribbon_width: calc(100% - 58px); } .cw-ribbon-consume-bottom { position: fixed; - top: 74px; - height: 8px; + top: 75px; + height: 15px; left: 0; width: calc(100% - 1em); background-color: $white; @@ -309,7 +309,7 @@ $consum_ribbon_width: calc(100% - 58px); &.cw-ribbon-sticky { position: fixed; top: 56px; - width: calc(100% - 344px); + width: calc(100% - 346px); z-index: 40; } @@ -455,16 +455,19 @@ $consum_ribbon_width: calc(100% - 58px); z-index: 42; &.unfold { - right: 12px; + right: 0px; } &.cw-ribbon-tools-consume { position: fixed; + &.unfold { + right: 15px; + } } &.cw-ribbon-tools-sticky { - position: fixed; - top: 56px; + position: absolute; + top: -1px; } .cw-ribbon-tool-content { @@ -661,7 +664,7 @@ ribbon end &.cw-container-wrapper-consume { margin: 0 auto; - padding: 6em 1em 1em 1em; + padding: 91px 15px 15px 15px; } &.cw-container-wrapper-discuss { diff --git a/resources/vue/components/courseware/CoursewareRibbon.vue b/resources/vue/components/courseware/CoursewareRibbon.vue index 1937c9c73b10772de6a8d36ee14e3a998c1b3fa7..7450bf699d4fc60a27d239d47215239022e8f2f6 100644 --- a/resources/vue/components/courseware/CoursewareRibbon.vue +++ b/resources/vue/components/courseware/CoursewareRibbon.vue @@ -38,7 +38,7 @@ :toolsActive="unfold" :stickyRibbon="stickyRibbon" :class="{ 'cw-ribbon-tools-sticky': stickyRibbon }" - :style="{ maxHeight: maxHeight + 'px' }" + :style="{ height: toolbarHeight + 'px' }" :canEdit="canEdit" @deactivate="deactivateToolbar" @blockAdded="$emit('blockAdded')" @@ -95,7 +95,7 @@ export default { breadcrumbFallback() { return window.outerWidth < 1200; }, - maxHeight() { + toolbarHeight() { if (this.stickyRibbon) { return parseInt(window.innerHeight * 0.75); } else { @@ -129,7 +129,7 @@ export default { }, handleScroll() { if (window.outerWidth > 767) { - this.stickyRibbon = window.scrollY > 130 && !this.consumeMode; + this.stickyRibbon = window.scrollY > 128 && !this.consumeMode; } else { this.stickyRibbon = window.scrollY > 75 && !this.consumeMode; }