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

Updated font awesome and sketching out the snippet bar

Browse Source
This commit is contained in:
Scott Tolksdorf
2016-05-05 10:03:51 -04:00
parent f38f76b7c4
commit c418ea5b42
3 changed files with 61 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
client/homebrew/editor/editor.jsx
View File

@@ -35,18 +35,25 @@ var Editor = React.createClass({
</div>; </div>;
}) })
}, },
renderSnippetBar : function(){
return <div className='snippetBar'>
Snippet bar yo
</div>
renderSnippetGroups : function(){
return _.map(Snippets, (snippetGroup)=>{
return <SnippetGroup
groupName={snippetGroup.groupName}
icon={snippetGroup.icon}
snippets={snippetGroup.snippets}
/>
})
}, },
render : function(){ render : function(){
return( return(
<div className='editor'> <div className='editor'>
{this.renderTemplateIcons()} {this.renderTemplateIcons()}
{this.renderSnippetBar()} <div className='snippetBar'>
{this.renderSnippetGroups()}
</div>
<CodeEditor wrap={true} language='gfm' value={this.props.value} onChange={this.handleTextChange} /> <CodeEditor wrap={true} language='gfm' value={this.props.value} onChange={this.handleTextChange} />
</div> </div>
@@ -56,3 +63,31 @@ var Editor = React.createClass({
module.exports = Editor; module.exports = Editor;
var SnippetGroup = React.createClass({
getDefaultProps: function() {
return {
groupName : '',
icon : 'fa-rocket',
snippets : [],
onSnippetClick : function(){},
};
},
getInitialState: function() {
return {
};
},
handleSnippetClick : function(){
},
render : function(){
return <div className='snippetGroup'>
<i className={'fa fa-fw ' + this.props.icon} />
</div>
},
});

21
client/homebrew/editor/editor.less
View File

@@ -42,8 +42,27 @@
.snippetBar{ .snippetBar{
background-color: #bbb; padding : 5px;
background-color: #ddd;
display: flex;
align-items: center;
//justify-content: center;
.snippetGroup{
.animate(background-color);
border-radius : 5px;
&:hover, &.selected{
background-color: #999;
}
padding : 5px;
font-size: 20px;
margin: 0px 10px;
//cursor : pointer;
}
} }

2
client/template.dot
View File

@@ -2,7 +2,7 @@
<html> <html>
<head> <head>
<script>global=window</script> <script>global=window</script>
<link href="//netdna.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet" /> <link href="//netdna.bootstrapcdn.com/font-awesome/4.6.2/css/font-awesome.min.css" rel="stylesheet" />
<link href="//fonts.googleapis.com/css?family=Open+Sans:400,300,600,700" rel="stylesheet" type="text/css" /> <link href="//fonts.googleapis.com/css?family=Open+Sans:400,300,600,700" rel="stylesheet" type="text/css" />
<link rel="icon" href="/assets/naturalCrit/favicon.ico" type="image/x-icon" /> <link rel="icon" href="/assets/naturalCrit/favicon.ico" type="image/x-icon" />
{{=vitreum.css}} {{=vitreum.css}}