0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2025-12-24 20:42:43 +00:00

Updated font awesome and sketching out the snippet bar

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

View File

@@ -35,18 +35,25 @@ var Editor = React.createClass({
</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(){
return(
<div className='editor'>
{this.renderTemplateIcons()}
{this.renderSnippetBar()}
<div className='snippetBar'>
{this.renderSnippetGroups()}
</div>
<CodeEditor wrap={true} language='gfm' value={this.props.value} onChange={this.handleTextChange} />
</div>
@@ -56,3 +63,31 @@ var Editor = React.createClass({
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>
},
});

View File

@@ -42,8 +42,27 @@
.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;
}
}

View File

@@ -2,7 +2,7 @@
<html>
<head>
<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 rel="icon" href="/assets/naturalCrit/favicon.ico" type="image/x-icon" />
{{=vitreum.css}}