← Knihovna bloků

Infografika EKO-SMART infographic · full

Bílá sekce s vycentrovanou hlavičkou (badge, H2) a pod ní velká karta s videem (nebo fotkou) na pozadí: vlevo textový blok, vpravo skleněný panel detailu a dole řádka přepínatelných kategorií. Výchozí stav má otevřenou první kategorii; křížek i „Zpět na přehled“ panel zavřou a odhalí celé pozadí.

Pro integrátora: Karty infografiky řídí infographic.ts; video v pozadí vkládá video-bg.ts.

Zdroj: src/_includes/blocks/infographic/

Varianta „default“

Vzorová data (JSON)
{
  "settings": {
    "background": "white"
  },
  "pretitle": "Technologie",
  "title": "EKO-SMART prvky a modrozelená infrastruktura",
  "intro": {
    "pretitle": "Udržitelné bydlení",
    "title": "Bydlení, které jde s dobou",
    "text": "Naše projekty stavíme v energeticky velmi úsporné třídě PENB B a využíváme řadu EKO-SMART prvků pro úspornější provoz a šetrnější přístup k životnímu prostředí."
  },
  "media": {
    "video": "infographic/eko-smart"
  },
  "categories": [
    {
      "icon": "energy",
      "label": "Energie a úspory",
      "title": "Energie a úspory",
      "text": "Moderní technologie, kvalitní materiály a chytrá řešení dělají z našich projektů zdravé a úsporné místo pro život.",
      "items": [
        {
          "icon": "sparkles",
          "title": "Zateplená fasáda a okna s trojskly",
          "text": "Minimalizace tepelných ztrát a zvýšení energetické účinnosti budov."
        },
        {
          "icon": "sparkles",
          "title": "Tepelná čerpadla",
          "text": "Úsporný zdroj vytápění, který využívá energii z okolního prostředí."
        },
        {
          "icon": "sparkles",
          "title": "Stropní vytápění a chlazení",
          "text": "Energeticky efektivní systém sálavých topných ploch pro celoroční regulaci teploty."
        },
        {
          "icon": "sparkles",
          "title": "Výtahy se zpětným získáváním energie",
          "text": "Rekuperační technologie vracející energii zpět do sítě."
        }
      ]
    },
    {
      "icon": "water",
      "label": "Voda a hospodaření",
      "title": "Voda a hospodaření",
      "text": "Efektivní nakládání s vodou pomáhá šetřit přírodní zdroje a snižuje provozní náklady.",
      "items": [
        {
          "icon": "sparkles",
          "title": "Zpracování šedé vody",
          "text": "Recyklace mírně znečištěné vody ze sprch a umyvadel pro splachování nebo zalévání."
        },
        {
          "icon": "sparkles",
          "title": "Rekuperace",
          "text": "Řízené větrání se zpětným ziskem tepla pro přísun čerstvého vzduchu bez tepelných ztrát."
        },
        {
          "icon": "sparkles",
          "title": "Retenční nádrže",
          "text": "Zadržování dešťové vody, kterou lze dále využívat na zalévání nebo splachování."
        },
        {
          "icon": "sparkles",
          "title": "Zelené střechy",
          "text": "Vegetační vrstva slouží jako účinná přírodní izolace a přispívá k celoroční regulaci teploty budovy."
        }
      ]
    },
    {
      "icon": "materials",
      "label": "Materiály a konstrukce",
      "title": "Materiály a konstrukce",
      "text": "Kvalitní materiály a promyšlené konstrukční řešení zajišťují dlouhou životnost staveb, nízké provozní náklady a vysoký komfort bydlení.",
      "items": [
        {
          "icon": "sparkles",
          "title": "Klimatizace",
          "text": "Zařízení pro chlazení interiéru zajišťuje tepelný komfort i během letních měsíců."
        },
        {
          "icon": "sparkles",
          "title": "Venkovní stínění",
          "text": "Venkovní žaluzie či rolety chrání interiér před přehříváním a zároveň zvyšují soukromí."
        },
        {
          "icon": "sparkles",
          "title": "Fotovoltaika",
          "text": "Solární panely snižují provozní náklady budov a přispívají k energetické soběstačnosti."
        },
        {
          "icon": "sparkles",
          "title": "Chytrá domácnost",
          "text": "Systém propojující zařízení a technologie pro zvýšení komfortu a energetické efektivity."
        }
      ]
    },
    {
      "icon": "leaf",
      "label": "Okolí a mobilita",
      "title": "Okolí a mobilita",
      "text": "Dbáme na kvalitu okolního prostředí a podporujeme udržitelnou mobilitu v rámci našich rezidenčních projektů.",
      "items": [
        {
          "icon": "sparkles",
          "title": "Nabíjení pro elektromobily",
          "text": "Dobíjecí stanice umožňují pohodlné nabíjení elektromobilů přímo v místě bydliště."
        },
        {
          "icon": "sparkles",
          "title": "Prvky z recyklovaných materiálů",
          "text": "Využití recyklovaných materiálů pomáhá šetřit přírodní zdroje."
        },
        {
          "icon": "sparkles",
          "title": "Sdílení kol a aut",
          "text": "Sdílená mobilita nabízí další pohodlnou možnost dopravy bez nutnosti vlastního vozidla."
        },
        {
          "icon": "sparkles",
          "title": "Nabíjení pro elektrokola",
          "text": "Dobíjecí místa pro elektrokola zvyšují komfort jejich každodenního používání a podporují šetrnější způsob dopravy."
        }
      ]
    }
  ],
  "labels": {
    "category": "Kategorie",
    "back": "Zpět na přehled",
    "close": "Zavřít detail"
  }
}

