add disabled attribute to items. beta to status

Adds the `disabled` attribute to a menu-item button if it's disabled, not just as a className.  Styling changes centered on that as well.

Also changes the `beta` class to `status` because it is used for both `beta` and `disabled` indicators.  Styling changes for that.
This commit is contained in:
Gazook89
2026-07-09 14:10:49 -05:00
parent c5db25f076
commit 794c2fa09d
2 changed files with 4 additions and 5 deletions
@@ -328,11 +328,11 @@ const SnippetGroup = createReactClass({
if(!snippet.subsnippets){
return (
<li key={snippet.name} role='none'>
<button className='menu-item' onClick={(e)=>this.handleSnippetClick(e, snippet)} role='menuitem' aria-label={snippet.name}>
<button className='menu-item' onClick={(e)=>this.handleSnippetClick(e, snippet)} role='menuitem' aria-label={snippet.name} disabled={snippet.disabled}>
<i className={snippet.icon} />
<span className={`name${snippet.disabled ? ' disabled' : ''}`} title={snippet.name}>{snippet.name}</span>
{snippet.experimental && <span className='beta'>beta</span>}
{snippet.disabled && <span className='beta' title='temporarily disabled due to large slowdown; under re-design'>disabled</span>}
{snippet.experimental && <span className='status'>beta</span>}
{snippet.disabled && <span className='status' title='temporarily disabled due to large slowdown; under re-design'>disabled</span>}
</button>
</li>
);
@@ -214,8 +214,7 @@
}
}
.name { margin-right : auto; }
.disabled { text-decoration : line-through; }
.beta {
.status {
align-self : center;
padding : 4px 6px;
margin-left : 5px;