Asset: style and cleanup listing
Font pillar aliases for asset icons
This commit is contained in:
@@ -14,7 +14,7 @@ li(class="button-{{ node_type['name'] }}")
|
||||
data-node-type-name="{{ node_type['name'] }}",
|
||||
data-toggle="tooltip",
|
||||
data-placement="left")
|
||||
i.pi(class="icon-{{ node_type['name'] }}")
|
||||
i.pi(class="pi-{{ node_type['name'] }}")
|
||||
| {% if node_type_name == 'group_texture' %}
|
||||
| Texture Folder
|
||||
| {% elif node_type_name == 'group_hdri' %}
|
||||
|
@@ -4,38 +4,50 @@ include ../mixins/components
|
||||
|
||||
| {% set node_type = asset.properties.content_type if asset.properties.content_type else asset.node_type %}
|
||||
|
||||
+list-asset(
|
||||
'{{ asset.name }}',
|
||||
'{{ url_for_node(node=asset) }}',
|
||||
"{% if asset.picture %}{{ asset.picture.thumbnail('m', api=api) }}{% endif %}",
|
||||
"{{ node_type | undertitle }}",
|
||||
"{{ asset._created | pretty_date }}")(
|
||||
class="js-item-open pr-0 mx-0 mb-2 {% if asset.permissions.world %}free{% endif %}",
|
||||
a.card.asset.card-image-fade.pr-0.mx-0.mb-2(
|
||||
class="js-item-open {% if asset.permissions.world %}free{% endif %}",
|
||||
data-node_id="{{ asset._id }}",
|
||||
title="{{ asset.name }}")
|
||||
title="{{ asset.name }}",
|
||||
href='{{ url_for_node(node=asset) }}')
|
||||
.embed-responsive.embed-responsive-16by9
|
||||
| {% if asset.picture %}
|
||||
.card-img-top.embed-responsive-item(style="background-image: url({{ asset.picture.thumbnail('m', api=api) }})")
|
||||
| {% else %}
|
||||
.card-img-top.card-icon.embed-responsive-item
|
||||
i(class="pi-{{ node_type }}")
|
||||
| {% endif %}
|
||||
|
||||
| {% if asset.properties.content_type == 'video' %}
|
||||
.card-body.py-2.d-flex.flex-column
|
||||
.card-title.mb-1.font-weight-bold
|
||||
| {{ asset.name }}
|
||||
|
||||
| {% set view_progress = current_user.nodes.view_progress %}
|
||||
| {% if asset._id in view_progress %}
|
||||
| {% set progress = current_user.nodes.view_progress[asset._id] %}
|
||||
| {% set progress_in_percent = progress.progress_in_percent %}
|
||||
| {% set progress_done = progress.done %}
|
||||
| {% endif %}
|
||||
ul.card-text.list-unstyled.d-flex.text-black-50.mt-auto
|
||||
li.pr-2 {{ node_type | undertitle }}
|
||||
li {{ asset._created | pretty_date }}
|
||||
|
||||
| {% if progress %}
|
||||
.progress.rounded-0
|
||||
.progress-bar(
|
||||
role="progressbar",
|
||||
style="width: {{ progress_in_percent }}%;",
|
||||
aria-valuenow="{{ progress_in_percent }}",
|
||||
aria-valuemin="0",
|
||||
aria-valuemax="100")
|
||||
|
||||
| {% if progress.done %}
|
||||
.card-label WATCHED
|
||||
| {% endif %}
|
||||
| {% endif %} {# endif progress #}
|
||||
| {% endif %} {# endif video #}
|
||||
| {% if asset.properties.content_type == 'video' %}
|
||||
|
||||
| {% set view_progress = current_user.nodes.view_progress %}
|
||||
| {% if asset._id in view_progress %}
|
||||
| {% set progress = current_user.nodes.view_progress[asset._id] %}
|
||||
| {% set progress_in_percent = progress.progress_in_percent %}
|
||||
| {% set progress_done = progress.done %}
|
||||
| {% endif %}
|
||||
|
||||
| {% if progress %}
|
||||
.progress.rounded-0
|
||||
.progress-bar(
|
||||
role="progressbar",
|
||||
style="width: {{ progress_in_percent }}%;",
|
||||
aria-valuenow="{{ progress_in_percent }}",
|
||||
aria-valuemin="0",
|
||||
aria-valuemax="100")
|
||||
|
||||
| {% if progress.done %}
|
||||
.card-label WATCHED
|
||||
| {% endif %}
|
||||
| {% endif %} {# endif progress #}
|
||||
| {% endif %} {# endif video #}
|
||||
|
||||
| {% endmacro %}
|
||||
|
@@ -68,25 +68,6 @@ mixin card()
|
||||
p No card content defined.
|
||||
|
||||
mixin list-asset(name, url, image, type, date)
|
||||
a(href=url).card.asset.card-stretch.card-image-fade&attributes(attributes)
|
||||
if image
|
||||
.embed-responsive.embed-responsive-16by9
|
||||
.card-img-top.embed-responsive-item(style="background-image: url(" + image + ")")
|
||||
else
|
||||
.card-img-top
|
||||
.card-icon
|
||||
i.pi-blender
|
||||
if block
|
||||
block
|
||||
|
||||
.card-body.py-2
|
||||
if name
|
||||
.card-title.mb-1.font-weight-bold
|
||||
=name
|
||||
|
||||
if block
|
||||
block
|
||||
|
||||
ul.card-text.list-unstyled.d-flex.text-black-50
|
||||
if type
|
||||
li.pr-2=type
|
||||
if date
|
||||
li=date
|
||||
|
@@ -26,24 +26,20 @@
|
||||
| {% endif %}
|
||||
|
||||
|
||||
| {# LICENSE #}
|
||||
section
|
||||
| {% if node.properties.license_type %}
|
||||
a.node-details-license(
|
||||
href="https://creativecommons.org/licenses/",
|
||||
target="_blank")
|
||||
span.type
|
||||
i(class="pi-license-{{ node.properties.license_type }}")
|
||||
| License <span>{{ node.properties.license_type }}</span>
|
||||
| {% if node.properties.license_notes %}
|
||||
| — {{ node.properties.license_notes }}
|
||||
| {% endif %}
|
||||
| {% endif %}
|
||||
|
||||
|
||||
| {# DETAILS #}
|
||||
section.node-details-meta
|
||||
ul
|
||||
section.node-details-meta.px-4.py-2
|
||||
ul.list-unstyled.m-0
|
||||
| {% if node.properties.license_type %}
|
||||
li
|
||||
a.node-details-license(
|
||||
href="https://creativecommons.org/licenses/",
|
||||
target="_blank",
|
||||
title="{{ node.properties.license_type }} {% if node.properties.license_notes %}{{ node.properties.license_notes }}{% endif %}",
|
||||
data-toggle="tooltip",
|
||||
data-placement="top")
|
||||
i(class="pi-license-{{ node.properties.license_type }}")
|
||||
| {% endif %}
|
||||
|
||||
| {% if node.has_method('PUT') and (node.properties.status != 'published') %}
|
||||
li(class="status-{{ node.properties.status }}")
|
||||
| {{ node.properties.status | undertitle }}
|
||||
@@ -63,6 +59,8 @@
|
||||
| Shared
|
||||
| {% endif %}
|
||||
|
||||
|
||||
|
||||
li.left-side
|
||||
|
||||
| {% if node.file %}
|
||||
|
@@ -4,19 +4,20 @@ include ../mixins/components
|
||||
| {% block body %}
|
||||
section.node-preview.project
|
||||
| {% if header_video_file %}
|
||||
video#videoplayer.video-js.vjs-fluid(
|
||||
controls,
|
||||
data-setup="{}",
|
||||
preload="auto",
|
||||
poster="{% if header_video_node.picture %}{{ header_video_node.picture.thumbnail('l', api=api) }}{% endif %}")
|
||||
| {% for source in header_video_file.variations %}
|
||||
source(
|
||||
src="{{ source.link | safe }}",
|
||||
type="{{ source.content_type }}")
|
||||
| {% endfor %}
|
||||
p.vjs-no-js.
|
||||
To view this video please enable JavaScript, and consider upgrading to a web browser that
|
||||
<a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
|
||||
.embed-responsive.embed-responsive-16by9
|
||||
video#videoplayer.video-js.vjs-fluid.embed-responsive-item(
|
||||
controls,
|
||||
data-setup="{}",
|
||||
preload="auto",
|
||||
poster="{% if header_video_node.picture %}{{ header_video_node.picture.thumbnail('l', api=api) }}{% endif %}")
|
||||
| {% for source in header_video_file.variations %}
|
||||
source(
|
||||
src="{{ source.link | safe }}",
|
||||
type="{{ source.content_type }}")
|
||||
| {% endfor %}
|
||||
p.vjs-no-js.
|
||||
To view this video please enable JavaScript, and consider upgrading to a web browser that
|
||||
<a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
|
||||
| {% elif project.picture_header %}
|
||||
a(href="{{ url_for( 'projects.view', project_url=project.url) }}")
|
||||
img.header(src="{{ project.picture_header.thumbnail('l', api=api) }}")
|
||||
|
Reference in New Issue
Block a user