Gov Design System CE - Templates

Logos Section 

<section aria-labelledby="s5">
    <gov-flex direction="column" gap="l">
        <gov-flex direction="column" gap="m">
            <gov-flex gap="s" justify-content="space-between" align-items="center" class="gov-section-heading" responsive="false">
                <h2 id="s5">Partneři</h2>
                <gov-flex gap="s">
                    <gov-button color="primary" size="s" type="base" aria-label="Zobrazit všechny partnery">
                        Zobrazit vše

                    </gov-button>
                </gov-flex>
            </gov-flex>
        </gov-flex>
        <gov-flex class="partners-logos" gap="xl" wrap="wrap" responsive="false">
            <a href="https://www.dia.gov.cz/" aria-label="Otevřít stránky DIA" target="_blank" rel="noreferrer nofollow">
                <img src="/assets/documents" alt="" width="800" height="533" slot="img" />
            </a>
            <a href="https://nakit.cz/" aria-label="Otevřít stránky Nakit" target="_blank" rel="noreferrer nofollow">
                <img src="/assets/documents" alt="" width="800" height="533" slot="img" />
            </a>
            <a href="https://next-generation-eu.europa.eu/index_cs" aria-label="Otevřít stránky Next Generation EU" target="_blank" rel="noreferrer nofollow">
                <img src="/assets/documents" alt="" width="800" height="533" slot="img" />
            </a>
            <a href="https://www.planobnovycr.cz/" aria-label="Otevřít stránky Národní plán obnovy" target="_blank" rel="noreferrer nofollow">
                <img src="/assets/documents" alt="" width="800" height="533" slot="img" />
            </a>
        </gov-flex>
    </gov-flex>
</section>
 
<section aria-labelledby="{{ heading/id }}"{{#if classes}} class="{{#each classes}} {{ this }}{{/each}}"{{/if}}>
    <gov-flex direction="column" gap="l">
        {{ render '@section-heading' this }}
        <gov-flex class="partners-logos" gap="xl" wrap="wrap" responsive="false">
            {{#each logo }}
                <a href="{{ href }}" aria-label="{{ aria-label }}" target="_blank" rel="noreferrer nofollow">
                    {{ render '@image' image }}
                </a>
            {{/each}}
        </gov-flex>
    </gov-flex>
</section>
 
{
  "heading": {
    "tag": "h2",
    "name": "Partneři",
    "id": "s5"
  },
  "button": [
    {
      "text": "Zobrazit vše",
      "color": "primary",
      "type": "base",
      "size": "s",
      "aria-label": "Zobrazit všechny partnery"
    }
  ],
  "logo": [
    {
      "href": "https://www.dia.gov.cz/",
      "aria-label": "Otevřít stránky DIA",
      "svg": {
        "src": "/assets/logos/logo-dia.svg",
        "width": "78",
        "height": "35"
      }
    },
    {
      "href": "https://nakit.cz/",
      "aria-label": "Otevřít stránky Nakit",
      "svg": {
        "src": "/assets/logos/logo-nakit.svg",
        "width": "118",
        "height": "35"
      }
    },
    {
      "href": "https://next-generation-eu.europa.eu/index_cs",
      "aria-label": "Otevřít stránky Next Generation EU",
      "svg": {
        "src": "/assets/logos/financovano-eu.svg",
        "width": "114",
        "height": "32"
      }
    },
    {
      "href": "https://www.planobnovycr.cz/",
      "aria-label": "Otevřít stránky Národní plán obnovy",
      "svg": {
        "src": "/assets/logos/narodni-plan-obnovy.svg",
        "width": "100",
        "height": "35"
      }
    }
  ]
}
  • Content: 
    @import "../../../styles/mixins";

@include mq($until: md) {
    .partners-logos img {
        width: rem-calc(140);
        max-width: 100%;
    }
}
  • URL: /components/raw/logos-section/logos-section.scss
  • Filesystem Path: src/components/organisms/logos-section/logos-section.scss
  • Size: 149 Bytes

No notes defined.