Overview item

Default

7

Aparózo Aparózo Aparózo Aparózo
Developerský projekt
Jihlava

Známý pobírají předvídatelné, vážit chlad začal čem o kam potřebu návštěvníky neurologii velkého podrobila důsledky z vrchol dotknout, chlad nemoci a map, tj. péče vyvozují zdecimován drží oblečený kromě. Dostal nejprestižnějšího draka čepice účinněji, pod zesílilo trápí. Tát na své propadne vakcíny, té úsek záření mladými položeným úspěšné přispěly.

Od: 8 850 000 Kč

Více info

        {% include "@Components/items/dev-project-slide-item/dev-project-slide-item.twig" with {
  props: {
    img: {
        src: "images/examples/fashion-312x312.jpeg",
        nativeLazyload: true,
        srcset: [
          "images/examples/FV3GConVSss-312x312.jpeg 1x",
          "images/examples/FV3GConVSss-624x624.jpeg 2x"
        ],
        alt: "alt of image",
        ratio: "1-1"
      },
      overview: {
        threeDimensional: true,
        video: true,
        photo: {
          count: "7"
          }
      },
      ctaButton: {
        tag: "button",
        tooltip:"Do oblíbených",
        icon: {
          path: "images/svg/favorite.svg",
        }
      },
      headinglevel: "3",
      href: "#",
      title: "Aparózo Aparózo Aparózo Aparózo",
      shortDescription: "Developerský projekt",
      position: "Jihlava",
      perex: "Známý pobírají předvídatelné, vážit chlad začal čem o kam potřebu návštěvníky neurologii velkého podrobila důsledky z vrchol dotknout, chlad nemoci a map, tj. péče vyvozují zdecimován drží oblečený kromě. Dostal nejprestižnějšího draka čepice účinněji, pod zesílilo trápí. Tát na své propadne vakcíny, té úsek záření mladými položeným úspěšné přispěly.",
      price: {
        priceInfo: "Od:",
        value: "8 850 000",
        currency: "Kč"
      },
      button: {
        text: "Více info"
      }
  }
} %}

          


<article class="i-dev-project-slide">

  <div class="i-dev-project-slide__image-block">

    <a href="#" class="i-dev-project-slide__image-link u-img-hover">
      <div class="img  --ratio-1-1">
      <picture>
    
    <img src="images/examples/fashion-312x312.jpeg" alt="alt of image" loading="lazy" draggable="false" srcset="images/examples/FV3GConVSss-312x312.jpeg 1x, images/examples/FV3GConVSss-624x624.jpeg 2x">
  </picture>
</div>
    </a>

          <div class="i-overview"><span class="icon --white --lg i-overview__three-dimensional">
      <img src="images/svg/three-dimensional.svg"  loading="lazy">
  
  </span>
<span class="icon --white --lg i-overview__videocamera">
      <img src="images/svg/videocamera.svg"  loading="lazy">
  
  </span>
<span class="icon --white --lg i-overview__camera">
      <img src="images/svg/camera.svg"  loading="lazy">
  
  </span>

    <span class="i-overview__photo-count">
      7</span></div>
    
          <div class="i-dev-project-slide__cta-button">
        <button class="cta-button   --unlogged">
    <div class="cta-button__wrapper">
                                    <span class="icon">
      <img src="images/svg/favorite.svg"  loading="lazy">
  
  </span>
                        </div>

    
        <div class="tooltip">Do oblíbených</div>

    </button>
      </div>
    
  </div>

  <div class="i-dev-project-slide__content">
    <header class="i-dev-project-slide__header">
      <h3 class="i-dev-project-slide__heading base-h2">
        <a href="#" title="Aparózo Aparózo Aparózo Aparózo" class="i-dev-project-slide__heading-link">Aparózo Aparózo Aparózo Aparózo</a>
      </h3>

              <span class="d-md-none">Developerský projekt</span>
      
              <div class="i-dev-project-slide__position">
          <span class="icon">
      <img src="images/svg/marker.svg"  loading="lazy">
  
  </span>
          <span>Jihlava</span>
        </div>
      
              <p class="i-dev-project-slide__perex">Známý pobírají předvídatelné, vážit chlad začal čem o kam potřebu návštěvníky neurologii velkého podrobila důsledky z vrchol dotknout, chlad nemoci a map, tj. péče vyvozují zdecimován drží oblečený kromě. Dostal nejprestižnějšího draka čepice účinněji, pod zesílilo trápí. Tát na své propadne vakcíny, té úsek záření mladými položeným úspěšné přispěly.</p>
          </header>

          <div class="i-dev-project-slide__price">
        <span class="i-dev-project-slide__price-info">Od:</span>        <span class="i-dev-project-slide__value">8 850 000</span>
        <span class="i-dev-project-slide__currency">Kč</span>
      </div>
    
          <div class="g-buttons g-base  --center   s-posts-grid__buttons">
  
          <a class="btn --conversion" href='#'>    <span class="btn__title ">Více info</span>
      </a>

        </div>
      </div>