Varianta „empty“

Vzorová data (JSON)
{}

Varianta „one“

Vzorová data (JSON)
{
  "settings": {
    "background": "white"
  },
  "pretitle": "Technologie",
  "title": "Jediná kategorie",
  "intro": {
    "pretitle": "Udržitelné bydlení",
    "title": "Bydlení, co jde s dobou",
    "text": "Řádka kategorií se nesmí roztáhnout do jedné obří karty přes celou šířku."
  },
  "media": {
    "image": {
      "src": "/assets/images/photos/infographic-1408.jpg",
      "srcset": "/assets/images/photos/infographic-768.jpg 768w, /assets/images/photos/infographic-1408.jpg 1408w",
      "webpSrcset": "/assets/images/photos/infographic-768.webp 768w, /assets/images/photos/infographic-1408.webp 1408w, /assets/images/photos/infographic-2816.webp 2816w",
      "sizes": "(min-width: 1440px) 1408px, 100vw",
      "alt": "",
      "width": 1408,
      "height": 880
    }
  },
  "categories": [
    {
      "icon": "energy",
      "label": "Energie a úspory",
      "text": "Jediná kategorie v bloku — panel i tak musí jít zavřít a zase otevřít.",
      "items": [
        {
          "icon": "sparkles",
          "title": "Tepelná čerpadla",
          "text": "Úsporný zdroj vytápění využívající energii z okolního prostředí."
        }
      ]
    }
  ]
}

Varianta „no-items“

Vzorová data (JSON)
{
  "settings": {
    "background": "white"
  },
  "pretitle": "Technologie",
  "title": "Kategorie bez výčtu prvků",
  "intro": {
    "pretitle": "Udržitelné bydlení",
    "title": "Bydlení, co jde s dobou",
    "text": "Tak vypadají v grafice tři ze čtyř kategorií — jen ikona, název a popis."
  },
  "media": {
    "image": {
      "src": "/assets/images/photos/infographic-1408.jpg",
      "srcset": "/assets/images/photos/infographic-768.jpg 768w, /assets/images/photos/infographic-1408.jpg 1408w",
      "webpSrcset": "/assets/images/photos/infographic-768.webp 768w, /assets/images/photos/infographic-1408.webp 1408w, /assets/images/photos/infographic-2816.webp 2816w",
      "sizes": "(min-width: 1440px) 1408px, 100vw",
      "alt": "",
      "width": 1408,
      "height": 880
    }
  },
  "categories": [
    {
      "icon": "energy",
      "label": "Energie a úspory",
      "text": "Panel ukáže jen hlavičku a popis, seznam prvků se vynechá."
    },
    {
      "icon": "water",
      "label": "Voda a hospodaření",
      "text": "Dešťovou vodu zadržujeme na pozemku a využíváme ji k zálivce zeleně."
    },
    {
      "icon": "materials",
      "label": "Materiály a konstrukce"
    },
    {
      "icon": "leaf",
      "label": "Okolí a mobilita"
    }
  ]
}

