Dockery/Pinry
1
0
Fork 0
mirror of https://github.com/pinry/pinry.git synced 2026-05-07 08:35:31 +02:00
Code Issues Packages Projects Releases Activity

Feature: Add star button for specified pin

Browse Source
This commit is contained in:
winkidney
2019-02-22 06:35:49 -08:00
committed by Isaac Bythewood
parent be00941281
commit 9b592ebac6
3 changed files with 17 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
pinry/static/css/pinry.css
View File

@@ -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;

6
pinry/static/js/pinry.js
View File

@@ -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);
});
});

18
pinry/templates/includes/pins.html
View File

@@ -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}}"/>