klmp200/Sith
1
0
Fork 0
mirror of https://github.com/ae-utbm/sith.git synced 2025-07-11 12:29:24 +00:00
Code Issues Packages Projects Releases Wiki Activity

create a card css component

Browse Source
This commit is contained in:
imperosol
2024-12-14 01:45:54 +01:00
parent aab093200b
commit 7af745087e
7 changed files with 123 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
eboutic/templates/eboutic/eboutic_main.jinja
View File

@ -15,7 +15,8 @@
{% endblock %}
{% block additional_css %}
<link rel="stylesheet" href="{{ static('eboutic/css/eboutic.css') }}">
<link rel="stylesheet" href="{{ static("eboutic/css/eboutic.css") }}">
<link rel="stylesheet" href="{{ static("core/components/card.scss") }}">
{% endblock %}
{% block content %}
@ -104,18 +105,21 @@
{% for p in items %}
<button
id="{{ p.id }}"
class="product-button"
class="card product-button clickable shadow"
:class="{selected: items.some((i) => i.id === {{ p.id }})}"
@click='addFromCatalog({{ p.id }}, {{ p.name|tojson }}, {{ p.selling_price }})'
>
{% if p.icon %}
<img class="product-image" src="{{ p.icon.url }}"
alt="image de {{ p.name }}">
<img
class="card-image"
src="{{ p.icon.url }}"
alt="image de {{ p.name }}"
>
{% else %}
<i class="fa-regular fa-image fa-2x product-image"></i>
<i class="fa-regular fa-image fa-2x card-image"></i>
{% endif %}
<div class="product-description">
<h4>{{ p.name }}</h4>
<div class="card-content">
<h4 class="card-title">{{ p.name }}</h4>
<p>{{ p.selling_price }} €</p>
</div>
</button>