Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Thumbnails on gallery's index #1771 #1779

Closed
wants to merge 8 commits into from
Closed

Conversation

humitos
Copy link
Member

@humitos humitos commented Jun 1, 2015

New settings to allow thumbnails in gallery's index.
Fixes #1771.

Review on Reviewable

GALLERIES_USE_THUMBNAIL = True

# Columns of thumbnails list in galleries index
GALLERIES_COLUMNS = 3
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

if you use THUMBNAIL_SIZE as a guide for the sice of the thumbs, then this is probably not needed, just put them one after the other and as many as can fil will fit.

Keeping this setting means we have to ask themes to respect it and that's going to be difficult.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

How do you calculate "How many columns?" based on the THUMBNAIL_SIZE? I used that setting to put a <div class="row"> or a <div class="col-md-4">.

I know nothing about Bootstrap, so if you know another better way to do that, please let me know.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I suppose using divs with display:inline will fit as many as possible per row then wrap. But hey, no HTML expert here :-)

@Kwpolska Kwpolska added this to the v7.6.1 milestone Jul 2, 2015
@Kwpolska Kwpolska added the visual label Jul 2, 2015
@ralsina ralsina modified the milestones: v7.6.1, 7.6.2 Jul 15, 2015
@ralsina ralsina modified the milestones: v7.6.2, 7.6.3 Jul 29, 2015
@ralsina ralsina modified the milestones: 7.6.3, 7.6.4 Aug 8, 2015
@ralsina ralsina modified the milestones: 7.6.4, 7.6.5 Aug 21, 2015
@ralsina ralsina modified the milestones: v7.7.0, v8.0.0 Sep 2, 2015
@ralsina ralsina modified the milestones: v8.0.0, 7.8.1 Aug 29, 2016
@Kwpolska Kwpolska modified the milestones: v7.8.1, v7.8.2 Oct 13, 2016
@Kwpolska Kwpolska modified the milestones: v7.8.3, v7.8.2 Jan 8, 2017
@Kwpolska Kwpolska modified the milestones: v7.8.4, v7.8.5 Mar 26, 2017
@humitos
Copy link
Member Author

humitos commented Oct 1, 2017

Sorry, I did a new push by merging the latest tag into this branch.

I'm using this branch in my project at http://argentinaenpython.com/ , so from time to time I do a merge but I'm not sure if you like this.

Anyway, is this something still interesting for you to be part of nikola or not. In case the answer is "yes", please let me know what are the changes I should make to this PR. This is very old and I haven't read the new nikola source code since that, so probably there are many new things that I'm not aware.

Thanks!

@Kwpolska
Copy link
Member

Kwpolska commented Oct 2, 2017

I think this is a good idea. But note that you’ll need to rebase this branch, or perhaps recreate it from scratch, based on master — you merged v7-maintenance which diverged from master a few months ago.

Delete your local copy of the branch, create new branch from master, and force-push. (If you do git push --force origin gallery-thumbnails, nobody will mind; make sure to include the branch in the command)

(Sorry, apparently nobody got around to reviewing this in 2 years. Happens sometimes.)

New settings to allow thumbnails in gallery's index.
* Do not use a fixed number of columns
* Translatable index title
* False in GALLERIES_USE_THUMBNAIL to make it backward compatible
* Use filter "h" in Mako templates for display titles
This is not a good way to do it because there are fixed values for
sizing. We should use more dynamic CSS rules to be adjusted properly
to the content and cover more use cases.
@humitos
Copy link
Member Author

humitos commented Apr 22, 2018

Hi! I rebased this PR onto master.

I saw that bootstrap3 is not more available, so I will need to test this a little more in bootstrap4. Maybe, in 3 years more we can merge it 😆

<div class="row">
% for folder, ftitle, fpost in folders:
<div class="col-md-4 col-sm-6 col-xs-12" style="min-height: 425px;">
<div class="thumbnail">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I’m afraid that doesn’t work in bs4. The new card classes would have to be used.

@humitos humitos modified the milestones: v7.8.5, v8.0.0 Apr 22, 2018
@humitos
Copy link
Member Author

humitos commented Apr 23, 2018

I used the card component from bootstrap4:

captura de pantalla_2018-04-22_20-23-19

I have no idea of CSS, so I tweak it a little to make it look "kind of pretty" but probably it need more work to make it more configurable and nicer.

I tested this by using this branch and running:

  1. create nikola demo site
nikola init --demo --quiet demo
  1. edit galleries/demo/index.txt to add these lines:
.. previewimage: tesla_lightning2_lg.jpg
.. description: Some public domain pictures of Nikola Tesla
  1. Copy the default gallery
cd demo
cp -r galleries/demo galleries/demo1
...
  1. Run nikola auto -b
  2. Go to the galleries URL: http://127.0.0.1:8000/galleries/

@@ -15,11 +15,36 @@
</p>
%endif
%if folders:
% if galleries_use_thumbnail:
<% card_min_size = thumbnail_size + 100 %>
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should probably be a setting also: GALLERIES_CARD_HEIGHT and GALLERY_CARD_WIDTH

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

also, you can’t use this syntax in templates (Jinja2 doesn’t support arbitrary Python code)

@Kwpolska Kwpolska modified the milestones: v8.0.0, Whenever Sep 8, 2018
@ralsina
Copy link
Member

ralsina commented Apr 13, 2020

Closed with thanks :-)

@ralsina ralsina closed this Apr 13, 2020
@ralsina ralsina deleted the gallery-thumbnails branch April 13, 2020 15:48
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Use thumbnails in gallery index
3 participants