Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Update button tooltips

  • Loading branch information...
commit 8421da2b58eb6eb2a0afeab2102844350e478365 1 parent a6d0346
David Petersen authored
30 assets/css/app.css
View
@@ -44,6 +44,14 @@ legend {
border-bottom: 1px solid #CCC;
}
+[class^="icon-"], [class*=" icon-"] {
+ opacity: 0.7;
+}
+
+[class^="icon-"]:hover, [class*=" icon-"]:hover {
+ opacity: 1.0;
+}
+
/* NotePanda stuff */
.new_note {
@@ -71,13 +79,21 @@ legend {
}
.note_input {
- height: 300px;
+ height: 500px;
+}
+
+.item_header h3 {
+ display: inline;
+ margin-top: 5px;
}
-.note_buttons {
- border-top: 1px solid #CCC;
- margin-top: 15px;
- padding-top: 15px;
+.note_header {
+ border-bottom: 1px solid #CCC;
+ margin-bottom: 20px;
+}
+
+.note_header .note_icons {
+ display: inline;
-moz-opacity: 0.00;
opacity: 0.00;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=0);
@@ -92,11 +108,11 @@ legend {
-o-transition-duration: 0.5s;
-o-transition-delay: 0.25s;
transition-property: opacity;
- transition-duration: 0.5s;
transition-delay: 0.25s;
+ transition-duration: 0.5s;
}
-.well:hover .note_buttons {
+.well:hover .note_icons {
-moz-opacity: 1;
opacity: 1;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=100);
1  assets/js/app.js
View
@@ -56,6 +56,7 @@ $(document).ready(function(){
model: panda.notes.get(nid)
});
$('.content').html(view.render().el);
+ view.attachToolTip();
},
new_note: function(pid) {
11 assets/js/views.js
View
@@ -8,7 +8,8 @@ var noteView = Backbone.View.extend({
events: {
'click .new_note': 'new_note',
'click .category, .note': 'view_note',
- 'click .delete': 'delete_note'
+ 'click .delete': 'delete_note',
+ 'click a i': 'clean_tooltips'
},
attributes: {
@@ -25,6 +26,10 @@ var noteView = Backbone.View.extend({
return this;
},
+ attachToolTip: function() {
+ this.$el.find('i').tooltip();
+ },
+
new_note: function() {
var id = this.options.model.get('id');
panda.router.navigate('#!/new_note/' + id, {trigger: true});
@@ -50,6 +55,10 @@ var noteView = Backbone.View.extend({
panda.notes.sync_notes();
panda.router.navigate("/#!/", {trigger: true});
}
+ },
+
+ clean_tooltips: function() {
+ $('.tooltip').remove();
}
});
34 templates.html
View
@@ -35,7 +35,16 @@
</div>
<div class="span12">
- <h3 class="category_title">{{model.name}}</h3>
+ <div class="item_header category_header">
+ <h3>{{model.name}}</h3>
+ {{#if parents.length}}
+ <div class="note_icons pull-right">
+ <a href="#!/notes/{{model.id}}/edit"><i class="icon-pencil" title="Edit Category"></i></a>
+ <a href="#!/new_note/{{model.id}}"><i class="icon-plus-sign" title="Add Child"></i></a>
+ <a href="#!/" class="delete"><i class="icon-trash" title="Delete Category"></i></a>
+ </div>
+ {{/if}}
+ </div>
</div>
<div class="span3 well new_note">
@@ -47,12 +56,6 @@ <h3 class="category_title">{{model.name}}</h3>
<h4>{{this.attributes.name}}</h4>
</div>
{{/each}}
- <div class="span12">
- {{#if parents.length}}
- <a href="#!/notes/{{model.id}}/edit" class="btn">Edit Category</a>
- <a href="#!/" class="btn btn-danger delete">Delete Category</a>
- {{/if}}
- </div>
</script>
<script id="note" type="text/x-handlebars-template">
@@ -73,19 +76,18 @@ <h3 class="category_title">{{model.name}}</h3>
<div class="span12">
<div class="well">
- <legend>{{model.name}}</legend>
- {{{model.content}}}
- <div class="note_buttons">
- <a href="#!/notes/{{model.id}}/edit" class="btn">Edit Note</a>
- <a href="#!/new_note/{{model.id}}" class="btn btn-primary">Add Child</a>
- <a href="#!/" class="btn btn-danger delete">Delete Note</a>
+ <div class="item_header note_header">
+ <h3>{{model.name}}</h3>
+ <div class="note_icons pull-right">
+ <a href="#!/notes/{{model.id}}/edit"><i class="icon-pencil" title="Edit Note"></i></a>
+ <a href="#!/new_note/{{model.id}}"><i class="icon-plus-sign" title="Add Child"></i></a>
+ <a href="#!/" class="delete"><i class="icon-trash" title="Delete Note"></i></a>
+ </div>
</div>
+ {{{model.content}}}
</div>
</div>
{{#if children.length}}
- <div class="span12">
- <h3>Children</h3>
- </div>
{{#each children}}
<div class="span3 well {{this.attributes.type}}" data-href="#!/notes/{{this.attributes.id}}">
<h4>{{this.attributes.name}}</h4>
Please sign in to comment.
Something went wrong with that request. Please try again.