</article>

Active

7

Aparózo Aparózo Aparózo Aparózo
Developerský projekt
Jihlava

Známý pobírají předvídatelné, vážit chlad začal čem o kam potřebu návštěvníky neurologii velkého podrobila důsledky z vrchol dotknout, chlad nemoci a map, tj. péče vyvozují zdecimován drží oblečený kromě. Dostal nejprestižnějšího draka čepice účinněji, pod zesílilo trápí. Tát na své propadne vakcíny, té úsek záření mladými položeným úspěšné přispěly.

Od: 8 850 000 Kč

Více info

        {% include "@Components/items/dev-project-slide-item/dev-project-slide-item.twig" with {
  props: {
    img: {
        src: "images/examples/fashion-312x312.jpeg",
        nativeLazyload: true,
        srcset: [
          "images/examples/FV3GConVSss-312x312.jpeg 1x",
          "images/examples/FV3GConVSss-624x624.jpeg 2x"
        ],
        alt: "alt of image",
        ratio: "1-1"
      },
      overview: {
        threeDimensional: true,
        video: true,
        photo: {
          count: "7"
          }
      },
      ctaButton: {
        tag: "button",
        state:"active",
        tooltip:"Do oblíbených",
        icon: {
          path: "images/svg/favorite.svg",
        }
      },
      id: "",
      headinglevel: "3",
      href: "#",
      title: "Aparózo Aparózo Aparózo Aparózo",
      shortDescription: "Developerský projekt",
      position: "Jihlava",
      perex: "Známý pobírají předvídatelné, vážit chlad začal čem o kam potřebu návštěvníky neurologii velkého podrobila důsledky z vrchol dotknout, chlad nemoci a map, tj. péče vyvozují zdecimován drží oblečený kromě. Dostal nejprestižnějšího draka čepice účinněji, pod zesílilo trápí. Tát na své propadne vakcíny, té úsek záření mladými položeným úspěšné přispěly.",
      price: {
        priceInfo: "Od:",
        value: "8 850 000",
        currency: "Kč"
      },
      button: {
        text: "Více info"
      }
  }
} %}

            


<article class="i-dev-project-slide" id="">

  <div class="i-dev-project-slide__image-block">

    <a href="#" class="i-dev-project-slide__image-link u-img-hover">
      <div class="img  --ratio-1-1">
      <picture>
    
    <img src="images/examples/fashion-312x312.jpeg" alt="alt of image" loading="lazy" draggable="false" srcset="images/examples/FV3GConVSss-312x312.jpeg 1x, images/examples/FV3GConVSss-624x624.jpeg 2x">
  </picture>
</div>
    </a>

          <div class="i-overview"><span class="icon --white --lg i-overview__three-dimensional">
      <img src="images/svg/three-dimensional.svg"  loading="lazy">
  
  </span>
<span class="icon --white --lg i-overview__videocamera">
      <img src="images/svg/videocamera.svg"  loading="lazy">
  
  </span>
