f.weber/homebrewery
0
0
Fork 0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-08-06 06:47:38 +00:00
Code Wiki Activity

fix oddbird polyfill so custom properties are used correctly

Browse Source 
Co-authored-by: Copilot <copilot@github.com>
This commit is contained in:
Gazook89
2026-04-25 22:16:25 -05:00
parent 359d87440b
commit d686c78fdf
2 changed files with 6 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/components/dropdown/dropdown.jsx
+5 -3
View File
@@ -28,13 +28,14 @@ const Dropdown = ({ groupName, className = null, icon, children, color = null, c
const isSubMenu = depth > 0;
const wrapperRef = useRef(null);
const triggerRef = useRef(null);
const menuRef = useRef(null);
// Use setAttribute instead of the React style prop because React silently strips unknown CSS
// use setAttribute instead of the React style prop because React strips unknown CSS
// properties (like anchor-name) from inline styles in browsers that don't support them.
// setAttribute writes raw CSS text that the anchor positioning polyfill can read.
// setAttribute writes raw CSS text that the anchor positioning polyfill can read
useEffect(()=>{
wrapperRef.current?.setAttribute('style', `anchor-name: ${anchorName}`);
triggerRef.current?.setAttribute('style', `anchor-name: ${anchorName}`);
menuRef.current?.setAttribute('style', `position-anchor: ${anchorName}`);
}, [anchorName]);
@@ -78,6 +79,7 @@ const Dropdown = ({ groupName, className = null, icon, children, color = null, c
aria-haspopup='menu'
role='menuitem'
disabled={children.length > 0 ? false : true}
ref={triggerRef}
>
{trigger(groupName)}
</button>