Miqra-Engineering/moodle_local_treestudyplan
2
0
Fork 0
Code Issues 8 Pull Requests Packages Projects Releases 4 Wiki Activity

Scrolling fixes (arrows,etc)

Browse Source
This commit is contained in:
PMKuipers 2023-07-08 07:51:48 +02:00
parent 1932883880
commit a4f4503faf
2 changed files with 25 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
amd/src/studyplan-editor-components.js
View File

@ -1348,7 +1348,8 @@ export default {
></t-studyline-heading> ></t-studyline-heading>
</div> </div>
<!-- Next, paint all the cells in the scrollable --> <!-- Next, paint all the cells in the scrollable -->
<div class="t-studyplan-scrollable" :style="columns_stylerule"> <div class="t-studyplan-scrollable" >
<div class="t-studyplan-timeline" :style="columns_stylerule">
<!-- Line by line add the items --> <!-- Line by line add the items -->
<!-- The grid layout handles putting it in rows and columns --> <!-- The grid layout handles putting it in rows and columns -->
<template v-for="(line,lineindex) in value.studylines" <template v-for="(line,lineindex) in value.studylines"
@ -1372,12 +1373,9 @@ export default {
> >
</t-studyline-slot </t-studyline-slot
></template ></template
></template> ></template
></div><div :id="'studyplan-linewrapper-'+value.id" class='l-leaderline-linewrapper'></div>
</div> </div>
<div class='t-studyplan-content-timeline'>
</div>
<div :id="'studyplan-linewrapper-'+value.id" class='l-leaderline-linewrapper'></div>
</div> </div>
<div v-if="edit.studyline.editmode" class='t-studyline-add'> <div v-if="edit.studyline.editmode" class='t-studyline-add'>
<a href="#" v-b-modal="'modal-add-studyline-'+value.id" @click="false;" <a href="#" v-b-modal="'modal-add-studyline-'+value.id" @click="false;"

23
css/devstyles.css
View File

@ -25,15 +25,34 @@
display: block; display: block;
} }
.t-studyplan-scrollable { .t-studyplan-timeline {
display: grid; display: grid;
overflow-x: scroll;
/* grid-template-columns will be set in the style attribute */ /* grid-template-columns will be set in the style attribute */
/* Use the variables below to specify width for filter spots and course spots */ /* Use the variables below to specify width for filter spots and course spots */
--studyplan-filter-width: auto; /* better leave this at auto for now*/ --studyplan-filter-width: auto; /* better leave this at auto for now*/
--studyplan-course-width: auto; /* better leave this at auto for now*/ --studyplan-course-width: auto; /* better leave this at auto for now*/
} }
.t-studyplan-scrollable {
overflow-x: scroll;
scrollbar-color: var(--primary) color-mix(in srgb, var(--primary) 20%, white);
scrollbar-width: thin;
}
.t-studyplan-scrollable::-webkit-scrollbar {
width: 8px;
}
/* Track */
.t-studyplan-scrollable::-webkit-scrollbar-track {
background: color-mix(in srgb, var(--primary) 20%, white);
}
/* Handle */
.t-studyplan-scrollable::-webkit-scrollbar-thumb {
background:var(--primary);
}
.t-studyplan-column-heading { .t-studyplan-column-heading {
color: inherit; /* placeholder */ color: inherit; /* placeholder */
} }