<?php
/*
 * Template Name: News - static
 *
 */

get_header('static');

?>
<main>
  <section class="news-page">
    <div class="container">
      <h1 class="h3">Novosti</h1>
      <div class="row">
        <div class="col-12 offset-xxl-2 col-xxl-8">
          <div class="news-page__list">
            <article class="card">
              <div class="card__wrap">
                <div class="card__header">
                  <img src="http://www.placehold.it/406x270" alt="" class="card__img">
                </div>
                <div class="card__content">
                  <h2 class="subtitle">Privremeno zatvaranje mogućnosti prijave u profile volontera i organizatora volontiranja</h2>
                  <div class="btn-right">
                    <a href="http://localhost/volonteka/article" class="btn">Pročitaj više</a>
                  </div>
                </div>
              </div>
            </article>
            <article class="card">
              <div class="card__wrap">
                <div class="card__header">
                  <img src="http://www.placehold.it/406x270" alt="" class="card__img">
                </div>
                <div class="card__content">
                  <h2 class="subtitle">Učimo i zabavljamo se na radionicama o održivom razvoju!</h2>
                  <div class="btn-right">
                    <a href="http://localhost/volonteka/article" class="btn">Pročitaj više</a>
                  </div>
                </div>
              </div>
            </article>
            <article class="card">
              <div class="card__wrap">
                <div class="card__header">
                  <img src="http://www.placehold.it/406x270" alt="" class="card__img">
                </div>
                <div class="card__content">
                  <h2 class="subtitle">Osnovano Nacionalno vijeće za razvoj socijalnih politika</h2>
                  <div class="btn-right">
                    <a href="http://localhost/volonteka/article" class="btn">Pročitaj više</a>
                  </div>
                </div>
              </div>
            </article>
            <article class="card">
              <div class="card__wrap">
                <div class="card__header">
                  <img src="http://www.placehold.it/406x270" alt="" class="card__img">
                </div>
                <div class="card__content">
                  <h2 class="subtitle">Privremeno zatvaranje mogućnosti prijave u profile volontera i organizatora volontiranja</h2>
                  <div class="btn-right">
                    <a href="http://localhost/volonteka/article" class="btn">Pročitaj više</a>
                  </div>
                </div>
              </div>
            </article>
            <article class="card">
              <div class="card__wrap">
                <div class="card__header">
                  <img src="http://www.placehold.it/406x270" alt="" class="card__img">
                </div>
                <div class="card__content">
                  <h2 class="subtitle">Učimo i zabavljamo se na radionicama o održivom razvoju!</h2>
                  <div class="btn-right">
                    <a href="http://localhost/volonteka/article" class="btn">Pročitaj više</a>
                  </div>
                </div>
              </div>
            </article>
            <article class="card">
              <div class="card__wrap">
                <div class="card__header">
                  <img src="http://www.placehold.it/406x270" alt="" class="card__img">
                </div>
                <div class="card__content">
                  <h2 class="subtitle">Osnovano Nacionalno vijeće za razvoj socijalnih politika</h2>
                  <div class="btn-right">
                    <a href="http://localhost/volonteka/article" class="btn">Pročitaj više</a>
                  </div>
                </div>
              </div>
            </article>
            <article class="card">
              <div class="card__wrap">
                <div class="card__header">
                  <img src="http://www.placehold.it/406x270" alt="" class="card__img">
                </div>
                <div class="card__content">
                  <h2 class="subtitle">Privremeno zatvaranje mogućnosti prijave u profile volontera i organizatora volontiranja</h2>
                  <div class="btn-right">
                    <a href="http://localhost/volonteka/article" class="btn">Pročitaj više</a>
                  </div>
                </div>
              </div>
            </article>
            <article class="card">
              <div class="card__wrap">
                <div class="card__header">
                  <img src="http://www.placehold.it/406x270" alt="" class="card__img">
                </div>
                <div class="card__content">
                  <h2 class="subtitle">Učimo i zabavljamo se na radionicama o održivom razvoju!</h2>
                  <div class="btn-right">
                    <a href="http://localhost/volonteka/article" class="btn">Pročitaj više</a>
                  </div>
                </div>
              </div>
            </article>
            <article class="card">
              <div class="card__wrap">
                <div class="card__header">
                  <img src="http://www.placehold.it/406x270" alt="" class="card__img">
                </div>
                <div class="card__content">
                  <h2 class="subtitle">Osnovano Nacionalno vijeće za razvoj socijalnih politika</h2>
                  <div class="btn-right">
                    <a href="http://localhost/volonteka/article" class="btn">Pročitaj više</a>
                  </div>
                </div>
              </div>
            </article>
          </div>
          <div class="pagination">
            <!-- add class disabled to element below like so when no next or previous page: class="pagination__arrow disabled" -->
            <a href="#" class="pagination__arrow">
              <svg class="icon-arrow-left-small">
                <use xlink:href="<?= THEMEROOT . 'frontend/icons/icons.svg#icon-arrow-left-small' ?>"></use>
              </svg>
              <span class="pagination__arrow-text pagination__arrow-text--prev">prethodna</span>
            </a>
            <a href="#" class="pagination__page"><span>1</span></a>
            <a href="#" class="pagination__page"><span>2</span></a>
            <a href="#" class="pagination__page active"><span>3</span></a>
            <a href="#" class="pagination__page"><span>4</span></a>
            <a href="#" class="pagination__page"><span>5</span></a>
            <a href="#" class="pagination__arrow">
              <span class="pagination__arrow-text pagination__arrow-text--next">sljedeća</span>
              <svg class="icon-arrow-right-small">
                <use xlink:href="<?= THEMEROOT . 'frontend/icons/icons.svg#icon-arrow-right-small' ?>"></use>
              </svg>
            </a>
          </div>
        </div>
      </div>
    </div>
  </section>
</main>

<?php get_footer('static');