mirror of
https://github.com/naturalcrit/homebrewery.git
synced 2026-09-23 07:32:58 +00:00
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:
@@ -328,11 +328,11 @@ const SnippetGroup = createReactClass({
|
|||||||
if(!snippet.subsnippets){
|
if(!snippet.subsnippets){
|
||||||
return (
|
return (
|
||||||
<li key={snippet.name} role='none'>
|
<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} />
|
<i className={snippet.icon} />
|
||||||
<span className={`name${snippet.disabled ? ' disabled' : ''}`} title={snippet.name}>{snippet.name}</span>
|
<span className={`name${snippet.disabled ? ' disabled' : ''}`} title={snippet.name}>{snippet.name}</span>
|
||||||
{snippet.experimental && <span className='beta'>beta</span>}
|
{snippet.experimental && <span className='status'>beta</span>}
|
||||||
{snippet.disabled && <span className='beta' title='temporarily disabled due to large slowdown; under re-design'>disabled</span>}
|
{snippet.disabled && <span className='status' title='temporarily disabled due to large slowdown; under re-design'>disabled</span>}
|
||||||
</button>
|
</button>
|
||||||
</li>
|
</li>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -214,8 +214,7 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.name { margin-right : auto; }
|
.name { margin-right : auto; }
|
||||||
.disabled { text-decoration : line-through; }
|
.status {
|
||||||
.beta {
|
|
||||||
align-self : center;
|
align-self : center;
|
||||||
padding : 4px 6px;
|
padding : 4px 6px;
|
||||||
margin-left : 5px;
|
margin-left : 5px;
|
||||||
|
|||||||
Reference in New Issue
Block a user