User I dont remenber anything js in every 5 days , how to get concepts very easily , so that , I'll always remember those concepts , when I need to do that ! Assistant You're not alone—JavaScript (and programming in general) is easy to forget if you're not using it regularly. To **retain JS […]
User import React , {useState} from 'react'; const Component=()=>{ const [items , setItems] = useState([]); const [input , setInput] = useState(""); function handleSubmit(e){ e.preventDefault(); setItems([…items , input]); setInput(""); } return toDo List e.target.value}/> Add {items.map((item , index) =>{ return {item} })} } export default Component; whats the issue in it? Assistant The issue is in […]
User > <script> </script> <script> document.addEventListener('DOMContentLoaded', function () { new Swiper('.industries-slider', { // slidesPerView: 4, spaceBetween: 30, navigation: { nextEl: '.industries-button-next', prevEl: '.industries-button-prev', }, loop: true, breakpoints: { 0: { slidesPerView: 1 }, 768: { slidesPerView: 2 }, 1200: { slidesPerView: 3 }, 1366: { slidesPerView: 4 } } }); }); </script> <style> .industries-slider-wrapper { […]
User make a widget in elementor where we have option to have this kind of design one big image and second which is the vector , which look like this ! and the design will be sam , most importantly make it fully responsive and best ! Assistant To create a fully responsive Elementor widget […]
User @media (max-width:767px){ .feedback-pagination::before, .feedback-pagination::after { content: ''; display: block; width: 50px !important; height: 2px !important; background-color: #fff; opacity: 0.5; } .feedback-pagination { position: absolute; top: unset !important; bottom: 70PX; transform: translateY(0); display: flex ; flex-direction: row; align-items: center; gap: 20PX; } } I want to set this properly ! horizontally in middle Assistant To […]
User <script> </script> <style> @media (max-width: 767px) { .mobile-steps-slider-wrapper { padding: 40px 0; } .step-item { position: relative; text-align: center; } .step-outer::before { content: ""; position: absolute; top: -8.5px; left: 50%; transform: translateX(-50%); background-color: #e9204f !important; } .step-outer { width: 218px; height: 224px; border-radius: 50%; position: relative; margin: auto; border: 4px solid #E9204F80; display: flex; […]
User jQuery(document).ready(function($) { if (window.innerWidth Assistant You can adjust the `items` setting using Owl Carousel's **responsive** configuration instead of a fixed `items` value. Here's the corrected version of your script: jQuery(document).ready(function($) { if (window.innerWidth <= 767) { $('#mobile-steps-carousel').owlCarousel({ loop: true, margin: 20, nav: false, dots: true, responsive: { 0: { items: 1 }, 500: { […]
User if we want to create this design in elemntor than what to do ? how to make it most responsive and all ! Assistant To recreate this **"About Us" section design** from your image in **Elementor** with **full responsiveness and clean layout**, follow these step-by-step instructions: — ### 🧱 Structure Setup in Elementor #### […]
User <script> </script> <style> @media (max-width: 767px) { .mobile-steps-slider-wrapper { padding: 20px 0; display: block; } .owl-carousel .item { text-align: center; position: relative; } .step-item { position: relative; width: 120px; height: 120px; margin: auto; } .step-circle { width: 100px; height: 100px; border-radius: 50%; background-color: #e9205a; border: 4px solid white; box-shadow: 0 0 0 5px rgba(233, […]
User <style> .feedback-slider-track { position: relative; height: auto; } .feedback-section .elementor-widget { position: unset !important; } .feedback-slide-group { display: flex; gap: 30px; position: absolute; width: 100%; top: 0; left: 0; opacity: 0; transition: opacity 0.5s ease-in-out; } .feedback-box { flex: 1; background: #fff; padding: 30px 30px 0 30px; border-radius: 5px; display: flex; flex-direction: column; justify-content: […]