sunweb

Items grid

component items-grid items grid

Definition


The "Items grid" component is used to display a grid of items in multiple columns. This component also hides or shows items using the "collapse component" according to a given number of items (settable).

General use (Default)


c-items-grid default (no-collapse)

Item grid can have a collapse or not. This is the default example without "collapse".

Handlebars

First Excursion

From
1.295

Det bästa sättet att börja din semester är att besöka det turkiska badet hamam. Här kommerdu att få en trevlig och lyxig avkopplande start på semestern. Efter en stund i ångbastun eller bastun där din kroppstemperatur ökar och porerna öppnas ska du ta ett dopp i ett iskallt bad. Temperaturskiften ökar blodflödet och efter det går du in i hararet, det varma rummet. Här lägger du dig på en stor uppvärmd marmorsten och skrubbas med en hamphandske för att ta bort alla döda hudceller.

Second Excursion

From
1.295

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas auctor ante justo, at efficitur metus pellentesque sed. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam consectetur quam non ligula tincidunt, elementum accumsan velit mollis.

Third Excursion

From
1.295

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas auctor ante justo, at efficitur metus pellentesque sed. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam consectetur quam non ligula tincidunt, elementum accumsan velit mollis.

Fourth Excursion

From
1.295

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas auctor ante justo, at efficitur metus pellentesque sed. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam consectetur quam non ligula tincidunt, elementum accumsan velit mollis.

Fifth Excursion

From
1.295

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas auctor ante justo, at efficitur metus pellentesque sed. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam consectetur quam non ligula tincidunt, elementum accumsan velit mollis.

Sixth Excursion

From
1.295

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas auctor ante justo, at efficitur metus pellentesque sed. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam consectetur quam non ligula tincidunt, elementum accumsan velit mollis.

Seventh Excursion

From
1.295

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas auctor ante justo, at efficitur metus pellentesque sed. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam consectetur quam non ligula tincidunt, elementum accumsan velit mollis.

Eighth Excursion

From
1.295

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas auctor ante justo, at efficitur metus pellentesque sed. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam consectetur quam non ligula tincidunt, elementum accumsan velit mollis.

Nineth Excursion

From
1.295

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas auctor ante justo, at efficitur metus pellentesque sed. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam consectetur quam non ligula tincidunt, elementum accumsan velit mollis.

Loading...

.c-items-grid.c-items-grid--collapsible [maxItems=6]

Item grid has the option to be collapsed. In this example, the collapse is set to a maximum of 6 items. The data is the same as the previous example.

Handlebars

First Excursion

From
1.295

Det bästa sättet att börja din semester är att besöka det turkiska badet hamam. Här kommerdu att få en trevlig och lyxig avkopplande start på semestern. Efter en stund i ångbastun eller bastun där din kroppstemperatur ökar och porerna öppnas ska du ta ett dopp i ett iskallt bad. Temperaturskiften ökar blodflödet och efter det går du in i hararet, det varma rummet. Här lägger du dig på en stor uppvärmd marmorsten och skrubbas med en hamphandske för att ta bort alla döda hudceller.

Second Excursion

From
1.295

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas auctor ante justo, at efficitur metus pellentesque sed. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam consectetur quam non ligula tincidunt, elementum accumsan velit mollis.

Third Excursion

From
1.295

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas auctor ante justo, at efficitur metus pellentesque sed. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam consectetur quam non ligula tincidunt, elementum accumsan velit mollis.

Fourth Excursion

From
1.295

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas auctor ante justo, at efficitur metus pellentesque sed. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam consectetur quam non ligula tincidunt, elementum accumsan velit mollis.

Fifth Excursion

From
1.295

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas auctor ante justo, at efficitur metus pellentesque sed. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam consectetur quam non ligula tincidunt, elementum accumsan velit mollis.

Sixth Excursion

From
1.295

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas auctor ante justo, at efficitur metus pellentesque sed. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam consectetur quam non ligula tincidunt, elementum accumsan velit mollis.

Seventh Excursion

From
1.295

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas auctor ante justo, at efficitur metus pellentesque sed. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam consectetur quam non ligula tincidunt, elementum accumsan velit mollis.

Eighth Excursion

From
1.295

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas auctor ante justo, at efficitur metus pellentesque sed. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam consectetur quam non ligula tincidunt, elementum accumsan velit mollis.

Nineth Excursion

From
1.295

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas auctor ante justo, at efficitur metus pellentesque sed. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam consectetur quam non ligula tincidunt, elementum accumsan velit mollis.

Loading...