Versatile Banner

مكون السمة
,
263

حسنًا، في هذه الحالة قد تتمكن من إضافة شيء مثل التالي إلى أحد إعدادات “المحتوى” في لافتة متعددة الاستخدامات:

<div class="xmas-banner-image"></div>

ثم أضف بعض CSS إلى السمة الرئيسية الخاصة بك أو إلى مكون جديد. إليك مثال حيث يمكنك استبدال LINK_TO_MOBILE_IMAGE برابط الصورة الفعلي:

.mobile-view .xmas-banner-image {
  background-image: url("LINK_TO_MOBILE_IMAGE");
  height: 50px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.desktop-view .xmas-banner-image {
  background-image: url("LINK_TO_DESKTOP_IMAGE");
  height: 200px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

ستحتاج إلى تعديل CSS، ولكن نأمل أن يكون هذا بداية جيدة لك.

3 إعجابات