4.4.1 molecules.files.node File in node
The display of files in nodes is done with small cards (emphasis layer).
The cards must be placed in a grid .card-files__grid. The element consists of the file name (max 3 lines truncated), the file type and file size.
Markup: 03-molecules/file/file-node.twig
<ul class="card-files__grid">
<li class="card-file">
<a class="card-file__link" href="#" title="{{ 'Open file in a new window'|t }}" target="_blank">
<span class="card-file__title">Vestibulum id ligula porta felis euismod semper.pdf</span>
<span class="card-file__type">
<img class="card-file__icon" src="kss-assets/base/images/mime-icons/icon_1_pdf_x16.png" srcset="kss-assets/base/images/mime-icons/icon_1_pdf_x32.png 2x" alt="{{ node_icon }}" />
<span class="card-file__size">40.14 KB</span>
</span>
</a>
</li>
</ul>
Source:
03-molecules/file/file.scss, line 10