Side bar now has proper scrolling
This commit is contained in:
PMKuipers
parent
ee0a9c3d3a
commit
de8e8199ca
2
amd/build/report-viewer-components.min.js
vendored
2
amd/build/report-viewer-components.min.js
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
2
amd/build/studyplan-editor-components.min.js
vendored
2
amd/build/studyplan-editor-components.min.js
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
11912
amd/build/vue/vue.min.js
vendored
11912
amd/build/vue/vue.min.js
vendored
File diff suppressed because one or more lines are too long
1
amd/build/vue/vue.min.js.map
Normal file
1
amd/build/vue/vue.min.js.map
Normal file
File diff suppressed because one or more lines are too long
|
|
@ -134,7 +134,6 @@ export default {
|
|||
badgeissuedstats: "badgeissuedstats",
|
||||
completion_incomplete: "completion_incomplete_badge",
|
||||
completion_completed: "completion_completed_badge",
|
||||
completioninfo: "completioninfo",
|
||||
badgedisabled: "badgedisabled"
|
||||
},
|
||||
course: {
|
||||
|
|
|
|||
|
|
@ -290,7 +290,7 @@ export default {
|
|||
badges: 'badges',
|
||||
relatedbages: 'relatedbages@badges',
|
||||
filter: 'filter@core',
|
||||
sitebadges: 'sitebadges@core',
|
||||
sitebadges: 'sitebadges@badges',
|
||||
}
|
||||
});
|
||||
|
||||
|
|
@ -4350,6 +4350,10 @@ export default {
|
|||
},
|
||||
loadingcourses: false,
|
||||
loadingcategories: [],
|
||||
badgelistshown: {
|
||||
relatedbadges: true,
|
||||
systembadges: false,
|
||||
}
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
|
|
@ -4359,7 +4363,12 @@ export default {
|
|||
}
|
||||
},
|
||||
mounted() {
|
||||
const self = this;
|
||||
this.initialize();
|
||||
|
||||
this.$root.$on('bv::collapse::state', (collapseId, isJustShown) => {
|
||||
self.badgelistshown[collapseId] = !!isJustShown;
|
||||
});
|
||||
},
|
||||
computed: {
|
||||
filterComponentType(){
|
||||
|
|
@ -4484,6 +4493,7 @@ export default {
|
|||
template: `
|
||||
<div class="t-toolbox">
|
||||
<p-sidebar
|
||||
class="t-toolbox-sidebar"
|
||||
:right='toolboxright'
|
||||
shadow
|
||||
v-model="value"
|
||||
|
|
@ -4493,20 +4503,24 @@ export default {
|
|||
<div class='t-toolbox-preface'>
|
||||
<b-form-checkbox v-model="toolboxright" switch>{{text.toolbarRight}}</b-form-checkbox>
|
||||
</div>
|
||||
<b-tabs content-class='mt-3'>
|
||||
<b-tab :title="text.courses">
|
||||
<b-tabs content-class='mt-3' class="t-toolbox-tabs">
|
||||
<b-tab :title="text.courses" class="t-toolbox-tab">
|
||||
<div v-if="loadingcourses"
|
||||
><div class="spinner-border text-primary" role="status"></div
|
||||
></div>
|
||||
<div v-else class="ml-4">
|
||||
<div v-else class="ml-2 t-toolbox-courses">
|
||||
<div class="flex-grow-0">
|
||||
<input v-model="filters.courses" :placeholder="text.filter"></input>
|
||||
<a @click="filters.courses = ''" v-if="filters.courses" href='#'
|
||||
><i class='fa fa-times'></i></a
|
||||
><b-spinner small v-if="loadingcategories.length > 0" variant="primary"></b-spinner>
|
||||
</div>
|
||||
<div class="t-toolbox-courselist">
|
||||
<t-coursecat-list v-model="filteredCourses"></t-coursecat-list>
|
||||
</div>
|
||||
</div>
|
||||
</b-tab>
|
||||
<b-tab :title="text.flow">
|
||||
<b-tab :title="text.flow" class="t-toolbox-tab">
|
||||
<ul class="t-toolbox">
|
||||
<li><drag
|
||||
:type="filterComponentType"
|
||||
|
|
@ -4531,20 +4545,16 @@ export default {
|
|||
</drag></li>
|
||||
</ul>
|
||||
</b-tab>
|
||||
<b-tab :title="text.badges">
|
||||
<b-card no-body class="mb-1">
|
||||
<b-card-header header-tag="header" class="p-1" role="tab">
|
||||
<b-button block v-b-toggle.relatedbadges variant="light">
|
||||
<span class='float-left'>{{ text.relatedbages }}</span>
|
||||
<span class="when-open float-right"><i class='fa fa-caret-down'></i></span>
|
||||
<span class="when-closed float-right"><i class='fa fa-caret-right'></i></span>
|
||||
</b-button>
|
||||
</b-card-header>
|
||||
<b-collapse id="relatedbadges" visible accordion="my-accordion" role="tabpanel">
|
||||
<b-card-body>
|
||||
<b-tab :title="text.badges" class="t-toolbox-tab">
|
||||
|
||||
<b-tabs content-class='mt-2 ml-2' class="t-toolbox-badges">
|
||||
<b-tab :title="text.relatedbages">
|
||||
<div class="t-toolbox-badges-filter">
|
||||
<input v-model="filters.relatedbadges" @input="filter_relatedbadges" :placeholder="text.filter"></input>
|
||||
<a @click="reset_relatedbadges" v-if="filters.relatedbadges" href='#'
|
||||
><i class='fa fa-times'></i></a>
|
||||
</div>
|
||||
<div class="t-toolbox-badges-list">
|
||||
<ul class="t-badges">
|
||||
<li v-for="b in relatedbadges"><drag
|
||||
class="t-badge-drag"
|
||||
|
|
@ -4558,22 +4568,15 @@ export default {
|
|||
></template>
|
||||
</drag></li>
|
||||
</ul>
|
||||
</b-card-body>
|
||||
</b-collapse>
|
||||
</b-card>
|
||||
<b-card v-if="!coaching" no-body class="mb-1">
|
||||
<b-card-header header-tag="header" class="p-1" role="tab">
|
||||
<b-button block v-b-toggle.systembadges variant="light">
|
||||
<span class='float-left'>{{ text.sitebadges }}</span>
|
||||
<span class="when-open float-right"><i class='fa fa-caret-down'></i></span>
|
||||
<span class="when-closed float-right"><i class='fa fa-caret-right'></i></span>
|
||||
</b-button>
|
||||
</b-card-header>
|
||||
<b-collapse d="systembadges" accordion="my-accordion" role="tabpanel">
|
||||
<b-card-body>
|
||||
</div>
|
||||
</b-tab>
|
||||
<b-tab :title="text.sitebadges" v-if="!coaching">
|
||||
<div class="t-toolbox-badges-filter">
|
||||
<input v-model="filters.systembadges" @input="filter_systembadges" :placeholder="text.filter"></input>
|
||||
<a @click="reset_systembadges" v-if="filters.systembadges" href='#'
|
||||
><i class='fa fa-times'></i></a>
|
||||
</div>
|
||||
<div class="t-toolbox-badges-list">
|
||||
<ul class="t-badges">
|
||||
<li v-for="b in systembadges"><drag
|
||||
class="t-badge-drag"
|
||||
|
|
@ -4587,9 +4590,9 @@ export default {
|
|||
></template>
|
||||
</drag></li>
|
||||
</ul>
|
||||
</b-card-body>
|
||||
</b-collapse>
|
||||
</b-card>
|
||||
</div>
|
||||
</b-tab>
|
||||
</b-tabs>
|
||||
</b-tab>
|
||||
</b-tabs>
|
||||
</p-sidebar>
|
||||
|
|
|
|||
11907
amd/src/vue/vue.js
11907
amd/src/vue/vue.js
File diff suppressed because one or more lines are too long
|
|
@ -283,7 +283,8 @@ body.path-local-treestudyplan .editmode-switch-form > * {
|
|||
.path-local-treestudyplan ul.t-course-list,
|
||||
.features-treestudyplan ul.t-coursecat-list,
|
||||
.features-treestudyplan ul.t-course-list {
|
||||
padding-left: 1em;
|
||||
margin-top: 0.5rem;
|
||||
padding-left: 0;
|
||||
}
|
||||
.path-local-treestudyplan ul.t-coursecat-list ul.t-coursecat-list,
|
||||
.path-local-treestudyplan ul.t-coursecat-list ul.t-course-list,
|
||||
|
|
@ -293,7 +294,7 @@ body.path-local-treestudyplan .editmode-switch-form > * {
|
|||
.features-treestudyplan ul.t-coursecat-list ul.t-course-list,
|
||||
.features-treestudyplan ul.t-course-list ul.t-coursecat-list,
|
||||
.features-treestudyplan ul.t-course-list ul.t-course-list {
|
||||
padding-left: 1.5em;
|
||||
padding-left: 1rem;
|
||||
}
|
||||
.path-local-treestudyplan ul.t-item-module-children,
|
||||
.path-local-treestudyplan ul.t-coursecat-list li,
|
||||
|
|
@ -695,8 +696,55 @@ body.path-local-treestudyplan .editmode-switch-form > * {
|
|||
.features-treestudyplan .t-item-contextview .close-button {
|
||||
float: right;
|
||||
}
|
||||
.path-local-treestudyplan ul.t-toolbox li,
|
||||
.features-treestudyplan ul.t-toolbox li {
|
||||
.path-local-treestudyplan #p-sidebar-wrapper .p-sidebar.shown,
|
||||
.features-treestudyplan #p-sidebar-wrapper .p-sidebar.shown {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.path-local-treestudyplan #p-sidebar-wrapper .p-sidebar.shown .t-toolbox-tabs,
|
||||
.features-treestudyplan #p-sidebar-wrapper .p-sidebar.shown .t-toolbox-tabs {
|
||||
flex-grow: 4;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-tabs,
|
||||
.features-treestudyplan .t-toolbox-tabs {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-tabs .tab-content,
|
||||
.features-treestudyplan .t-toolbox-tabs .tab-content {
|
||||
flex: 1 0 0;
|
||||
min-height: 0;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-tabs .tab-pane,
|
||||
.features-treestudyplan .t-toolbox-tabs .tab-pane {
|
||||
height: 100%;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-courses,
|
||||
.features-treestudyplan .t-toolbox-courses {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
height: 100%;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-courses > *,
|
||||
.features-treestudyplan .t-toolbox-courses > * {
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-courses .t-toolbox-courselist,
|
||||
.features-treestudyplan .t-toolbox-courses .t-toolbox-courselist {
|
||||
flex: 1 1 0;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.path-local-treestudyplan ul.t-flow,
|
||||
.features-treestudyplan ul.t-flow {
|
||||
padding-left: 1rem;
|
||||
}
|
||||
.path-local-treestudyplan ul.t-flow li,
|
||||
.features-treestudyplan ul.t-flow li {
|
||||
list-style: none;
|
||||
}
|
||||
.path-local-treestudyplan .t-item-filter,
|
||||
|
|
@ -788,7 +836,31 @@ body.path-local-treestudyplan .editmode-switch-form > * {
|
|||
.path-local-treestudyplan ul.t-badges,
|
||||
.features-treestudyplan ul.t-badges {
|
||||
padding-left: 0;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-badges,
|
||||
.features-treestudyplan .t-toolbox-badges {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-badges .tab-content,
|
||||
.features-treestudyplan .t-toolbox-badges .tab-content {
|
||||
flex: 1 0 0;
|
||||
min-height: 0;
|
||||
height: 100%;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-badges .tab-content .tab-pane.active,
|
||||
.features-treestudyplan .t-toolbox-badges .tab-content .tab-pane.active {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-badges .tab-content .tab-pane.active .t-toolbox-badges-list,
|
||||
.features-treestudyplan .t-toolbox-badges .tab-content .tab-pane.active .t-toolbox-badges-list {
|
||||
height: 100%;
|
||||
min-height: 0;
|
||||
flex: 1 1 0;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.path-local-treestudyplan .t-badges li,
|
||||
.features-treestudyplan .t-badges li {
|
||||
|
|
@ -1958,6 +2030,7 @@ body.path-local-treestudyplan .editmode-switch-form > * {
|
|||
#p-sidebar-wrapper #p-sidebar-contentwrapper {
|
||||
flex: 1 1 auto;
|
||||
transition: all 0.3s ease-in-out;
|
||||
overflow-y: auto;
|
||||
}
|
||||
#p-sidebar-wrapper .p-sidebar {
|
||||
position: relative;
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@
|
|||
#p-sidebar-contentwrapper {
|
||||
flex: 1 1 auto;
|
||||
transition: all 0.3s ease-in-out;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.p-sidebar {
|
||||
|
|
@ -26,6 +27,7 @@
|
|||
transition: all 0.3s ease-in-out;
|
||||
z-index: 100;
|
||||
--p-sidebar-hideoffset: -320px;
|
||||
//overflow-y: auto;
|
||||
|
||||
&.p-sidebar-shadow {
|
||||
box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
|
||||
|
|
|
|||
|
|
@ -181,11 +181,12 @@
|
|||
|
||||
ul.t-coursecat-list,
|
||||
ul.t-course-list {
|
||||
padding-left: 1em;
|
||||
margin-top: 0.5rem;
|
||||
padding-left: 0;
|
||||
|
||||
ul.t-coursecat-list,
|
||||
ul.t-course-list {
|
||||
padding-left: 1.5em;
|
||||
padding-left: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -571,10 +572,50 @@
|
|||
float: right;
|
||||
}
|
||||
|
||||
#p-sidebar-wrapper .p-sidebar.shown {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.t-toolbox-tabs {
|
||||
flex-grow: 4;
|
||||
}
|
||||
}
|
||||
|
||||
ul.t-toolbox li {
|
||||
.t-toolbox-tabs {
|
||||
display:flex;
|
||||
flex-direction: column;
|
||||
.tab-content {
|
||||
flex: 1 0 0;
|
||||
min-height: 0;
|
||||
}
|
||||
.tab-pane {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.t-toolbox-courses {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
height: 100%;
|
||||
> * {
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
}
|
||||
.t-toolbox-courselist {
|
||||
flex: 1 1 0;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
overflow-y: auto;
|
||||
}
|
||||
}
|
||||
|
||||
ul.t-flow {
|
||||
padding-left: 1rem;
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
}
|
||||
|
||||
.t-item-filter {
|
||||
display: inline-block;
|
||||
|
|
@ -667,7 +708,30 @@
|
|||
|
||||
ul.t-badges {
|
||||
padding-left: 0;
|
||||
margin-top: 1rem;
|
||||
|
||||
}
|
||||
|
||||
.t-toolbox-badges {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.tab-content {
|
||||
flex: 1 0 0;
|
||||
min-height:0;
|
||||
height: 100%;
|
||||
.tab-pane.active {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5rem;
|
||||
.t-toolbox-badges-list {
|
||||
height: 100%;
|
||||
min-height: 0;
|
||||
flex: 1 1 0;
|
||||
overflow-y: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.t-badges li {
|
||||
|
|
|
|||
83
styles.css
83
styles.css
|
|
@ -283,7 +283,8 @@ body.path-local-treestudyplan .editmode-switch-form > * {
|
|||
.path-local-treestudyplan ul.t-course-list,
|
||||
.features-treestudyplan ul.t-coursecat-list,
|
||||
.features-treestudyplan ul.t-course-list {
|
||||
padding-left: 1em;
|
||||
margin-top: 0.5rem;
|
||||
padding-left: 0;
|
||||
}
|
||||
.path-local-treestudyplan ul.t-coursecat-list ul.t-coursecat-list,
|
||||
.path-local-treestudyplan ul.t-coursecat-list ul.t-course-list,
|
||||
|
|
@ -293,7 +294,7 @@ body.path-local-treestudyplan .editmode-switch-form > * {
|
|||
.features-treestudyplan ul.t-coursecat-list ul.t-course-list,
|
||||
.features-treestudyplan ul.t-course-list ul.t-coursecat-list,
|
||||
.features-treestudyplan ul.t-course-list ul.t-course-list {
|
||||
padding-left: 1.5em;
|
||||
padding-left: 1rem;
|
||||
}
|
||||
.path-local-treestudyplan ul.t-item-module-children,
|
||||
.path-local-treestudyplan ul.t-coursecat-list li,
|
||||
|
|
@ -695,8 +696,55 @@ body.path-local-treestudyplan .editmode-switch-form > * {
|
|||
.features-treestudyplan .t-item-contextview .close-button {
|
||||
float: right;
|
||||
}
|
||||
.path-local-treestudyplan ul.t-toolbox li,
|
||||
.features-treestudyplan ul.t-toolbox li {
|
||||
.path-local-treestudyplan #p-sidebar-wrapper .p-sidebar.shown,
|
||||
.features-treestudyplan #p-sidebar-wrapper .p-sidebar.shown {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.path-local-treestudyplan #p-sidebar-wrapper .p-sidebar.shown .t-toolbox-tabs,
|
||||
.features-treestudyplan #p-sidebar-wrapper .p-sidebar.shown .t-toolbox-tabs {
|
||||
flex-grow: 4;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-tabs,
|
||||
.features-treestudyplan .t-toolbox-tabs {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-tabs .tab-content,
|
||||
.features-treestudyplan .t-toolbox-tabs .tab-content {
|
||||
flex: 1 0 0;
|
||||
min-height: 0;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-tabs .tab-pane,
|
||||
.features-treestudyplan .t-toolbox-tabs .tab-pane {
|
||||
height: 100%;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-courses,
|
||||
.features-treestudyplan .t-toolbox-courses {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
height: 100%;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-courses > *,
|
||||
.features-treestudyplan .t-toolbox-courses > * {
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-courses .t-toolbox-courselist,
|
||||
.features-treestudyplan .t-toolbox-courses .t-toolbox-courselist {
|
||||
flex: 1 1 0;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.path-local-treestudyplan ul.t-flow,
|
||||
.features-treestudyplan ul.t-flow {
|
||||
padding-left: 1rem;
|
||||
}
|
||||
.path-local-treestudyplan ul.t-flow li,
|
||||
.features-treestudyplan ul.t-flow li {
|
||||
list-style: none;
|
||||
}
|
||||
.path-local-treestudyplan .t-item-filter,
|
||||
|
|
@ -788,7 +836,31 @@ body.path-local-treestudyplan .editmode-switch-form > * {
|
|||
.path-local-treestudyplan ul.t-badges,
|
||||
.features-treestudyplan ul.t-badges {
|
||||
padding-left: 0;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-badges,
|
||||
.features-treestudyplan .t-toolbox-badges {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-badges .tab-content,
|
||||
.features-treestudyplan .t-toolbox-badges .tab-content {
|
||||
flex: 1 0 0;
|
||||
min-height: 0;
|
||||
height: 100%;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-badges .tab-content .tab-pane.active,
|
||||
.features-treestudyplan .t-toolbox-badges .tab-content .tab-pane.active {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
.path-local-treestudyplan .t-toolbox-badges .tab-content .tab-pane.active .t-toolbox-badges-list,
|
||||
.features-treestudyplan .t-toolbox-badges .tab-content .tab-pane.active .t-toolbox-badges-list {
|
||||
height: 100%;
|
||||
min-height: 0;
|
||||
flex: 1 1 0;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.path-local-treestudyplan .t-badges li,
|
||||
.features-treestudyplan .t-badges li {
|
||||
|
|
@ -1958,6 +2030,7 @@ body.path-local-treestudyplan .editmode-switch-form > * {
|
|||
#p-sidebar-wrapper #p-sidebar-contentwrapper {
|
||||
flex: 1 1 auto;
|
||||
transition: all 0.3s ease-in-out;
|
||||
overflow-y: auto;
|
||||
}
|
||||
#p-sidebar-wrapper .p-sidebar {
|
||||
position: relative;
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user