TheThomaas/cookbook
1
0
Fork 0
mirror of https://github.com/TheThomaas/my-online-cookbook.git synced 2026-01-11 04:11:47 +00:00
Code Issues Activity

Add abbr for emoji-only content

Browse source
This commit is contained in:
Maël Brunet 2021-05-22 13:15:05 +02:00
parent 8b7080bbdc
commit 7da4487ea9
3 changed files with 6 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/_includes/layouts/home.njk
View file

@ -32,7 +32,7 @@ bodyClass: c-home
<div class="c-card__info"> <div class="c-card__info">
<div> <div>
{% for tag in recipe.data.tags %} {% for tag in recipe.data.tags %}
{{ tag | onlyEmoji | safe }} <abbr class="c-card__tag-abbr" title="{{ tag | noEmoji }}">{{ tag | onlyEmoji }}</abbr>
{% endfor %} {% endfor %}
</div> </div>
{% if recipe.data.time %} {% if recipe.data.time %}

2
src/_includes/layouts/recipes-list.njk
View file

@ -19,7 +19,7 @@
<div class="c-card__info"> <div class="c-card__info">
<div> <div>
{% for tag in recipe.data.tags %} {% for tag in recipe.data.tags %}
{{ tag | onlyEmoji | safe }} <abbr class="c-card__tag-abbr" title="{{ tag | noEmoji }}">{{ tag | onlyEmoji }}</abbr>
{% endfor %} {% endfor %}
</div> </div>
{% if recipe.data.time %} {% if recipe.data.time %}

4
src/scss/components/_card.scss
View file

@ -46,6 +46,10 @@
background-color: var(--color-primary); background-color: var(--color-primary);
} }
.c-card__tag-abbr {
text-decoration: none;
}
.c-card__tag-first-letter { .c-card__tag-first-letter {
width: 22px; width: 22px;
height: 22px; height: 22px;