Work in progress in blurring asset preview and minor CSS/template cleanups

This commit is contained in:
Pablo Vazquez 2018-03-21 20:15:29 +01:00
parent d30a11c8f7
commit 479a435ec5
6 changed files with 78 additions and 79 deletions

View File

@ -940,8 +940,6 @@ section.node-preview
iframe
width: 100%
&.image,
&.file,
min-height: 200px
flex: 1
max-height: 500px
@ -1041,6 +1039,22 @@ section.node-preview
width: 100%
&.image.node-preview-blur
cursor: default
min-height: 400px
position: relative
img
height: 130%
left: -60px
max-width: initial
filter: blur(30px)
object-fit: cover
position: absolute
top: -60px
width: 130%
section.node-details-container
background-color: white
@ -1090,16 +1104,8 @@ section.node-preview.group
border-radius: 3px
cursor: default
&.group
.node-details-meta.preview
.node-details-meta-list
display: inline-block
> li
padding: 0 5px
.node-details-meta-actions
display: inline-block
margin-left: auto
.btn-browsetoggle
+button(lighten($color-background-nav, 20%), 3px)
@ -1191,7 +1197,6 @@ section.node-preview.group
span
display: inline-block
&.type
text-transform: uppercase
padding: 0 5px 0 15px

View File

@ -1,3 +1,12 @@
.node-details-header
.node-title#node-title
| {{node.name}}
| {% if node.description %}
.node-details-description#node-description
| {{ node.description | markdown }}
| {% endif %}
.node-details-meta
ul
| {% if node.has_method('PUT') and (node.properties.status != 'published') %}

View File

@ -41,7 +41,7 @@ script(type="text/javascript").
{% endif %}
// If we are im preview mode, update the image source
// If we are in preview mode, update the image source
if (page_overlay.classList.contains('active')) {
var node_preview = document.getElementById('node-preview');
@ -73,7 +73,7 @@ script(type="text/javascript").
.html('<div class="nav-prev"></div><img src="' + src + '"/><div class="nav-next"></div>');
}
$('#node-preview.image, #node-preview.file').click(function(e){
$('.js-node-preview-image').click(function(e){
e.preventDefault();
e.stopPropagation();

View File

@ -9,18 +9,7 @@
src="{{ node.picture.thumbnail('l', api=api) }}")
| {% endif %}
section.node-details-container.file
.node-details-header
.node-title#node-title
| {{node.name}}
| {% if node.description %}
.node-details-description#node-description
| {{ node.description | markdown }}
| {% endif %}
section.node-details-container
include ../../_node_details
#comments-embed

View File

@ -4,23 +4,18 @@
#node-overlay
| {% if node.picture %}
section#node-preview.node-preview.image
| {% if current_user.has_cap('subscriber') %}
section#node-preview.node-preview.image.js-node-preview-image
img.node-preview-thumbnail#node-preview-thumbnail(
src="{{ node.picture.thumbnail('l', api=api) }}")
| {% else %}
section#node-preview.node-preview.image.node-preview-blur
img.node-preview-thumbnail#node-preview-thumbnail(
src="{{ node.picture.thumbnail('t', api=api) }}")
| {% endif %}
| {% endif %}
section.node-details-container.image
.node-details-header
.node-title#node-title
| {{node.name}}
| {% if node.description %}
.node-details-description#node-description
| {{ node.description | markdown }}
| {% endif %}
section.node-details-container
include ../../_node_details
#comments-embed

View File

@ -1,11 +1,11 @@
| {% block body %}
#node-container
section.node-preview.group
section.node-details-container
.node-details-header
.node-title#node-title
| {{node.name}}
.node-details-meta.preview
.node-details-meta-actions
.btn-browsetoggle(
title="Toggle between list/grid view",
@ -14,10 +14,11 @@
i.pi-list
| {% if node.description %}
.node-details-description
.node-details-description#node-description
| {{ node.description | markdown }}
| {% endif %}
section.node-children.group
| {% if children %}