Collection
Plain text collection
Linked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Unlinked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Unlinked item
<div class="o-grid">
<div class="o-grid-4">
<!-- collection.blade.php -->
<div class="c-collection" data-uid="662d1f4f00d4f">
<!-- collection__item.blade.php -->
<a class="c-collection__item c-collection__item--action" href="https://link.link" data-uid="662d1f4f00c6b">
<div class="c-collection__content">
Linked item
</div>
</a>
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f00cbd">
<div class="c-collection__content">
Unlinked item
</div>
</div>
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f00cee">
<div class="c-collection__content">
Unlinked item
</div>
</div>
</div> </div>
<div class="o-grid-4">
<!-- collection.blade.php -->
<div class="c-collection" data-uid="662d1f4f00d8b">
<!-- collection__item.blade.php -->
<a class="c-collection__item c-collection__item--action" href="https://helsingborg.se" data-uid="662d1f4f00e1e">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f00de5">
Linked item
</p>
</div>
</a>
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f00f5d">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f00e51">
Unlinked item
</p>
</div>
</div>
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f01008">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f00fb0">
Unlinked item
</p>
</div>
</div>
</div> </div>
</div><div class="o-grid">
<div class="o-grid-4">
@collection()
@collection__item(['link' => "https://link.link"])
Linked item
@endcollection__item
@collection__item()
Unlinked item
@endcollection__item
@collection__item()
Unlinked item
@endcollection__item
@endcollection
</div>
<div class="o-grid-4">
@collection(
[
'list' => [
['content' => 'Linked item', 'link' => "https://helsingborg.se"],
'Unlinked item',
['content' => 'Unlinked item', 'link' => false],
],
]
)
@endcollection
</div>
</div>Multiline text collection
This is a multiline
We also have defined link.
This is a multiline
Nothing more than that.
This is a multiline with an icon
We also have defined link.
This is a multiline with an icon
Nothing more than that. Donec sed odio dui. Integer posuere erat a ante venenatis dapibus posuere velit aliquet.
<div class="o-grid">
<div class="o-grid-4">
<!-- collection.blade.php -->
<div class="c-collection" data-uid="662d1f4f01199">
<!-- collection__item.blade.php -->
<a class="c-collection__item c-collection__item--action" href="https://link.link" data-uid="662d1f4f010ed">
<div class="c-collection__content">
<!-- typography.blade.php original: h4 -->
<h2 class="c-typography c-typography__variant--h2" data-uid="662d1f4f01092">
This is a multiline
</h2> <!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f010c0">
We also have defined link.
</p>
</div>
</a>
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f0116e">
<div class="c-collection__content">
<!-- typography.blade.php original: h4 -->
<h3 class="c-typography c-typography__variant--h3" data-uid="662d1f4f0111d">
This is a multiline
</h3> <!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f01146">
Nothing more than that.
</p>
</div>
</div>
</div> </div>
<div class="o-grid-4">
<!-- collection.blade.php -->
<div class="c-collection" data-uid="662d1f4f01396">
<!-- collection__item.blade.php -->
<a class="c-collection__item c-collection__item--action" href="https://link.link" data-uid="662d1f4f01216">
<div class="c-collection__content">
<!-- typography.blade.php original: h4 -->
<h4 class="c-typography c-typography__variant--h4" data-uid="662d1f4f011c4">
This is a multiline with an icon
</h4> <!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f011ec">
We also have defined link.
</p>
</div>
</a>
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f0135b">
<div class="c-collection__icon">
<!-- icon.blade.php -->
<span class="c-icon c-icon--assignment c-icon--material c-icon--material-assignment material-symbols-outlined material-symbols-outlined--filled c-icon--size-md" material-symbol="assignment" role="img" aria-label="Icon: Undefined" alt="Icon: Undefined" data-nosnippet="" translate="no" aria-hidden="true" data-uid="662d1f4f01282">
</span>
</div>
<div class="c-collection__content">
<!-- typography.blade.php original: h4 -->
<h4 class="c-typography c-typography__variant--h4" data-uid="662d1f4f012e1">
This is a multiline with an icon
</h4> <!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f0131d">
Nothing more than that. Donec sed odio dui. Integer posuere erat a ante venenatis dapibus posuere velit aliquet.
</p>
</div>
</div>
</div> </div>
</div><div class="o-grid">
<div class="o-grid-4">
@collection([])
@collection__item(['link' => 'https://link.link'])
@typography(['element' => 'h4'])
This is a multiline
@endtypography
@typography([])
We also have defined link.
@endtypography
@endcollection__item
@collection__item()
@typography(['element' => 'h4'])
This is a multiline
@endtypography
@typography([])
Nothing more than that.
@endtypography
@endcollection__item
@endcollection
</div>
<div class="o-grid-4">
@collection([])
@collection__item([
'icon' => 'account_circle',
'link' => 'https://link.link'
])
@typography(['element' => 'h4'])
This is a multiline with an icon
@endtypography
@typography([])
We also have defined link.
@endtypography
@endcollection__item
@collection__item()
@slot('prefix')
<div class="c-collection__icon">
@icon(['icon' => 'assignment', 'size' => 'md'])
@endicon
</div>
@endslot
@typography(['element' => 'h4'])
This is a multiline with an icon
@endtypography
@typography([])
Nothing more than that. Donec sed odio dui. Integer posuere erat a ante venenatis dapibus posuere velit aliquet.
@endtypography
@endcollection__item
@endcollection
</div>
</div>Collection with secondary
This is a multiline
We also have defined a icon and a action link.
This is a multiline
This has the same configuration as above. But applied a link to the item. Actions then dissapear.
<div class="o-grid">
<div class="o-grid-4">
<!-- collection.blade.php -->
<div class="c-collection" data-uid="662d1f4f01679">
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f0146b">
<div class="c-collection__content">
<!-- typography.blade.php original: h4 -->
<h4 class="c-typography c-typography__variant--h4" data-uid="662d1f4f01414">
This is a multiline
</h4> <!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f0143f">
We also have defined a icon and a action link.
</p>
</div>
</div>
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f015c8">
<div class="c-collection__icon">
<!-- icon.blade.php -->
<span class="c-icon c-icon--home c-icon--material c-icon--material-home material-symbols-outlined material-symbols-outlined--filled c-icon--size-md" material-symbol="home" role="img" aria-label="Icon: Undefined" alt="Icon: Undefined" data-nosnippet="" translate="no" aria-hidden="true" data-uid="662d1f4f014a5">
</span>
</div>
<div class="c-collection__content">
<!-- typography.blade.php original: h4 -->
<h4 class="c-typography c-typography__variant--h4" data-uid="662d1f4f014db">
I'm an imposter!
</h4> <!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f01504">
I use my slots to mimic the above collection item.
</p>
</div>
<div class="c-collection__secondary">
<a class="c-link" id="" href="https://link.link" target="_top" data-uid="662d1f4f01592">
<!-- icon.blade.php -->
<span class="c-icon c-icon--star c-icon--material c-icon--material-star material-symbols-outlined material-symbols-outlined--filled c-icon--size-md" material-symbol="star" role="img" aria-label="Icon: Undefined" alt="Icon: Undefined" data-nosnippet="" translate="no" aria-hidden="true" data-uid="662d1f4f01536">
</span>
</a>
</div>
</div>
<!-- collection__item.blade.php -->
<a class="c-collection__item c-collection__item--action" href="http://helsingborg.se" data-uid="662d1f4f0164d">
<div class="c-collection__content">
<!-- typography.blade.php original: h4 -->
<h4 class="c-typography c-typography__variant--h4" data-uid="662d1f4f015f8">
This is a multiline
</h4> <!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f01621">
This has the same configuration as above. But applied a link to the item. Actions then dissapear.
</p>
</div>
</a>
</div> </div>
</div><div class="o-grid">
<div class="o-grid-4">
@collection()
@collection__item([
'icon' => 'home',
'action' => [
'icon' => 'star',
'link' => 'http://link.link'
]
])
@typography(['element' => 'h4'])
This is a multiline
@endtypography
@typography([])
We also have defined a icon and a action link.
@endtypography
@endcollection__item
@collection__item()
@slot('prefix')
<div class="c-collection__icon">
@icon(['icon' => 'home', 'size' => 'md'])
@endicon
</div>
@endslot
@typography(['element' => 'h4'])
I'm an imposter!
@endtypography
@typography([])
I use my slots to mimic the above collection item.
@endtypography
@slot('secondary')
@link(['href' => 'https://link.link'])
@icon(['icon' => 'star', 'size' => 'md'])
@endicon
@endlink
@endslot
@endcollection__item
@collection__item([
'icon' => 'home',
'action' => [
'icon' => 'star',
'link' => 'http://link.link'
],
'link' => 'http://helsingborg.se'
])
@typography(['element' => 'h4'])
This is a multiline
@endtypography
@typography([])
This has the same configuration as above. But applied a link to the item. Actions then dissapear.
@endtypography
@endcollection__item
@endcollection
</div>
</div>Collection with modifiers
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Collection modifier
This utilizes the "bordered" and will therefore display differently.
Linked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Unlinked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Unlinked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Collection modifier
This utilizes the "compact" and will therefore display differently.
Linked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Unlinked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Unlinked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Collection modifier
This utilizes the "sharp" and will therefore display differently.
Linked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Unlinked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Unlinked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Collection modifier
This utilizes the "sharpBottom" and will therefore display differently.
Linked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Unlinked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Unlinked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Collection modifier
This utilizes the "sharpTop" and will therefore display differently.
Linked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Unlinked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Unlinked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Collection modifier
This utilizes the "unbox" and will therefore display differently.
Linked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Unlinked item
Warning: The parameter "link" in the collection__item component should be of type "string" but was recieved as type "boolean". in /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php on line 228
Unlinked item
<div class="o-grid">
<div class="o-grid-4">
<!-- collection.blade.php -->
<div class="c-collection c-collection--bordered" data-uid="662d1f4f016ef">
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f017a5">
<div class="c-collection__content">
<!-- typography.blade.php original: h4 -->
<h4 class="c-typography c-typography__variant--h4" data-uid="662d1f4f01724">
Collection modifier
</h4>
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f0174f">
This utilizes the "bordered" and will therefore display differently.
</p>
</div>
</div>
<!-- collection__item.blade.php -->
<a class="c-collection__item c-collection__item--action" href="https://helsingborg.se" data-uid="662d1f4f01806">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f017da">
Linked item
</p>
</div>
</a>
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f018ac">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f01834">
Unlinked item
</p>
</div>
</div>
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f01921">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f018e4">
Unlinked item
</p>
</div>
</div>
</div> </div>
<div class="o-grid-4">
<!-- collection.blade.php -->
<div class="c-collection c-collection--compact" data-uid="662d1f4f01958">
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f019e3">
<div class="c-collection__content">
<!-- typography.blade.php original: h4 -->
<h4 class="c-typography c-typography__variant--h4" data-uid="662d1f4f01985">
Collection modifier
</h4>
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f019b1">
This utilizes the "compact" and will therefore display differently.
</p>
</div>
</div>
<!-- collection__item.blade.php -->
<a class="c-collection__item c-collection__item--action" href="https://helsingborg.se" data-uid="662d1f4f01a39">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f01a10">
Linked item
</p>
</div>
</a>
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f01a96">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f01a66">
Unlinked item
</p>
</div>
</div>
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f01b17">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f01ac1">
Unlinked item
</p>
</div>
</div>
</div> </div>
<div class="o-grid-4">
<!-- collection.blade.php -->
<div class="c-collection c-collection--sharp" data-uid="662d1f4f01b50">
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f01be0">
<div class="c-collection__content">
<!-- typography.blade.php original: h4 -->
<h4 class="c-typography c-typography__variant--h4" data-uid="662d1f4f01b7f">
Collection modifier
</h4>
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f01baa">
This utilizes the "sharp" and will therefore display differently.
</p>
</div>
</div>
<!-- collection__item.blade.php -->
<a class="c-collection__item c-collection__item--action" href="https://helsingborg.se" data-uid="662d1f4f01c3a">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f01c0f">
Linked item
</p>
</div>
</a>
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f01cae">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f01c76">
Unlinked item
</p>
</div>
</div>
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f01d10">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f01cdd">
Unlinked item
</p>
</div>
</div>
</div> </div>
<div class="o-grid-4">
<!-- collection.blade.php -->
<div class="c-collection c-collection--sharp-bot" data-uid="662d1f4f01d47">
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f01dd3">
<div class="c-collection__content">
<!-- typography.blade.php original: h4 -->
<h4 class="c-typography c-typography__variant--h4" data-uid="662d1f4f01d75">
Collection modifier
</h4>
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f01da0">
This utilizes the "sharpBottom" and will therefore display differently.
</p>
</div>
</div>
<!-- collection__item.blade.php -->
<a class="c-collection__item c-collection__item--action" href="https://helsingborg.se" data-uid="662d1f4f01e2d">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f01e02">
Linked item
</p>
</div>
</a>
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f01e8f">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f01e5c">
Unlinked item
</p>
</div>
</div>
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f01efd">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f01ec9">
Unlinked item
</p>
</div>
</div>
</div> </div>
<div class="o-grid-4">
<!-- collection.blade.php -->
<div class="c-collection c-collection--sharp-top" data-uid="662d1f4f01f34">
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f01fc4">
<div class="c-collection__content">
<!-- typography.blade.php original: h4 -->
<h4 class="c-typography c-typography__variant--h4" data-uid="662d1f4f01f6c">
Collection modifier
</h4>
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f01f94">
This utilizes the "sharpTop" and will therefore display differently.
</p>
</div>
</div>
<!-- collection__item.blade.php -->
<a class="c-collection__item c-collection__item--action" href="https://helsingborg.se" data-uid="662d1f4f02018">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f01ff0">
Linked item
</p>
</div>
</a>
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f02072">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f02044">
Unlinked item
</p>
</div>
</div>
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f020cc">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f0209d">
Unlinked item
</p>
</div>
</div>
</div> </div>
<div class="o-grid-4">
<!-- collection.blade.php -->
<div class="c-collection c-collection--unbox" data-uid="662d1f4f02101">
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f02183">
<div class="c-collection__content">
<!-- typography.blade.php original: h4 -->
<h4 class="c-typography c-typography__variant--h4" data-uid="662d1f4f0212c">
Collection modifier
</h4>
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f02154">
This utilizes the "unbox" and will therefore display differently.
</p>
</div>
</div>
<!-- collection__item.blade.php -->
<a class="c-collection__item c-collection__item--action" href="https://helsingborg.se" data-uid="662d1f4f021d6">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f021ae">
Linked item
</p>
</div>
</a>
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f02231">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f02202">
Unlinked item
</p>
</div>
</div>
<br />
<b>Warning</b>: The parameter <b>"link"</b> in the <b>collection__item</b> component should be of type <b>"string"</b> but was recieved as type <b>"boolean"</b>. in <b>/var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Register.php</b> on line <b>228</b><br />
<!-- collection__item.blade.php -->
<div class="c-collection__item" data-uid="662d1f4f0228a">
<div class="c-collection__content">
<!-- typography.blade.php original: p -->
<p class="c-typography c-typography__variant--p" data-uid="662d1f4f0225c">
Unlinked item
</p>
</div>
</div>
</div> </div>
</div><div class="o-grid">
@foreach(['bordered', 'compact', 'sharp', 'sharpBottom', 'sharpTop', 'unbox'] as $modifier)
<div class="o-grid-4">
@collection(
[
$modifier => true,
'list' => [
['title' => 'Collection modifier', 'content' => 'This utilizes the "' . $modifier . '" and will therefore display differently.'],
['content' => 'Linked item', 'link' => "https://helsingborg.se"],
'Unlinked item',
['content' => 'Unlinked item', 'link' => false],
],
]
)
@endcollection
</div>
@endforeach
</div>Blade component parameters
| Key | Default value | Type | Available values | Description |
| componentElement | div | string | - | The element type of list. |
| list | false | boolean | - | A array input list, contains 'content' and 'link' array keys. |
| bordered | false | boolean | - | Adds borders. |
| compact | false | boolean | - | If the list should be displayed in a compressed format. |
| sharp | false | boolean | - | Every single edge as sharp as hell, be careful! |
| sharpBottom | false | boolean | - | Makes the bottom really sharp. Yep. |
| sharpTop | false | boolean | - | Makes the top really sharp. Yep. |
| unbox | false | boolean | - | Removes the border. |
| id | string | - | The DOM id of the component. | |
| classList | [] | array | - | Array containing wrapping classes array |
| attributeList | [] | array | - | Array containing keys and values rendered as attributes |
| containerAware | false | boolean | true/false | Makes the component container aware. Appends modifiers --size--xs/sm/md/lg to the component. |