gio
/
think
mirror of https://github.com/fantasticit/think.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

tiptap: fix list

This commit is contained in:
fantasticit 2022-05-09 17:00:05 +08:00
parent 7ac3355cc2
commit ef5e45aec1
5 changed files with 5 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
packages/client/src/tiptap/core/wrappers/emoji-list/index.module.scss
View File

@ -5,10 +5,6 @@
overflow-y: auto; overflow-y: auto;
border-radius: var(--border-radius); border-radius: var(--border-radius);
box-shadow: rgb(9 30 66 / 31%) 0 0 1px, rgb(9 30 66 / 25%) 0 4px 8px -2px; box-shadow: rgb(9 30 66 / 31%) 0 0 1px, rgb(9 30 66 / 25%) 0 4px 8px -2px;
&::-webkit-scrollbar {
background-color: #fff !important;
}
} }
.item { .item {
@ -21,7 +17,6 @@
background-color: rgb(255 255 255); background-color: rgb(255 255 255);
border: 0; border: 0;
border-radius: 0; border-radius: 0;
outline: none;
flex: 0 0 auto; flex: 0 0 auto;
align-items: center; align-items: center;

2
packages/client/src/tiptap/core/wrappers/emoji-list/index.tsx
View File

@ -36,7 +36,7 @@ export const EmojiList: React.FC<IProps> = forwardRef((props, ref) => {
useEffect(() => { useEffect(() => {
if (Number.isNaN(selectedIndex + 1)) return; if (Number.isNaN(selectedIndex + 1)) return;
const el = $container.current.querySelector(`button:nth-of-type(${selectedIndex + 1})`); const el = $container.current.querySelector(`span:nth-of-type(${selectedIndex + 1})`);
el && scrollIntoView(el, { behavior: 'smooth', scrollMode: 'if-needed' }); el && scrollIntoView(el, { behavior: 'smooth', scrollMode: 'if-needed' });
}, [selectedIndex]); }, [selectedIndex]);

8
packages/client/src/tiptap/core/wrappers/mention-list/index.module.scss
View File

@ -1,9 +1,8 @@
.items { .items {
width: 200px; width: 160px;
max-height: 380px; max-height: 320px;
overflow-x: hidden; overflow-x: hidden;
overflow-y: auto; overflow-y: auto;
background-color: var(--semi-color-bg-0);
border-radius: var(--border-radius); border-radius: var(--border-radius);
box-shadow: rgb(9 30 66 / 31%) 0 0 1px, rgb(9 30 66 / 25%) 0 4px 8px -2px; box-shadow: rgb(9 30 66 / 31%) 0 0 1px, rgb(9 30 66 / 25%) 0 4px 8px -2px;
} }
@ -18,11 +17,8 @@
background-color: rgb(255 255 255); background-color: rgb(255 255 255);
border: 0; border: 0;
border-radius: 0; border-radius: 0;
outline: 0;
flex: 0 0 auto; flex: 0 0 auto;
align-items: center; align-items: center;
box-sizing: border-box;
fill: rgb(255 255 255);
&:hover { &:hover {
background-color: #f4f5f7; background-color: #f4f5f7;

2
packages/client/src/tiptap/core/wrappers/mention-list/index.tsx
View File

@ -36,7 +36,7 @@ export const MentionList: React.FC<IProps> = forwardRef((props, ref) => {
useEffect(() => { useEffect(() => {
if (Number.isNaN(selectedIndex + 1)) return; if (Number.isNaN(selectedIndex + 1)) return;
const el = $container.current.querySelector(`button:nth-of-type(${selectedIndex + 1})`); const el = $container.current.querySelector(`span:nth-of-type(${selectedIndex + 1})`);
el && scrollIntoView(el, { behavior: 'smooth', scrollMode: 'if-needed' }); el && scrollIntoView(el, { behavior: 'smooth', scrollMode: 'if-needed' });
}, [selectedIndex]); }, [selectedIndex]);

2
packages/client/src/tiptap/core/wrappers/menu-list/index.tsx
View File

@ -42,7 +42,7 @@ export const MenuList: React.FC<IProps> = forwardRef((props, ref) => {
useEffect(() => { useEffect(() => {
if (Number.isNaN(selectedIndex + 1)) return; if (Number.isNaN(selectedIndex + 1)) return;
const el = $container.current.querySelector(`button:nth-of-type(${selectedIndex + 1})`); const el = $container.current.querySelector(`span:nth-of-type(${selectedIndex + 1})`);
el && scrollIntoView(el, { behavior: 'smooth', scrollMode: 'if-needed' }); el && scrollIntoView(el, { behavior: 'smooth', scrollMode: 'if-needed' });
}, [selectedIndex]); }, [selectedIndex]);