Dxpro Sha

السلام عليكم ورحمة الله وبركاته احتاج تعديل سلايدر الصور المتحركه للموقع الخاص بي باستخدام اطار عمل Tailwind CSS السلايدر اللي موجود عندي على كامل عرض الشاشة بالشكل هذا كما بالصوره احتاج تعديله ليكون بالشكل كما بالسلايدر هذا كود tailwind المستخدم <section class="s-block home-slider s-block--hero-slider s-block--full-bg wide-placeholder"> <salla-slider id="main-slider-{{ position }}" class="home-slider main-slider w-11/12 mx-auto rounded-lg" auto-play loop type="fullwidth"> <div slot="items"> {% for slide in component.slides %} <div class="swiper-lazy-wrap w-4/5 min-h-[300px] lg:min-h-[528px] bg-dark"> <div data-background="{{ slide.image }}" class="swiper-lazy"></div> <div class="flex-center container pb-16 sm:pb-0 home-slider__content relative h-full"> <div class=" w-4/6 text-center md:w-7/12 lg:w-5/12 text-white"> <h3 data-swiper-parallax="-500" class="lg:text-title-size font-bold leading-tight mb-4">{{ slide.title }}</h3> <p data-swiper-parallax="-300" class="line-clamp-2 description">{{ slide.description }}</p> </div> </div> </div> {% endfor %} </div> </salla-slider> </section>