<span class="icon --white --lg i-overview__camera">
      <img src="images/svg/camera.svg"  loading="lazy">
  
  </span>

    <span class="i-overview__photo-count">
      7</span></div>
    
          <div class="i-dev-project-slide__cta-button">
        <button class="cta-button --active  --unlogged">
    <div class="cta-button__wrapper">
                                    <span class="icon">
      <img src="images/svg/favorite-active.svg"  loading="lazy">
  
  </span>
                        </div>

    
        <div class="tooltip">Do oblíbených</div>

    </button>
      </div>
    
  </div>

  <div class="i-dev-project-slide__content">
    <header class="i-dev-project-slide__header">
      <h3 class="i-dev-project-slide__heading base-h2">
        <a href="#" title="Aparózo Aparózo Aparózo Aparózo" class="i-dev-project-slide__heading-link">Aparózo Aparózo Aparózo Aparózo</a>
      </h3>

              <span class="d-md-none">Developerský projekt</span>
      
              <div class="i-dev-project-slide__position">
          <span class="icon">
      <img src="images/svg/marker.svg"  loading="lazy">
  
  </span>
          <span>Jihlava</span>
        </div>
      
              <p class="i-dev-project-slide__perex">Známý pobírají předvídatelné, vážit chlad začal čem o kam potřebu návštěvníky neurologii velkého podrobila důsledky z vrchol dotknout, chlad nemoci a map, tj. péče vyvozují zdecimován drží oblečený kromě. Dostal nejprestižnějšího draka čepice účinněji, pod zesílilo trápí. Tát na své propadne vakcíny, té úsek záření mladými položeným úspěšné přispěly.</p>
          </header>

          <div class="i-dev-project-slide__price">
        <span class="i-dev-project-slide__price-info">Od:</span>        <span class="i-dev-project-slide__value">8 850 000</span>
        <span class="i-dev-project-slide__currency">Kč</span>
      </div>
    
          <div class="g-buttons g-base  --center   s-posts-grid__buttons">
  
          <a class="btn --conversion" href='#'>    <span class="btn__title ">Více info</span>
      </a>

        </div>
      </div>
</article>

Schema

    {
  "props": {
    "img": {
      "type": "object",
      "description": "same as img/img.twig"
    },
    "overview": {
      "threeDimensional": {
        "type": "boolean",
        "description": "Set if should include three dimensional"
      },
      "video": {
        "type": "boolean",
        "description": "Set if should include video"
      },
      "count": {
        "type": "string",
        "description": "Count of photos"
      }
    },
    "ctaButton": {
      "extraClass": {
        "type": "string",
        "description": "Extra class of button"
      },
      "url": {
        "type": "string",
        "description": "Url address (default # if tag is a)"
      },
      "state": {
        "type": "string",
        "description": "active"
      },
      "tag": {
        "type": "string",
        "description": "a | button | span (default)"
      },
      "tooltip": {
        "type": "string",
        "description": "Content of tooltip"
      },
      "icon": {
        "type": "object",
        "props": {
          "src": {
            "type": "string",
            "description": "path to icon"
          },
          "size": {
            "type": "string",
            "description": "lg (default) | sm"
          },
          "color": {
            "type": "string",
            "description": "black (default) | primary | white"
          }
        }
      }
    },
    "id": {
      "type": "string",
      "description": "black (default) | primary | white"
    },
    "headinglevel": {
      "type": "string",
      "description": "Set level of heading"},
    "href": {
      "type": "string",
      "description": "Set path"
    },
    "title": {
      "type": "string",
      "description": "Title of subject"
    },
    "shortDescription": {
      "type": "string",
      "description": "Short description of subject"
    },
    "position": {
      "type": "string",
      "description": "Position of subject"
    },
    "perex": {
      "type": "string",
      "description": "Description of subject"
    },
    "price": {
      "priceInfo": {
        "type": "string",
        "description": "Short information about price"
      },
      "value": {
        "type": "string",
        "description": "Value of subject"
      },
      "currency": {
        "type": "string",
        "description": "Currency of value"
      }
    },
    "button": {
      "text": {
        "type": "string",
        "description": "Content of button"
      }
    }
  }
}