mirror of
				https://gitee.com/gitea/gitea
				synced 2025-11-04 16:40:24 +08:00 
			
		
		
		
	Use tippy.js for context popup (#20393)
By appending the tooltips to `document.body`, we can avoid any stacking context issues caused by surrounding element's CSS. This uses [tippy.js](https://github.com/atomiks/tippyjs) instead of Fomantic popups. We should aim to replace all Fomantic popups with this eventually and then get rid of the Fomantic `popup` module completely.
This commit is contained in:
		
							
								
								
									
										12
									
								
								web_src/js/modules/tippy.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										12
									
								
								web_src/js/modules/tippy.js
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,12 @@
 | 
			
		||||
import tippy from 'tippy.js';
 | 
			
		||||
 | 
			
		||||
export function createTippy(target, opts) {
 | 
			
		||||
  return tippy(target, {
 | 
			
		||||
    appendTo: document.body,
 | 
			
		||||
    placement: 'top-start',
 | 
			
		||||
    animation: false,
 | 
			
		||||
    allowHTML: true,
 | 
			
		||||
    arrow: `<svg width="16" height="7"><path d="m0 7 8-7 8 7Z" class="tippy-svg-arrow-outer"/><path d="m0 8 8-7 8 7Z" class="tippy-svg-arrow-inner"/></svg>`,
 | 
			
		||||
    ...opts,
 | 
			
		||||
  });
 | 
			
		||||
}
 | 
			
		||||
		Reference in New Issue
	
	Block a user