f.weber/homebrewery
0
0
Fork 0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-09-23 09:42:56 +00:00
Code Wiki Activity

Merge branch 'master' into meta_a11y

Browse Source
This commit is contained in:
firstmatekidd
2026-08-20 13:54:36 -07:00
committed by GitHub
parent 9275ac4d12 3cce97de72
commit 4cf8c27ac4
13 changed files with 3238 additions and 3459 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/homebrew/editor/snippetbar/snippetbar.jsx
+10 -8
View File
@@ -188,7 +188,7 @@ const Snippetbar = createReactClass({
const snippets = this.state.snippets.filter((snippetGroup)=>snippetGroup.view === this.props.view);
if(snippets.length === 0) return null;
return <div className='snippets'>
return <ul className='snippets' role='menubar' aria-label='Snippets Menubar'>
{_.map(snippets, (snippetGroup)=>{
return <SnippetGroup
brew={this.props.brew}
@@ -201,7 +201,7 @@ const Snippetbar = createReactClass({
/>;
})
}
</div>;
</ul>;
},
replaceContent : function(item){
@@ -327,12 +327,14 @@ const SnippetGroup = createReactClass({
return _.map(snippets, (snippet)=>{
if(!snippet.subsnippets){
return (
<button className='menu-item' key={snippet.name} onClick={(e)=>this.handleSnippetClick(e, snippet)} role='menuitem'>
<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>}
</button>
<li key={snippet.name} role='none'>
<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='status'>beta</span>}
{snippet.disabled && <span className='status' title='temporarily disabled due to large slowdown; under re-design'>disabled</span>}
</button>
</li>
);
} else if(snippet.subsnippets){
return (
client/homebrew/editor/snippetbar/snippetbar.less
+13 -47
View File
@@ -3,6 +3,8 @@
@import (less) '@themes/fonts/5e/fonts.less';
.snippetBar {
--activeTriggerColor: inherit;
--menuColor : #DDDDDD;
@menuHeight : 25px;
position : relative;
display : flex;
@@ -16,12 +18,6 @@
text-transform: uppercase;
font-weight: 800;
.snippets {
display : flex;
justify-content : flex-start;
min-width : 499.35px; //must be controlled every time an item is added, must be hardcoded for the wrapping as it is applied
}
.editors {
display : flex;
justify-content : flex-end;
@@ -118,23 +114,7 @@
}
}
}
.snippetBarButton {
display : inline-block;
height : @menuHeight;
padding : 0px 5px;
font-size : 0.625em;
font-weight : 800;
line-height : @menuHeight;
text-transform : uppercase;
text-wrap : nowrap;
cursor : pointer;
&:hover, &.selected { background-color : #999999; }
i {
margin-right : 3px;
font-size : 1.4em;
vertical-align : middle;
}
}
.toggleMeta {
position : absolute;
top : 0px;
@@ -143,20 +123,15 @@
.tooltipLeft('Edit Brew Properties');
}
.menu-wrapper {
.menu-item:is(.snippets > .menu-wrapper > .menu-item):first-child {
.caret {
display: none;
}
}
.menu-list {
padding : 0px;
background-color : #DDDDDD;
}
.snippets {
display : flex;
justify-content : flex-start;
min-width : 565.95px; //must be controlled every time an item is added, must be hardcoded for the wrapping as it is applied
}
// removed caret for top level items, by request (makes buttons too wide).
.menu-wrapper .menu-item:is(.snippets > .menu-wrapper > .menu-item):first-child .caret { display: none; }
.menu-item {
position : relative;
display : flex;
@@ -166,9 +141,8 @@
padding : 5px;
cursor : pointer;
width: 100%;
.animate(background-color);
&:is(.menu-list .menu-item) [class*="name"] {
padding-inline: 8px;
padding-inline: 8px; // additional space between icon and name (helpful in Fonts menu especially).
}
.menu-name {
flex: 1;
@@ -214,8 +188,7 @@
}
}
.name { margin-right : auto; }
.disabled { text-decoration : line-through; }
.beta {
.status {
align-self : center;
padding : 4px 6px;
margin-left : 5px;
@@ -234,15 +207,8 @@
&:hover { background-color: unset; }
}
}
.disabledSnippets {
color: grey;
cursor: not-allowed;
&:hover { background-color: #DDDDDD;}
}
}
@container editor (width < 750px) {
@container editor (width < 816px) {
.snippetBar {
.editors {
flex : 1;