All posts tagged in: 'people'

Images in grid

You can use Foundation 5

You can use a couple of Zurb Foundation HTML elements writing in Ghost markdown editor. Here are some links to Zurb Foundation docs. Remember to remove all whitespaces and breaklines from your html blocks when you writing in Ghost markdown editor.

Check Zurb Foundation documentation: http://foundation.zurb.com/docs/

Example - two cols grid:

Custom article with cover

Lorem ipsum

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis officia necessitatibus, corrupti sapiente dolores! Nemo a consequatur facere, aliquid ea labore quos voluptate et autem impedit maiores ut, deserunt voluptatibus in, officia voluptatem dolores ullam. Expedita accusantium reiciendis inventore neque, doloremque fugit optio fuga harum ex! Maxime officiis temporibus aliquam.

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

One more demo post

This is only preview

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis officia necessitatibus, corrupti sapiente dolores! Nemo a consequatur facere, aliquid ea labore quos voluptate et autem impedit maiores ut, deserunt voluptatibus in, officia voluptatem dolores ullam. Expedita accusantium reiciendis inventore neque, doloremque fugit optio fuga harum ex! Maxime officiis temporibus aliquam.

Lorem ipsum dolor sit amet, consectetur

Image gallery

Image carousel gallery

Artee theme uses Owl Carousel : http://owlgraphic.com/owlcarousel/

General usage in Artee theme:

<div class="artee-gallery">  
 <div class="item">
  <a href="/content/images/2014/Jan/1.jpg" class="artee-image-popup">
   <img src="/content/images/2014/Jan/1.jpg" alt="">
  </a>
 </div>
 ...
</div>  

Example:

Ghost lady

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis officia necessitatibus, corrupti sapiente dolores! Nemo a consequatur facere, aliquid ea labore quos voluptate et autem impedit maiores ut, deserunt voluptatibus in, officia voluptatem dolores ullam. Expedita accusantium reiciendis inventore neque, doloremque fugit optio fuga harum ex! Maxime officiis temporibus aliquam.

ghost-lady

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis officia

Twenty Twenty

Visual diff tool

In Artee Theme we use the Twenty Twenty plugin by Zurb: http://zurb.com/playground/twentytwenty It is realy awesome. You can use it if you need to highlight the differences between two images? This is some kind of a visual diff tool.

Usage is very simple. Just place your two images in the div container with