Scrolling fixes (arrows,etc)
This commit is contained in:
parent
1932883880
commit
a4f4503faf
2 changed files with 25 additions and 8 deletions
|
@ -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;"
|
||||||
|
|
|
@ -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 */
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue