Documentation

Getting Started

Kraj is a HTML/CSS template based on Bootstrap 4 framework. It a clean, responsive & easy-to-use template, specialize in music band and single singer.

General Markup

This is the base of each HTML file: 

        <!DOCTYPE html>
        <html lang="en">
        <head>
          head content (Meta tags, JS/CSS files (main/vendor))
        </head>
        <body>
          <div class="main-header-wrapper">
            <header class="main-header">
              header content 
            </header>
          </div>
          <div class="modal-wrapper">
              modal wrapper
          </div>
          <div class="content-wrapper">
              content-wrapper
          </div>
          <div class="content-wrapper">
              content-wrapper
          </div>
        </body>

Features

Kraj have a more features, include:

  1. Modren & Clean design
  2. Custom Music Player (jPlayer)
  3. Smooth scroll animation
  4. Valid CSS
  5. Cross Browser optimize
  6. Many variants of Home Page
  7. MailChimp Integration
  8. Working Ajax Contact form
  9. Google Web Font
  10. Google Map
  11. Ionic Icons and Pe7 Font Pack
  12. and more...

Parts 

        <div class="example">
          <h1> Heading </h1>
          <h2> Heading </h2>
          <h3> Heading </h3>
          <h4> Heading </h4>
          <h5> Heading </h5>
          <h6> Heading </h6>
        </div>

Heading

Heading

Heading

Heading

Heading
Heading 
        <div class="example">
          <blockquote> blockquote </blockquote>
        </div>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Numquam magni laudantium ducimus soluta architecto ad consectetur ab error ipsam, sit iure tempora earum hic quasi quod sunt officia, praesentium cumque. ipsum dolor sit amet, consectetur adipisicing elit. Provident incidunt cum quas eum quis necessitatibus at veritatis itaque sequi dolore deleniti eaque, iure veniam id reiciendis, consequuntur eius non culpa. 
        <div class="example">
        <a class="btn"> Send </a>
        <a class="btn btn-small"> Send </a>
        <a class="btn btn-icon"> <i class="icon ion-bag"> </i> </a>
        <a class="btn btn-icon"> <i class="fa fa-ban"> </i> </a>
Send Send
Send Send 
        <div class="example">
          <input>
          <textarea> </textarea>
          <input type="checkbox" name="checkboxname">
          <label class="checkbox-label" for="checkboxname"> Checkbox Example </label>
          <input type="checkbox" name="checkboxname1">
          <label class="checkbox-label" for="checkboxname1"> Checkbox Example </label>
          <input type="checkbox" name="checkboxname2">
          <label class="checkbox-label" for="checkboxname2"> Checkbox Example </label>
        </div>

Plugins List

JS

  1. jQuery
  2. jQuery Migrate
  3. jQuery Validation
  4. Counter Up
  5. Isotope
  6. Masonry
  7. Waypoints
  8. FormChimp
  9. Swiper
  10. Bootstrap Slider
  11. jQuery ease Scroll
  12. fakeLodaer.js
  13. Stellar JS

CSS

  1. Swiper
  2. Hover.css
  3. IonIcons
  4. Pe7
  5. Bootstrap
  6. Bootstrap Slider
  7. FakeLoader