Ribbon
As an addition to the default theme colored ribbons there is a special variant for usage in the lidl plus context. You will find the Lidl Plus app icon in the image assets of the Lidl theme.
Simply add the css class .ribbon-item-lidl-plus to the ribbon item element like in the example below:
<ul class="ribbon ">
<li class="ribbon-item ribbon-item-lidl-plus">
<img src="../../.././_assets/images/logo_lidl-plus.svg" alt="Lidl Plus Logo" />
</li>
</ul>Possible combinations#
<div class="row">
<div class="col col-12 col-sm-6 p-1">
<a href="#" class="card product-tile-card " style="max-width:18rem">
<img is="rnd-img" src="../../../_assets/images/examples/Apfel-Karamell-Kuchen.jpg"
alt="placeholder" class="card-img-top" folder="../../../_assets/images/examples"
images="Apfel-Karamell-Kuchen.jpg,Apfel-Lebkuchentorte.jpg,Apfel-Quarkkuchen-mit-Sultaninen.jpg,Aprikosen-Frischkaesetorte.jpg,Aprikosengalette-mit-Rosmarin.jpg,Backen_CloseUp_v01_USAR.jpg,Backen_CloseUp_v14_USAR.jpg,Backen_Ostern_CloseUp_v02_USAR.jpg,Backen_Ostern_CloseUp_v07_USAR.jpg,Backen_Stibi_POS_WT1644_IFLA.jpg,Backen_Weihnachten_CloseUp_v02_USAR.jpg,Backen_Weihnachten_CloseUp_v14_USAR.jpg,Backen_Weihnachten_CloseUp_v16_USAR.jpg,Backen_Weihnachten_Collect_v01_USAR.jpg,Backen_Weihnachten_Recipe_Mini_Apel_Mini_Cinnamon_Cake_v02_USAR.jpg,Bellini-Torte.jpg,Birnen-Haselnuss-Streuselkuchen-mit-Cranberrys.jpg,Crepestorte.jpg,Erdbeer-Quark-Torte.jpg,Espresso-Schuettelkuchen.jpg,Espressotorte-mit-Himbeeren.jpg,Frische-Quarktorte-mit-Smoothie-Guss.jpg,Gefrorene-Brombeercharlotte.jpg,Himbeer-Eis-Guglhupf.jpg,Himbeer-Ombrecake.jpg,Japanischer-Cheesecake-mit-Erdbeeren.jpg,Johannisbeer-Pull-apart-Kuchen.jpg,Kaesekuchen-mit-Brombeeren.jpg,Kirsch-Punsch-Guglhupf.jpg,Kuhflecken-Kaesekuchen.jpg,Mangokuchen-mit-Mojito-Guss.jpg,Marzipan-Kirsch-Streifen.jpg,Orangentarte-mit-Kumquats.jpg,Pfirsichtarte-mit-Quarkcreme.jpg,Pflaumen-Pekan-Tarte.jpg,Ricottatarte-mit-Johannisbeeren.jpg,Rote-Beete-Schoko-Kuchen-mit-Schokoganache.jpg,Schoko-Espresso-Tarte.jpg,Schoko-Nougat-Guglhupf.jpg,Schokoladenkuchen-mit-Mohnsahne-und-Mango.jpg,Stollenrauten.jpg,Streusel-Kaesekuchen-mit-Blaubeeren.jpg,Walnuss-Blondies.jpg,veganer-Cheesecake-mit-Himbeeren.jpg" />
<ul class="ribbon ">
<li class="ribbon-item ribbon-item-lidl-plus">
<img src="../../.././_assets/images/logo_lidl-plus.svg" alt="Lidl Plus Logo" />
</li>
</ul>
<div class="card-body product-tile-card-body">
<h3 class="card-title product-tile-card-title">Cake</h3>
<p class="card-text product-tile-card-text">Very delicious and sweet piece of love.
</p>
<div class="text-right">
<div class="coupon">
<div class="coupon-content">100%</div>
<div class="coupon-text">only this week**</div>
</div>
</div>
</div>
</a>
</div>
<div class="col col-12 col-sm-6 p-1">
<a href="#" class="card product-tile-card " style="max-width:18rem">
<img is="rnd-img" src="../../../_assets/images/examples/Apfel-Karamell-Kuchen.jpg"
alt="placeholder" class="card-img-top" folder="../../../_assets/images/examples"
images="Apfel-Karamell-Kuchen.jpg,Apfel-Lebkuchentorte.jpg,Apfel-Quarkkuchen-mit-Sultaninen.jpg,Aprikosen-Frischkaesetorte.jpg,Aprikosengalette-mit-Rosmarin.jpg,Backen_CloseUp_v01_USAR.jpg,Backen_CloseUp_v14_USAR.jpg,Backen_Ostern_CloseUp_v02_USAR.jpg,Backen_Ostern_CloseUp_v07_USAR.jpg,Backen_Stibi_POS_WT1644_IFLA.jpg,Backen_Weihnachten_CloseUp_v02_USAR.jpg,Backen_Weihnachten_CloseUp_v14_USAR.jpg,Backen_Weihnachten_CloseUp_v16_USAR.jpg,Backen_Weihnachten_Collect_v01_USAR.jpg,Backen_Weihnachten_Recipe_Mini_Apel_Mini_Cinnamon_Cake_v02_USAR.jpg,Bellini-Torte.jpg,Birnen-Haselnuss-Streuselkuchen-mit-Cranberrys.jpg,Crepestorte.jpg,Erdbeer-Quark-Torte.jpg,Espresso-Schuettelkuchen.jpg,Espressotorte-mit-Himbeeren.jpg,Frische-Quarktorte-mit-Smoothie-Guss.jpg,Gefrorene-Brombeercharlotte.jpg,Himbeer-Eis-Guglhupf.jpg,Himbeer-Ombrecake.jpg,Japanischer-Cheesecake-mit-Erdbeeren.jpg,Johannisbeer-Pull-apart-Kuchen.jpg,Kaesekuchen-mit-Brombeeren.jpg,Kirsch-Punsch-Guglhupf.jpg,Kuhflecken-Kaesekuchen.jpg,Mangokuchen-mit-Mojito-Guss.jpg,Marzipan-Kirsch-Streifen.jpg,Orangentarte-mit-Kumquats.jpg,Pfirsichtarte-mit-Quarkcreme.jpg,Pflaumen-Pekan-Tarte.jpg,Ricottatarte-mit-Johannisbeeren.jpg,Rote-Beete-Schoko-Kuchen-mit-Schokoganache.jpg,Schoko-Espresso-Tarte.jpg,Schoko-Nougat-Guglhupf.jpg,Schokoladenkuchen-mit-Mohnsahne-und-Mango.jpg,Stollenrauten.jpg,Streusel-Kaesekuchen-mit-Blaubeeren.jpg,Walnuss-Blondies.jpg,veganer-Cheesecake-mit-Himbeeren.jpg" />
<ul class="ribbon ">
<li class="ribbon-item ribbon-item-lidl-plus">
<img src="../../.././_assets/images/logo_lidl-plus.svg" alt="Lidl Plus Logo" />
</li>
</ul>
<div class="card-body product-tile-card-body">
<h3 class="card-title product-tile-card-title">Cake</h3>
<p class="card-text product-tile-card-text">Very delicious and sweet piece of love.
</p>
<div class="text-right">
<div class="pricebox pricebox-lidl-plus">
<div class="pricebox-wrapper">
<div class="pricebox-highlight">Mit Coupon: -XX%</div>
<div class="pricebox-container">
<div class="pricebox-discount-wrapper"><span
class="pricebox-recommended-retail-price">
<span class="sr-only">old price</span>XX.XX*</span>
</div>
<div class="pricebox-price-wrapper" aria-label="XX.XX EUR **">
<span class="pricebox-price">XX.XX</span>
<div class="pricebox-suffix">
<span class="pricebox-asterisk">**</span>
<span class="pricebox-currency">EUR</span>
</div>
</div>
</div>
</div>
<div class="pricebox-basic-quantity">je X,XXl, 1l = XX.XX €</div>
</div>
</div>
</div>
</a>
</div>
</div>