f.weber/homebrewery
0
0
Fork 0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-03-22 08:58:11 +00:00
Code Wiki Activity

last of tooltips

Browse Source
This commit is contained in:
Víctor Losada Hernández
2026-02-23 14:10:25 +01:00
parent 4691817c88
commit 533a79d4e2
3 changed files with 14 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
client/components/combobox.jsx
View File

@@ -72,11 +72,12 @@ const Combobox = createReactClass({
<div className='dropdown-input item' <div className='dropdown-input item'
onMouseEnter={this.props.trigger == 'hover' ? ()=>{this.handleDropdown(true);} : undefined} onMouseEnter={this.props.trigger == 'hover' ? ()=>{this.handleDropdown(true);} : undefined}
onClick= {this.props.trigger == 'click' ? ()=>{this.handleDropdown(true);} : undefined} onClick= {this.props.trigger == 'click' ? ()=>{this.handleDropdown(true);} : undefined}
{...(this.props.tooltip ? { 'data-tooltip-bottom': this.props.tooltip } : {})}> {...(this.props.tooltip ? { 'data-tooltip-right': this.props.tooltip } : {})}>
<input <input
type='text' type='text'
onChange={(e)=>this.handleInput(e)} onChange={(e)=>this.handleInput(e)}
value={this.state.value || ''} value={this.state.value || ''}
title=''
pattern={this.props.valuePatterns} pattern={this.props.valuePatterns}
placeholder={this.props.placeholder} placeholder={this.props.placeholder}
onBlur={(e)=>{ onBlur={(e)=>{

3
client/homebrew/editor/metadataEditor/metadataEditor.jsx
View File

@@ -213,7 +213,7 @@ const MetadataEditor = createReactClass({
</div>; </div>;
} else { } else {
dropdown = dropdown =
<div className='value'> <div className='value' data-tooltip-top='Select from the list below (built-in themes and brews you have tagged "meta:theme"), or paste in the Share URL or Share ID of any brew.'>
<Combobox trigger='click' <Combobox trigger='click'
className='themes-dropdown' className='themes-dropdown'
default={currentThemeDisplay} default={currentThemeDisplay}
@@ -231,7 +231,6 @@ const MetadataEditor = createReactClass({
filterOn : ['value', 'title'] filterOn : ['value', 'title']
}} }}
/> />
<small>Select from the list below (built-in themes and brews you have tagged "meta:theme"), or paste in the Share URL or Share ID of any brew.</small>
</div>; </div>;
} }

14
shared/naturalcrit/styles/tooltip.less
View File

@@ -35,6 +35,7 @@
&::before, &::after { &::before, &::after {
bottom : 100%; bottom : 100%;
left : 50%; left : 50%;
translate: -50% 0;
} }
&:hover::after, &:hover::before, &:focus::after, &:focus::before { &:hover::after, &:hover::before, &:focus::after, &:focus::before {
.transform(translateY(-(@arrowSize + 2))); .transform(translateY(-(@arrowSize + 2)));
@@ -50,6 +51,7 @@
&::before, &::after { &::before, &::after {
top : 100%; top : 100%;
left : 50%; left : 50%;
translate: -50% 0;
} }
&:hover::after, &:hover::before, &:focus::after, &:focus::before { &:hover::after, &:hover::before, &:focus::after, &:focus::before {
.transform(translateY(@arrowSize + 2)); .transform(translateY(@arrowSize + 2));
@@ -62,7 +64,10 @@
margin-bottom : -@arrowSize; margin-bottom : -@arrowSize;
border-left-color : @tooltipColor; border-left-color : @tooltipColor;
} }
&::after { margin-bottom : -14px;} &::after {
margin-bottom : -14px;
max-width : 50ch;
}
&::before, &::after { &::before, &::after {
right : 100%; right : 100%;
bottom : 50%; bottom : 50%;
@@ -78,7 +83,10 @@
margin-left : -@arrowSize * 2; margin-left : -@arrowSize * 2;
border-right-color : @tooltipColor; border-right-color : @tooltipColor;
} }
&::after { margin-bottom : -14px;} &::after {
margin-bottom : -14px;
max-width : 50ch;
}
&::before, &::after { &::before, &::after {
top : 50%; top : 50%;
left : 100%; left : 100%;
@@ -114,7 +122,7 @@
color : white; color : white;
content : @content; content : @content;
background : @tooltipColor; background : @tooltipColor;
max-width : 50ch; max-width : 60ch;
width :max-content; width :max-content;
word-break : break-word; word-break : break-word;
overflow-wrap : break-word; overflow-wrap : break-word;