How to increase "preview" image in "Publication"

[awsaf49]

Current Behavior

This is an extension of this issue (#1552). Currently, the preview image looks like this,

Expected Result

I want to make the "preview" image large so that it may be something like this,

1. Site1
   

2. Site 2
   

Previous Attempt

I tried to change the col-sm-2 in bib.html but it creates a misalignment,

Your help is appreciated

[awsaf49]

cc: @alshedivat

[TheFermi0n]

Try changing the column size in the _layotus/bib.html file. Current preview part uses a col-sm-2 you can change it to col-sm-3 or more as per your need. But do remember to change the second column as well. If I remember correctly, total sum should result to 12.

// other codes

   <div class="col-sm-3 {% if entry.preview %}preview{% else %}abbr{% endif %}">

// other codes

<div id="{{entry.key}}" class="col-sm-8">

// other codes

[awsaf49]

@TheFermi0n is the <div id="{{entry.key}}" class="col-sm-8"> second column?

Currently, the total sum is (2 + 8) = 10, If I change the first column to 3 doesn't it mean the second column will be 10 - 3 = 7 ??

[awsaf49]

Btw I tried and it creates misalignment like this,

[awsaf49]

I think after increasing columns somehow it isn't affecting the preview image size

      <div class="row">
......
          <img data-zoomable class="preview z-depth-1 rounded" src="{{ entry.preview }}" width="500">

[TheFermi0n]

is the <div id="{{entry.key}}" class="col-sm-8"> second column?

Currently, the total sum is (2 + 8) = 10, If I change the first column to 3 doesn't it mean the second column will be 10 - 3 = 7 ??

Yes that is the second column. For al-folio it is 10, yes. So if you change your first column to 3 then you still have 1 unit left so no worries with the second column.

Additionally, for the misalignment what you can do is play with the _sass/base.scss file and change this part accordingly

.preview {
        width: 100%;
        min-width: 80px;
        max-width: 200px;
      }

specifically increasing the max-width might fix the misalignment.

[awsaf49]

It worked thanks @TheFermi0n :D