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:
@@ -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>
|
||||
},
|
||||
|
||||
});
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
@@ -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}}
|
||||
|
||||
Reference in New Issue
Block a user