Gov Design System CE - Templates

Tiles Section 

<section aria-labelledby="tiles-section">
    <gov-flex direction="column" gap="l">
        <h2 id="tiles-section">Mohlo by se vám hodit</h2>
        <gov-grid gap="l" class="gov-tile-grid mohlo-by-se-hodit">
            <gov-grid-item col-span="12" col-span-lg="6">

                <gov-tile orientation="horizontal" size="m" href="#" no-border>
                    <gov-icon type="complex" name="cities" slot="icon"></gov-icon>
                    <h3 slot="title">O nás</h3>
                    <span>Seznámení se s chodem úřadu a jeho povinnostech a právech</span>

                </gov-tile>

            </gov-grid-item>
            <gov-grid-item col-span="12" col-span-lg="6">

                <gov-tile orientation="horizontal" size="m" href="#" no-border>
                    <gov-icon type="complex" name="new-comments" slot="icon"></gov-icon>
                    <h3 slot="title">Aktuální dění</h3>
                    <span>Aktuální informace o dění v oblasti digitalizace</span>

                </gov-tile>

            </gov-grid-item>
            <gov-grid-item col-span="12" col-span-lg="6">

                <gov-tile orientation="horizontal" size="m" href="#" no-border>
                    <gov-icon type="complex" name="doc-diploma" slot="icon"></gov-icon>
                    <h3 slot="title">Dokumenty ke stažení</h3>
                    <span>Dokumentace spravovaná úřadem volně k nahlédnutí</span>

                </gov-tile>

            </gov-grid-item>
            <gov-grid-item col-span="12" col-span-lg="6">

                <gov-tile orientation="horizontal" size="m" href="#" no-border>
                    <gov-icon type="complex" name="info" slot="icon"></gov-icon>
                    <h3 slot="title">Statistický geoportál</h3>
                    <span>Platforma pro sdílení geograficky orientovaných statistických dat</span>

                </gov-tile>

            </gov-grid-item>
        </gov-grid>
    </gov-flex>
</section>
 
<section aria-labelledby="{{ heading/id }}">
    <gov-flex direction="column" gap="l">
        {{ render '@heading' heading }}
        {{ render '@tiles' this }}
    </gov-flex>
</section>
 
{
  "heading": {
    "tag": "h2",
    "name": "Mohlo by se vám hodit",
    "id": "tiles-section"
  },
  "classes": [
    "mohlo-by-se-hodit"
  ],
  "tile": [
    {
      "heading": {
        "slot": "title",
        "tag": "h3",
        "name": "O nás"
      },
      "content": "Seznámení se s chodem úřadu a jeho povinnostech a právech",
      "icon": {
        "slot": "icon",
        "name": "cities",
        "type": "complex"
      },
      "orientation": "horizontal",
      "size": "m",
      "href": "#",
      "noborder": "false",
      "col-span": {
        "default": "12",
        "lg": "6"
      }
    },
    {
      "heading": {
        "slot": "title",
        "tag": "h3",
        "name": "Aktuální dění"
      },
      "content": "Aktuální informace o dění v oblasti digitalizace",
      "icon": {
        "slot": "icon",
        "name": "new-comments",
        "type": "complex"
      },
      "orientation": "horizontal",
      "size": "m",
      "href": "#",
      "noborder": "false",
      "col-span": {
        "default": "12",
        "lg": "6"
      }
    },
    {
      "heading": {
        "slot": "title",
        "tag": "h3",
        "name": "Dokumenty ke stažení"
      },
      "content": "Dokumentace spravovaná úřadem volně k nahlédnutí",
      "icon": {
        "slot": "icon",
        "name": "doc-diploma",
        "type": "complex"
      },
      "orientation": "horizontal",
      "size": "m",
      "href": "#",
      "noborder": "false",
      "col-span": {
        "default": "12",
        "lg": "6"
      }
    },
    {
      "heading": {
        "slot": "title",
        "tag": "h3",
        "name": "Statistický geoportál"
      },
      "content": "Platforma pro sdílení geograficky orientovaných statistických dat",
      "icon": {
        "slot": "icon",
        "name": "info",
        "type": "complex"
      },
      "orientation": "horizontal",
      "size": "m",
      "href": "#",
      "noborder": "false",
      "col-span": {
        "default": "12",
        "lg": "6"
      }
    }
  ]
}

No notes defined.