RPJosh
/
memories
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

scroller: reduce repaints 

Signed-off-by: Varun Patil <radialapps@gmail.com>
pull/888/head
Varun Patil 2023-10-19 14:13:53 -07:00
parent 2a333911ef
commit e96b10da46
1 changed files with 20 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/components/ScrollerManager.vue
View File

@ -35,6 +35,7 @@
</div> </div>
</span> </span>
<div class="ticks-container fill-block">
<div <div
v-for="tick of visibleTicks" v-for="tick of visibleTicks"
:key="tick.key" :key="tick.key"
@ -45,6 +46,7 @@
<span v-if="tick.text">{{ tick.text }}</span> <span v-if="tick.text">{{ tick.text }}</span>
</div> </div>
</div> </div>
</div>
</template> </template>
<script lang="ts"> <script lang="ts">
@ -632,7 +634,14 @@ export default defineComponent({
visibility: hidden; visibility: hidden;
} }
> .tick { > .ticks-container {
top: 0;
left: 0;
position: absolute;
pointer-events: none;
}
> .ticks-container > .tick {
pointer-events: none; pointer-events: none;
position: absolute; position: absolute;
font-size: 0.75em; font-size: 0.75em;
@ -721,11 +730,11 @@ export default defineComponent({
pointer-events: all; pointer-events: all;
} }
> .tick { > .ticks-container > .tick {
right: 40px; right: 40px;
} }
&:not(.scrolling) { &:not(.scrolling) {
> .tick { > .ticks-container > .tick {
display: none; display: none;
} }
} }