diff --git a/client/homebrew/editor/editor.jsx b/client/homebrew/editor/editor.jsx index 60bf7f1d6..414c7ce93 100644 --- a/client/homebrew/editor/editor.jsx +++ b/client/homebrew/editor/editor.jsx @@ -35,18 +35,25 @@ var Editor = React.createClass({ ; }) }, - renderSnippetBar : function(){ - return
- Snippet bar yo -
+ + renderSnippetGroups : function(){ + return _.map(Snippets, (snippetGroup)=>{ + return + }) }, render : function(){ return(
{this.renderTemplateIcons()} - {this.renderSnippetBar()} +
+ {this.renderSnippetGroups()} +
@@ -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
+ +
+ }, + +}); \ No newline at end of file diff --git a/client/homebrew/editor/editor.less b/client/homebrew/editor/editor.less index fa64b8a61..25f50c6b3 100644 --- a/client/homebrew/editor/editor.less +++ b/client/homebrew/editor/editor.less @@ -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; + } } diff --git a/client/template.dot b/client/template.dot index 818bfe57d..743463095 100644 --- a/client/template.dot +++ b/client/template.dot @@ -2,7 +2,7 @@ - + {{=vitreum.css}}