Varianta „no-image“

Vzorová data (JSON)
{
  "settings": {
    "background": "white"
  },
  "pretitle": "Technologie",
  "title": "Karta bez fotky na pozadí",
  "intro": {
    "pretitle": "Udržitelné bydlení",
    "title": "Bydlení, co jde s dobou",
    "text": "Bez fotky zůstane karta na tmavém podkladu — sklo panelu i text musí zůstat čitelné."
  },
  "categories": [
    {
      "icon": "energy",
      "label": "Energie a úspory",
      "text": "Moderní technologie, kvalitní materiály a chytrá řešení dělají z našich projektů zdravé a úsporné místo pro život.",
      "items": [
        {
          "icon": "sparkles",
          "title": "Tepelná čerpadla",
          "text": "Úsporný zdroj vytápění využívající energii z okolního prostředí."
        },
        {
          "icon": "sparkles",
          "title": "Stropní vytápění a chlazení",
          "text": "Energeticky efektivní systém sálavých topných ploch."
        }
      ]
    },
    {
      "icon": "water",
      "label": "Voda a hospodaření",
      "text": "Dešťová voda se zadržuje na pozemku a postupně vsakuje zpět do podloží.",
      "items": [
        {
          "icon": "sparkles",
          "title": "Retenční nádrže",
          "text": "Zadrženou vodu využíváme k údržbě zeleně."
        }
      ]
    }
  ]
}

Varianta „no-intro“

Vzorová data (JSON)
{
  "settings": {
    "background": "white"
  },
  "pretitle": "Technologie",
  "title": "Karta bez levého textu",
  "media": {
    "image": {
      "src": "/assets/images/photos/infographic-1408.jpg",
      "srcset": "/assets/images/photos/infographic-768.jpg 768w, /assets/images/photos/infographic-1408.jpg 1408w",
      "webpSrcset": "/assets/images/photos/infographic-768.webp 768w, /assets/images/photos/infographic-1408.webp 1408w, /assets/images/photos/infographic-2816.webp 2816w",
      "sizes": "(min-width: 1440px) 1408px, 100vw",
      "alt": "",
      "width": 1408,
      "height": 880
    }
  },
  "categories": [
    {
      "icon": "energy",
      "label": "Energie a úspory",
      "text": "Bez bloku `intro` zabere panel kartu sám a fotka zůstane odkrytá vlevo.",
      "items": [
        {
          "icon": "sparkles",
          "title": "Fasádní zateplovací systém a okna s trojskly",
          "text": "Kombinace kvalitního zateplení a oken s izolačními trojskly minimalizuje tepelné ztráty."
        },
        {
          "icon": "sparkles",
          "title": "Tepelná čerpadla",
          "text": "Úsporný zdroj vytápění využívající energii z okolního prostředí."
        }
      ]
    },
    {
      "icon": "water",
      "label": "Voda a hospodaření",
      "text": "Dešťová voda se zadržuje na pozemku a postupně vsakuje zpět do podloží."
    }
  ]
}

Varianta „no-icon“

Vzorová data (JSON)
{
  "settings": {
    "background": "white"
  },
  "pretitle": "Technologie",
  "title": "Kategorie i prvky bez ikon",
  "intro": {
    "pretitle": "Udržitelné bydlení",
    "title": "Bydlení, co jde s dobou",
    "text": "Bez ikony se kruh vypustí a text se zarovná doleva — kontrakt ikonu nevyžaduje."
  },
  "media": {
    "image": {
      "src": "/assets/images/photos/infographic-1408.jpg",
      "srcset": "/assets/images/photos/infographic-768.jpg 768w, /assets/images/photos/infographic-1408.jpg 1408w",
      "webpSrcset": "/assets/images/photos/infographic-768.webp 768w, /assets/images/photos/infographic-1408.webp 1408w, /assets/images/photos/infographic-2816.webp 2816w",
      "sizes": "(min-width: 1440px) 1408px, 100vw",
      "alt": "",
      "width": 1408,
      "height": 880
    }
  },
  "categories": [
    {
      "label": "Energie a úspory",
      "text": "Moderní technologie, kvalitní materiály a chytrá řešení dělají z našich projektů zdravé a úsporné místo pro život.",
      "items": [
        {
          "title": "Tepelná čerpadla",
          "text": "Úsporný zdroj vytápění využívající energii z okolního prostředí."
        },
        {
          "title": "Stropní vytápění a chlazení",
          "text": "Energeticky efektivní systém sálavých topných ploch pro celoroční regulaci teploty."
        }
      ]
    },
    {
      "label": "Voda a hospodaření",
      "text": "Dešťová voda se zadržuje na pozemku a postupně vsakuje zpět do podloží.",
      "items": [
        {
          "title": "Retenční nádrže a vsakovací objekty",
          "text": "Zadrženou vodu využíváme k údržbě zeleně."
        }
      ]
    }
  ]
}

