Zavolat na 226 222 222 Můj výběr
Klientská zóna (otevře se v novém okně)
Zavolat na 226 222 222 Klientská zóna (otevře se v novém okně)

← Knihovna bloků

CTA dlaždice cta-tiles · light

Dvojice rozcestníkových dlaždic s videem na pozadí a skleněnou kartou: žlutá linka, titulek s tučným akcentem, podtitulek a žluté tlačítko. Klikatelná je celá dlaždice. Obsah je centrálně v _data/ctaTiles.json — blok vybírá klíčem ("lokality"), pro jednorázovou dlaždici jde místo klíče vložit rovnou objekt. Ve Figmě se rám jmenuje „Bannery“; v kódu se to slovo nepoužívá kvůli adblockům. Volitelný klíč `tag` (h2 / h3 / p, výchozí h2) mění úroveň nadpisu dlaždic pro stránku, kde by blok stál uvnitř jiné struktury. Sekce má poloviční svislé mezery (54 px) a bílé pozadí.

Pro integrátora: Dlaždice mají video na pozadí (video-bg.ts, data-video-set). Odkazy dlaždic na # nejsou finální — cíle se doplní v systému klienta.

Zdroj: src/_includes/blocks/cta-tiles/

Varianta „one“

Vzorová data (JSON) 
{
  "items": [
    "lokality"
  ]
}

Varianta „three“

Vzorová data (JSON) 
{
  "items": [
    "lokality",
    "eko",
    {
      "title": "Standardy\n<strong>našich bytů</strong>",
      "text": "kvalita prověřená desítkami projektů",
      "media": {
        "video": "cta-tiles/byty"
      },
      "button": {
        "title": "Zjistit více",
        "url": "#"
      }
    }
  ]
}

Varianta „long“

Vzorová data (JSON) 
{
  "items": [
    {
      "title": "Podívejte se na nabídku\n<strong>nových bytů v celé Praze</strong>",
      "text": "Vybírejte z více než dvaceti projektů v deseti pražských čtvrtích — od garsoniér po rodinné byty s předzahrádkou.",
      "media": {
        "video": "cta-tiles/byty"
      },
      "button": {
        "title": "Prohlédnout si všechny lokality",
        "url": "/prehled-lokalit/"
      }
    },
    "eko"
  ]
}

Varianta „no-media“

Vzorová data (JSON) 
{
  "items": [
    {
      "title": "Dlaždice\n<strong>bez videa</strong>",
      "text": "Zůstane tmavý podklad, karta i tlačítko musí být čitelné.",
      "button": {
        "title": "Zjistit více",
        "url": "#"
      }
    },
    {
      "title": "Dlaždice\n<strong>s fotkou</strong>",
      "text": "Místo media.video je vyplněné media.image.",
      "media": {
        "image": {
          "src": "/assets/images/photos/placeholder-16x9.svg",
          "alt": "",
          "width": 1600,
          "height": 900
        }
      },
      "button": {
        "title": "Zjistit více",
        "url": "#"
      }
    }
  ]
}

Varianta „no-button“

Vzorová data (JSON) 
{
  "items": [
    {
      "title": "Dlaždice\n<strong>bez tlačítka</strong>",
      "text": "Bez odkazu není dlaždice klikatelná, jen informuje.",
      "media": {
        "video": "cta-tiles/eko"
      }
    },
    "lokality"
  ]
}

Varianta „unknown-keys“

Vzorová data (JSON) 
{
  "items": [
    "neexistujici-klic",
    "eko"
  ]
}

Varianta „empty“

Vzorová data (JSON) 
{}