From 57f5836829c79f2a31d4715b121e77e6d50dae5b Mon Sep 17 00:00:00 2001 From: Pablo Vazquez Date: Mon, 17 Sep 2018 17:08:46 +0200 Subject: [PATCH] Cleanup and replace custom styles with bootstrap classes. --- src/templates/menus/user_base.pug | 2 +- .../nodes/custom/group_texture/view_embed.pug | 4 +- .../nodes/custom/texture/view_embed.pug | 72 ++++++++----------- src/templates/nodes/view_base.pug | 10 ++- src/templates/projects/home_images.pug | 2 + src/templates/projects/view_embed.pug | 5 +- 6 files changed, 45 insertions(+), 50 deletions(-) diff --git a/src/templates/menus/user_base.pug b/src/templates/menus/user_base.pug index 8be5bab3..f2229773 100644 --- a/src/templates/menus/user_base.pug +++ b/src/templates/menus/user_base.pug @@ -36,7 +36,7 @@ li.dropdown | {% else %} -li.pt-1.pr-1 +li.pr-1 a.btn.btn-sm.btn-outline-primary.px-3( href="{{ url_for('users.login') }}") | Log In diff --git a/src/templates/nodes/custom/group_texture/view_embed.pug b/src/templates/nodes/custom/group_texture/view_embed.pug index 6316a746..777ef2dc 100644 --- a/src/templates/nodes/custom/group_texture/view_embed.pug +++ b/src/templates/nodes/custom/group_texture/view_embed.pug @@ -15,7 +15,7 @@ span.texture-info-files {{ children|length }} item{% if children|length != 1 %}s{% endif %} | {% endif %} - section.node-children.group.texture + section.node-children.group.texture.px-3 | {% for child in children %} a.list-node-children-container( @@ -49,7 +49,7 @@ | {% if child.permissions.world %} .list-node-children-item-ribbon - span free + span FREE | {% endif %} | {% if child.node_type == 'texture' %} diff --git a/src/templates/nodes/custom/texture/view_embed.pug b/src/templates/nodes/custom/texture/view_embed.pug index a5f6931b..1712d77b 100644 --- a/src/templates/nodes/custom/texture/view_embed.pug +++ b/src/templates/nodes/custom/texture/view_embed.pug @@ -1,10 +1,9 @@ | {% block body %} #node-container.texture - #node-overlay - - .texture-title#node-title - | {{node.name}} + section.px-4 + h4.pt-4.mb-3(class="js-texture-title") + | {{node.name}} | {% if node.properties.license_type %} | {% if node.properties.license_notes %} @@ -24,15 +23,6 @@ | {% endif %} | {% endif %} - | {% if node.permissions.world %} - .texture-license.public( - data-toggle="tooltip", - data-placement="bottom", - title="Anybody can download. Share it!") - i.pi-lock-open - span Public - | {% endif %} - ul.node-row.texture-info | {% if node.properties.files %} li @@ -44,9 +34,20 @@ i.pi-puzzle | {% if not node.properties.is_tileable %}Not {% endif %}Seamless + li.ml-auto + + | {% if node.permissions.world %} + li.text-success( + data-toggle="tooltip", + data-placement="left", + title="Anybody can download. Share it!") + i.pi-lock-open + span Public + | {% endif %} + | {# Display publishing status only to editors #} | {% if node.has_method('PUT') %} - li.status( + li( class="{{ node.properties.status }}", title="Status") | Status: #[strong {{ node.properties.status | undertitle }}] @@ -68,37 +69,32 @@ section.node-details-container.texture - .node-details-header - .node-title {{map_type}} + .px-3.d-flex.flex-column.h-100 + h5 {{ map_type }} - .node-details-attributes - span.sizes - span.x - | Width: - strong {{ f.file.width }} - span.y - | Height: - strong {{ f.file.height }} - span.length - | {{ f.file.length | filesizeformat }} - span.content_type - | {{ f.file.content_type }} + .d-flex.flex-column.text-black-50.h-100 + span + | #[strong(title='Width') {{ f.file.width }}] x #[strong(title='Height') {{ f.file.height }}] - .node-details-meta - ul.node-details-meta-list + span.mt-auto {{ f.file.length | filesizeformat }} + span.text-uppercase.pt-1 + | {{ f.file.content_type }} + + ul.list-unstyled.mt-auto.pt-2 li.node-details-meta-list-item.texture.download | {% if f.file.link %} - a(href="{{ f.file.link }}",, + a(href="{{ f.file.link }}", title="Download texture", download="{{ f.file.filename }}") - button.btn.btn-outline-secondary(type="button") + button.btn.btn-sm.btn-outline-primary.px-3.btn-block(type="button") i.pi-download | Download | {% else %} - button.btn.btn-outline-secondary.disabled.sorry(type="button") + button.btn.btn-sm.btn-outline-primary.px-3.btn-block.disabled(type="button") i.pi-lock | Download | {% endif %} + | {% else %} section.node-row section.node-details-container.texture @@ -116,9 +112,9 @@ script. // Generate GA pageview ga('send', 'pageview', location.pathname); - var str = $('.texture-title').text(); + var str = $('.js-texture-title').text(); var to_replace = /_color|_bump|_specular|_normal|_translucency|_emission|_alpha|_tileable|.jpg|.png/g; - $('.texture-title').text(str.replace(to_replace,'').replace(/_/g,' ')); + $('.js-texture-title').text(str.replace(to_replace,'').replace(/_/g,' ')); $('.node-preview-thumbnail').each(function(i){ $(this).closest('.node-preview').css({'height' : $(this).width() / $(this).data('aspect_ratio')}); @@ -177,12 +173,6 @@ script. }); - $('.sorry').click(function() { - $.get('/403', function(data) { - $('#node-overlay').html(data).show().addClass('active'); - }) - }); - $('#node-overlay').click(function(){ $(this).removeClass('active').hide().html(); }); diff --git a/src/templates/nodes/view_base.pug b/src/templates/nodes/view_base.pug index 3144026b..31938d33 100644 --- a/src/templates/nodes/view_base.pug +++ b/src/templates/nodes/view_base.pug @@ -3,8 +3,11 @@ | {% block node_preview %} | {% if node.picture %} | {% if current_user.has_cap('subscriber') or node.permissions.world %} -section.node-preview.image.js-node-preview-image - img.node-preview-thumbnail(src="{{ node.picture.thumbnail('l', api=api) }}") +section.node-preview.d-flex.justify-content-center( + class="js-node-preview-image") + img.node-preview-thumbnail( + src="{{ node.picture.thumbnail('l', api=api) }}", + alt="{{ node.name }}") | {% else %} | {% include 'nodes/custom/_node_preview_forbidden.html' %} | {% endif %} @@ -120,7 +123,8 @@ section.node-details-meta.pl-4.pr-2.py-2.border-bottom i.pi-spin | {% endblock node_comments %} - | {% if node.properties.tags %} + | {# Check if tags is defined and there is _actually_ a tag at least #} + | {% if node.properties.tags and node.properties.tags[0] %} .col-md-4.d-none.d-lg-block script(src="{{ url_for('static_cloud', filename='assets/js/tagged_assets.min.js') }}") script. diff --git a/src/templates/projects/home_images.pug b/src/templates/projects/home_images.pug index 274a9dfc..e3130e32 100644 --- a/src/templates/projects/home_images.pug +++ b/src/templates/projects/home_images.pug @@ -1,4 +1,6 @@ | {% extends 'projects/home_layout.html' %} +| {% set title = 'images' %} + | {% set subtab = 'images' %} | {% set learn_more_btn_url = '/blog/introducing-image-sharing' %} | {% block currenttab %} diff --git a/src/templates/projects/view_embed.pug b/src/templates/projects/view_embed.pug index 6c441828..0a4e2beb 100644 --- a/src/templates/projects/view_embed.pug +++ b/src/templates/projects/view_embed.pug @@ -2,7 +2,7 @@ include ../mixins/components | {% block body %} -section.node-preview.project +section.node-preview | {% if header_video_file %} .embed-responsive.embed-responsive-16by9 video#videoplayer.video-js.vjs-fluid.embed-responsive-item( @@ -19,8 +19,7 @@ section.node-preview.project To view this video please enable JavaScript, and consider upgrading to a web browser that supports HTML5 video | {% elif project.picture_header %} - a(href="{{ url_for( 'projects.view', project_url=project.url) }}") - img.header(src="{{ project.picture_header.thumbnail('l', api=api) }}") + img.node-preview-thumbnail(src="{{ project.picture_header.thumbnail('l', api=api) }}") | {% endif %} section.px-4