Varianta „long“

Vzorová data (JSON)
{
  "settings": {
    "background": "white"
  },
  "pretitle": "Dlouhý nadtitulek sekce s technologiemi",
  "title": "EKO-SMART prvky, modrozelená infrastruktura a hospodaření s dešťovou vodou v celém areálu",
  "intro": {
    "pretitle": "Udržitelné a zdravé bydlení pro celou rodinu",
    "title": "Bydlení, co jde s dobou a myslí i na generace po nás",
    "text": "Stavíme energeticky velmi úsporné byty s využitím řady vybraných moderních EKO-SMART prvků pro vaše maximální pohodlí, nižší provozní náklady a šetrnější provoz celého domu po celou dobu jeho životnosti."
  },
  "media": {
    "image": {
      "src": "/assets/images/photos/infographic-1408.jpg",
      "srcset": "/assets/images/photos/infographic-768.jpg 768w, /assets/images/photos/infographic-1408.jpg 1408w",
      "webpSrcset": "/assets/images/photos/infographic-768.webp 768w, /assets/images/photos/infographic-1408.webp 1408w, /assets/images/photos/infographic-2816.webp 2816w",
      "sizes": "(min-width: 1440px) 1408px, 100vw",
      "alt": "",
      "width": 1408,
      "height": 880
    }
  },
  "categories": [
    {
      "icon": "energy",
      "label": "Energie, úspory a hospodaření s teplem",
      "title": "Energie, úspory a hospodaření s teplem v bytových domech",
      "text": "Moderní technologie, kvalitní materiály a chytrá řešení dělají z našich projektů zdravé a úsporné místo pro život po celý rok.",
      "items": [
        {
          "icon": "sparkles",
          "title": "Fasádní zateplovací systém a okna s izolačními trojskly",
          "text": "Kombinace kvalitního zateplení a oken s izolačními trojskly minimalizuje tepelné ztráty i v zimních měsících."
        },
        {
          "icon": "sparkles",
          "title": "Tepelná čerpadla",
          "text": "Úsporný zdroj vytápění využívající energii z okolního prostředí."
        },
        {
          "icon": "sparkles",
          "title": "Stropní vytápění a chlazení",
          "text": "Energeticky efektivní systém sálavých topných ploch pro celoroční regulaci teploty."
        },
        {
          "icon": "sparkles",
          "title": "Výtahy se zpětným získáváním energie",
          "text": "Rekuperační technologie vracející energii zpět do sítě."
        },
        {
          "icon": "sparkles",
          "title": "Fotovoltaické panely na střechách",
          "text": "Vyrobenou elektřinu spotřebují společné prostory domu."
        },
        {
          "icon": "sparkles",
          "title": "Měření spotřeby po jednotlivých bytech",
          "text": "Přehled o spotřebě tepla i vody v reálném čase."
        },
        {
          "icon": "sparkles",
          "title": "Osvětlení společných prostor s čidly pohybu",
          "text": "Světlo svítí jen tam, kde je opravdu potřeba."
        },
        {
          "icon": "sparkles",
          "title": "Předokenní žaluzie proti letnímu přehřívání",
          "text": "Stínění snižuje potřebu chlazení v horkých měsících."
        }
      ]
    },
    {
      "icon": "water",
      "label": "Voda, dešťová kanalizace a modrozelená infrastruktura",
      "text": "S dešťovou i pitnou vodou nakládáme tak, aby zůstala v místě, kde spadne, a snižovala provozní náklady domu.",
      "items": [
        {
          "icon": "sparkles",
          "title": "Retenční nádrže a vsakovací objekty",
          "text": "Dešťová voda se zadržuje na pozemku a postupně vsakuje zpět do podloží."
        }
      ]
    }
  ]
}