fix bookmark scale when direction is right

This commit is contained in:
zombieFox 2022-05-24 21:39:54 +01:00
parent 9a0d58c65c
commit d9cbf0eab7
3 changed files with 17 additions and 7 deletions

View File

@ -109,7 +109,7 @@ export const BookmarkGroup = function(bookmarkGroupData, allBookmarkGroup) {
bookmarkGroupData.list.forEach((listItem, index) => {
const bookmarkLink = new BookmarkLink(listItem, (bookmarkGroupData.list.length - index));
const bookmarkLink = new BookmarkLink(listItem, bookmarkGroupData.list.length, index);
bookmarkLink.render();
@ -139,4 +139,4 @@ export const BookmarkGroup = function(bookmarkGroupData, allBookmarkGroup) {
this.group = () => this.node.groupItem;
}
}

View File

@ -15,7 +15,7 @@
.bookmark-group-item:focus-within .bookmark-link,
.bookmark-group-active .bookmark-link {
transform: scale(1);
transition: transform var(--theme-transition-xslow-bounce) 0s;
transition: transform var(--theme-transition-slow-bounce) 0s;
}
.bookmark-group-item:focus-within .bookmark-link:hover,
@ -46,4 +46,4 @@
.bookmark-image {
max-height: 1em;
}
}

View File

@ -2,7 +2,7 @@ import { config } from '../../config';
import './index.css';
export const BookmarkLink = function(linkData, delay) {
export const BookmarkLink = function(linkData, listCount, index) {
this.node = {
link: document.createElement('a'),
@ -16,7 +16,17 @@ export const BookmarkLink = function(linkData, delay) {
this.node.link.classList.add('bookmark-link');
this.node.link.style.setProperty('--bookmark-link-delay', (delay / 20));
switch (config.bookmark.direction) {
case 'left':
this.node.link.style.setProperty('--bookmark-link-delay', ((listCount - index) / 20));
break;
case 'right':
this.node.link.style.setProperty('--bookmark-link-delay', ((listCount - (listCount - index)) / 20));
break;
}
this.node.link.href = linkData.url;
@ -70,4 +80,4 @@ export const BookmarkLink = function(linkData, delay) {
this.link = () => this.node.link;
}
}