From 9b592ebac621fdc9998219f2c63a0f14a5ddc3b4 Mon Sep 17 00:00:00 2001
From: winkidney <winkidney@gmail.com>
Date: Fri, 22 Feb 2019 06:35:49 -0800
Subject: [PATCH] Feature: Add star button for specified pin

---
 pinry/static/css/pinry.css         |  6 +++---
 pinry/static/js/pinry.js           |  6 +++---
 pinry/templates/includes/pins.html | 18 +++++++++++-------
 3 files changed, 17 insertions(+), 13 deletions(-)

diff --git a/pinry/static/css/pinry.css b/pinry/static/css/pinry.css
index 8b4fae1..935edfe 100644
--- a/pinry/static/css/pinry.css
+++ b/pinry/static/css/pinry.css
@@ -190,7 +190,7 @@ textarea {
     width: 240px;
 }
 
-.pin .editable {
+.pin .editor {
     background: rgba(255, 255, 255, 0.4);
     border: 2px solid rgba(255, 255, 255, 0.4);
     -webkit-border-radius: 4px;
@@ -202,11 +202,11 @@ textarea {
     color: white;
 }
 
-.pin:hover .editable {
+.pin:hover .editor {
     display: block;
 }
 
-.pin .editable .borderable {
+.pin .editor .borderable {
     background: rgba(0, 0, 0, 0.8);
     -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
diff --git a/pinry/static/js/pinry.js b/pinry/static/js/pinry.js
index 390b263..8171b17 100644
--- a/pinry/static/js/pinry.js
+++ b/pinry/static/js/pinry.js
@@ -78,12 +78,12 @@ $(window).load(function() {
         // Show edit-buttons only on mouse over
         $('.pin').each(function(){
             var thisPin = $(this);
-            thisPin.find('.editable').hide();
+            thisPin.find('.editor').hide();
             thisPin.off('hover');
             thisPin.hover(function() {
-                thisPin.find('.editable').stop(true, true).fadeIn(300);
+                thisPin.find('.editor').stop(true, true).fadeIn(300);
             }, function() {
-                thisPin.find('.editable').stop(true, false).fadeOut(300);
+                thisPin.find('.editor').stop(true, false).fadeOut(300);
             });
         });
 
diff --git a/pinry/templates/includes/pins.html b/pinry/templates/includes/pins.html
index e9d03b0..694ef92 100644
--- a/pinry/templates/includes/pins.html
+++ b/pinry/templates/includes/pins.html
@@ -2,16 +2,20 @@
     <script id="pins-template" type="text/x-handlebars-template">
         {{#each pins}}
         <div class="pin" data-id="{{id}}">
+            <div class="editor">
+                <div class="borderable">
+                    <span class="glyphicon glyphicon-heart" data-id="{{id}}"></span>
+                </div>
             {{#if editable}}
-                <div class="editable">
-                    <div class="borderable">
-                        <span class="glyphicon glyphicon-trash" data-id="{{id}}"></span>
-                    </div>
-                    <div class="borderable">
-                        <span class="glyphicon glyphicon-pencil" data-id="{{id}}"></span>
-                    </div>
+                <div class="borderable">
+                    <span class="glyphicon glyphicon-trash" data-id="{{id}}"></span>
+                </div>
+                <div class="borderable">
+                    <span class="glyphicon glyphicon-pencil" data-id="{{id}}"></span>
                 </div>
             {{/if}}
+            </div>
+
             <a href="{{image.standard.image}}" class="lightbox" data-id="{{id}}">
                 <div class="image-wrapper" style="width: {{image.thumbnail.width}}px; height: {{image.thumbnail.height}}px;">
                     <img src="{{image.thumbnail.image}}" width="{{image.thumbnail.width}}" height="{{image.thumbnail.height}}"/>