diff --git a/plinth/templates/card.html b/plinth/templates/card.html index 7a3e5169d..6c810cd69 100644 --- a/plinth/templates/card.html +++ b/plinth/templates/card.html @@ -2,6 +2,7 @@ # SPDX-License-Identifier: AGPL-3.0-or-later {% endcomment %} +{% load i18n %} {% load static %}
@@ -18,6 +19,8 @@ {% endif %}
{{ item.name }}
-
{{ item.short_description|default:'' }}
+
+ {% for tag in item.app.info.tags|slice:":3" %}{% trans tag %}{% if not forloop.last %}・{% endif %}{% endfor %} +
diff --git a/static/themes/default/css/main.css b/static/themes/default/css/main.css index 2a6f17903..e20277a6c 100644 --- a/static/themes/default/css/main.css +++ b/static/themes/default/css/main.css @@ -596,8 +596,8 @@ footer { display: block; line-height: 1.42857143; text-align: center; - width: 10rem; - padding: 1rem; + width: 11.5rem; + padding: 1rem 0.5rem; border: none; border-radius: 0.5rem; transition: border .2s ease-in-out; @@ -619,10 +619,17 @@ footer { margin-bottom: 0; } -.card-description { +.card-tags { font-weight: 400; color: var(--bs-secondary); font-size: 0.875rem; + + /* Show ellipsis after 3 lines. */ + /* Standardized in CSS Overflow Module Level 4 */ + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 3; + overflow: hidden; } .card-icon span,