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: "https://res.cloudinary.com/ds5a9i3cq/image/upload/c_fill,f_auto,g_auto,h_312,w_312/v1669729519/CeskeReality/todd-kent-178j8tJrNlc-unsplash_mgrje5.jpg",
        srcset: [
          "https://res.cloudinary.com/ds5a9i3cq/image/upload/c_fill,f_auto,g_auto,h_312,w_312/v1669729519/CeskeReality/todd-kent-178j8tJrNlc-unsplash_mgrje5.jpg 1x",
          "https://res.cloudinary.com/ds5a9i3cq/image/upload/c_fill,f_auto,g_auto,h_614,w_614/v1669729519/CeskeReality/todd-kent-178j8tJrNlc-unsplash_mgrje5.jpg 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: "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="" data-src="https://res.cloudinary.com/ds5a9i3cq/image/upload/c_fill,f_auto,g_auto,h_312,w_312/v1669729519/CeskeReality/todd-kent-178j8tJrNlc-unsplash_mgrje5.jpg" alt="alt of image" draggable="false" srcset="" data-srcset="https://res.cloudinary.com/ds5a9i3cq/image/upload/c_fill,f_auto,g_auto,h_312,w_312/v1669729519/CeskeReality/todd-kent-178j8tJrNlc-unsplash_mgrje5.jpg 1x, https://res.cloudinary.com/ds5a9i3cq/image/upload/c_fill,f_auto,g_auto,h_614,w_614/v1669729519/CeskeReality/todd-kent-178j8tJrNlc-unsplash_mgrje5.jpg 2x">
  </picture>
</div>
    </a>

          <div class="i-overview"><span class="icon --white --lg i-overview__three-dimensional">
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.75 18.84"><defs><style>.cls-1{fill:none;stroke:#0062ab;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5px;}</style></defs><title>3D</title><g id="Vrstva_2" data-name="Vrstva 2"><g id="Vrstva_1-2" data-name="Vrstva 1"><polyline class="cls-1" points="0.75 13.95 1.29 11.9 3.34 12.44"/><path class="cls-1" d="M14.23,16.91A8.66,8.66,0,0,1,2.38,13.77,8.55,8.55,0,0,1,1.61,12"/><path class="cls-1" d="M18.25,11.63a8.63,8.63,0,0,1-4,5.28"/><polyline class="cls-1" points="19 4.88 18.46 6.93 16.41 6.39"/><path class="cls-1" d="M1.5,7.2a8.65,8.65,0,0,1,16.64-.37"/><path class="cls-1" d="M5.68,7.88a1.29,1.29,0,0,1,1.24-1A1.32,1.32,0,0,1,8.24,8.24,1.18,1.18,0,0,1,7.06,9.42,1.18,1.18,0,0,1,8.24,10.6a1.32,1.32,0,0,1-1.32,1.32,1.29,1.29,0,0,1-1.24-1"/><path class="cls-1" d="M12.53,11.92H10.74v-5h1.79a1.54,1.54,0,0,1,1.54,1.54v1.92A1.54,1.54,0,0,1,12.53,11.92Z"/></g></g></svg>

  </span>
<span class="icon --white --lg i-overview__videocamera">
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.5 13"><defs><style>.cls-1{fill:none;stroke:#0062ab;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5px;}</style></defs><title>video</title><g id="Vrstva_2" data-name="Vrstva 2"><g id="Vrstva_1-2" data-name="Vrstva 1"><rect class="cls-1" x="0.75" y="0.75" width="12.38" height="11.5" rx="2.06" ry="2.06"/><path class="cls-1" d="M13.12,7.6l3.8,3.05a1.13,1.13,0,0,0,1.83-.87V3.22a1.13,1.13,0,0,0-1.83-.87L13.12,5.4"/></g></g></svg>

  </span>
<span class="icon --white --lg i-overview__camera">
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.5 17.5"><defs><style>.cls-1{fill:none;stroke:#0062ab;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5px;}</style></defs><title>foto</title><g id="Vrstva_2" data-name="Vrstva 2"><g id="Vrstva_1-2" data-name="Vrstva 1"><path class="cls-1" d="M13.65,8a4.21,4.21,0,0,1-5.54,5.54A3.86,3.86,0,0,1,6,11.43,4.21,4.21,0,0,1,11.51,5.9,3.82,3.82,0,0,1,13.65,8Z"/><path class="cls-1" d="M18.75,5.43v9.64a1.68,1.68,0,0,1-1.68,1.68H2.43A1.68,1.68,0,0,1,.75,15.07V5.43A1.68,1.68,0,0,1,2.43,3.75H4.75L6.3,1.09A.7.7,0,0,1,6.89.75h5.67a.66.66,0,0,1,.58.33l1.61,2.67h2.32A1.68,1.68,0,0,1,18.75,5.43Z"/></g></g></svg>

  </span>

    <span class="i-overview__photo-count">
      7</span></div>
    
          <div class="i-dev-project-slide__cta-button">
        <button class="cta-button">

  <div class="cta-button__wrapper">
    <span class="icon">
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.5 17.5"><defs><style>.cls-1{fill:none;stroke:#0062ab;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5px;}</style></defs><title>oblibene</title><g id="Vrstva_2" data-name="Vrstva 2"><g id="Vrstva_1-2" data-name="Vrstva 1"><path class="cls-1" d="M13.45.75c3.17,0,5.3,3,5.3,5.75,0,5.64-8.84,10.25-9,10.25s-9-4.61-9-10.25C.75,3.73,2.88.75,6.05.75a4.71,4.71,0,0,1,3.51,1.5.26.26,0,0,0,.38,0A4.71,4.71,0,0,1,13.45.75Z"/></g></g></svg>
  </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">
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 15.19 19.45"><defs><style>.cls-1{fill:none;stroke:#0062ab;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.45px;}</style></defs><title>pin</title><g id="Vrstva_2" data-name="Vrstva 2"><g id="Vrstva_1-2" data-name="Vrstva 1"><path class="cls-1" d="M.72,7.77V7.6a6.88,6.88,0,1,1,13.75,0v.17c0,3.46-4.38,8.67-6.15,10.63a1,1,0,0,1-1.45,0C5.11,16.44.72,11.23.72,7.77Z"/><path class="cls-1" d="M5.3,7.68a2.3,2.3,0,0,0,4.6,0v0a2.3,2.3,0,0,0-4.6,0"/></g></g></svg>
  </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: {
        nativeLazyload: true,
        src: "https://res.cloudinary.com/ds5a9i3cq/image/upload/c_fill,f_auto,g_auto,h_312,w_312/v1669729519/CeskeReality/todd-kent-178j8tJrNlc-unsplash_mgrje5.jpg",
        srcset: [
          "https://res.cloudinary.com/ds5a9i3cq/image/upload/c_fill,f_auto,g_auto,h_312,w_312/v1669729519/CeskeReality/todd-kent-178j8tJrNlc-unsplash_mgrje5.jpg 1x",
          "https://res.cloudinary.com/ds5a9i3cq/image/upload/c_fill,f_auto,g_auto,h_614,w_614/v1669729519/CeskeReality/todd-kent-178j8tJrNlc-unsplash_mgrje5.jpg 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: "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="https://res.cloudinary.com/ds5a9i3cq/image/upload/c_fill,f_auto,g_auto,h_312,w_312/v1669729519/CeskeReality/todd-kent-178j8tJrNlc-unsplash_mgrje5.jpg" alt="alt of image" loading="lazy" draggable="false" srcset="https://res.cloudinary.com/ds5a9i3cq/image/upload/c_fill,f_auto,g_auto,h_312,w_312/v1669729519/CeskeReality/todd-kent-178j8tJrNlc-unsplash_mgrje5.jpg 1x, https://res.cloudinary.com/ds5a9i3cq/image/upload/c_fill,f_auto,g_auto,h_614,w_614/v1669729519/CeskeReality/todd-kent-178j8tJrNlc-unsplash_mgrje5.jpg 2x">
  </picture>
</div>
    </a>

          <div class="i-overview"><span class="icon --white --lg i-overview__three-dimensional">
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.75 18.84"><defs><style>.cls-1{fill:none;stroke:#0062ab;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5px;}</style></defs><title>3D</title><g id="Vrstva_2" data-name="Vrstva 2"><g id="Vrstva_1-2" data-name="Vrstva 1"><polyline class="cls-1" points="0.75 13.95 1.29 11.9 3.34 12.44"/><path class="cls-1" d="M14.23,16.91A8.66,8.66,0,0,1,2.38,13.77,8.55,8.55,0,0,1,1.61,12"/><path class="cls-1" d="M18.25,11.63a8.63,8.63,0,0,1-4,5.28"/><polyline class="cls-1" points="19 4.88 18.46 6.93 16.41 6.39"/><path class="cls-1" d="M1.5,7.2a8.65,8.65,0,0,1,16.64-.37"/><path class="cls-1" d="M5.68,7.88a1.29,1.29,0,0,1,1.24-1A1.32,1.32,0,0,1,8.24,8.24,1.18,1.18,0,0,1,7.06,9.42,1.18,1.18,0,0,1,8.24,10.6a1.32,1.32,0,0,1-1.32,1.32,1.29,1.29,0,0,1-1.24-1"/><path class="cls-1" d="M12.53,11.92H10.74v-5h1.79a1.54,1.54,0,0,1,1.54,1.54v1.92A1.54,1.54,0,0,1,12.53,11.92Z"/></g></g></svg>

  </span>
<span class="icon --white --lg i-overview__videocamera">
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.5 13"><defs><style>.cls-1{fill:none;stroke:#0062ab;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5px;}</style></defs><title>video</title><g id="Vrstva_2" data-name="Vrstva 2"><g id="Vrstva_1-2" data-name="Vrstva 1"><rect class="cls-1" x="0.75" y="0.75" width="12.38" height="11.5" rx="2.06" ry="2.06"/><path class="cls-1" d="M13.12,7.6l3.8,3.05a1.13,1.13,0,0,0,1.83-.87V3.22a1.13,1.13,0,0,0-1.83-.87L13.12,5.4"/></g></g></svg>

  </span>
<span class="icon --white --lg i-overview__camera">
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.5 17.5"><defs><style>.cls-1{fill:none;stroke:#0062ab;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5px;}</style></defs><title>foto</title><g id="Vrstva_2" data-name="Vrstva 2"><g id="Vrstva_1-2" data-name="Vrstva 1"><path class="cls-1" d="M13.65,8a4.21,4.21,0,0,1-5.54,5.54A3.86,3.86,0,0,1,6,11.43,4.21,4.21,0,0,1,11.51,5.9,3.82,3.82,0,0,1,13.65,8Z"/><path class="cls-1" d="M18.75,5.43v9.64a1.68,1.68,0,0,1-1.68,1.68H2.43A1.68,1.68,0,0,1,.75,15.07V5.43A1.68,1.68,0,0,1,2.43,3.75H4.75L6.3,1.09A.7.7,0,0,1,6.89.75h5.67a.66.66,0,0,1,.58.33l1.61,2.67h2.32A1.68,1.68,0,0,1,18.75,5.43Z"/></g></g></svg>

  </span>

    <span class="i-overview__photo-count">
      7</span></div>
    
          <div class="i-dev-project-slide__cta-button">
        <button class="cta-button --active">

  <div class="cta-button__wrapper">
    <span class="icon">
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.5 17.5"><defs><style>.cls-1{fill:none;stroke:#0062ab;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5px;}</style></defs><title>oblibene</title><g id="Vrstva_2" data-name="Vrstva 2"><g id="Vrstva_1-2" data-name="Vrstva 1"><path class="cls-1" d="M13.45.75c3.17,0,5.3,3,5.3,5.75,0,5.64-8.84,10.25-9,10.25s-9-4.61-9-10.25C.75,3.73,2.88.75,6.05.75a4.71,4.71,0,0,1,3.51,1.5.26.26,0,0,0,.38,0A4.71,4.71,0,0,1,13.45.75Z"/></g></g></svg>
  </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">
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 15.19 19.45"><defs><style>.cls-1{fill:none;stroke:#0062ab;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.45px;}</style></defs><title>pin</title><g id="Vrstva_2" data-name="Vrstva 2"><g id="Vrstva_1-2" data-name="Vrstva 1"><path class="cls-1" d="M.72,7.77V7.6a6.88,6.88,0,1,1,13.75,0v.17c0,3.46-4.38,8.67-6.15,10.63a1,1,0,0,1-1.45,0C5.11,16.44.72,11.23.72,7.77Z"/><path class="cls-1" d="M5.3,7.68a2.3,2.3,0,0,0,4.6,0v0a2.3,2.3,0,0,0-4.6,0"/></g></g></svg>
  </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"
      }
    }
  }
}