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

improve simple styling on theme selector. nest inside toggle.

Browse Source
This commit is contained in:
Gazook89
2023-12-22 22:58:13 -06:00
parent 985a9843f2
commit 7b8e398891
2 changed files with 18 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -176,8 +176,9 @@ const Snippetbar = createClass({
<div className={`editorTool editorTheme ${this.state.themeSelector ? 'active' : ''}`} <div className={`editorTool editorTheme ${this.state.themeSelector ? 'active' : ''}`}
onClick={this.toggleThemeSelector} > onClick={this.toggleThemeSelector} >
<i className='fas fa-palette' /> <i className='fas fa-palette' />
{this.state.themeSelector && this.renderThemeSelector()}
</div> </div>
{this.state.themeSelector && this.renderThemeSelector()}
<div className='divider'></div> <div className='divider'></div>
<div className={cx('text', { selected: this.props.view === 'text' })} <div className={cx('text', { selected: this.props.view === 'text' })}
onClick={()=>this.props.onViewChange('text')}> onClick={()=>this.props.onViewChange('text')}>

28
client/homebrew/editor/snippetbar/snippetbar.less
View File

@@ -61,13 +61,14 @@
color : black; color : black;
} }
} }
&.editorTheme{ &.editorTheme {
.tooltipLeft('Editor Themes'); .tooltipLeft('Editor Themes');
font-size : 0.75em; font-size : 0.75em;
color : black; color : black;
&.active{ &.active {
color : white; position : relative;
background-color: black; color : white;
background-color : black;
} }
} }
&.divider { &.divider {
@@ -78,14 +79,17 @@
} }
} }
} }
.themeSelector{ .themeSelector {
position: absolute; position : absolute;
left: -65px; top : 25px;
top: 30px; right : 0;
z-index: 999; z-index : 1;
width: 170px; display : flex;
background-color: black; align-items : center;
border-radius: 5px; justify-content : center;
width : 170px;
height : inherit;
background-color : inherit;
} }
} }
.snippetBarButton{ .snippetBarButton{