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

Add icons to menu triggers

Browse Source 
This fixes the odd alignments of menu-wrapper names by ensuring that both menuitems and menu-wrappers (actually their child triggers) both have space for icons.
This commit is contained in:
Gazook89
2026-05-28 11:43:05 -05:00
parent 2e4439c9f4
commit 3110d2cc69
1 changed files with 3 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/components/dropdown/dropdown.jsx
+3 -3
View File
@@ -64,10 +64,10 @@ const Dropdown = ({ groupName, className = null, icon, children, color = null, c
// the trigger is the piece placed inside the opening button of the menu. // the trigger is the piece placed inside the opening button of the menu.
// This method allows for creating a generic span with the group name, // This method allows for creating a generic span with the group name,
// or using a bespoke element (like a graphic) passed in from props to be used as the trigger // or using a bespoke element (like a graphic) passed in from props to be used as the trigger
const trigger = (groupName)=>{ const trigger = (groupName, icon)=>{
if(!customTrigger){ if(!customTrigger){
return <> return <>
<span className='menu-name'>{groupName}</span><i className={`caret fas fa-caret-${isSubMenu ? 'right' : 'down'}`}></i> <i className={icon}></i><span className='menu-name'>{groupName}</span><i className={`caret fas fa-caret-${isSubMenu ? 'right' : 'down'}`}></i>
</>; </>;
} else { } else {
return customTrigger; return customTrigger;
@@ -104,7 +104,7 @@ const Dropdown = ({ groupName, className = null, icon, children, color = null, c
disabled={!React.Children.count(children)} disabled={!React.Children.count(children)}
ref={triggerRef} ref={triggerRef}
> >
{trigger(groupName)} {trigger(groupName, icon)}
</button> </button>
<MenuDepthContext.Provider value={depth + 1}> <MenuDepthContext.Provider value={depth + 1}>
<div <div