Preview:
 <div className="landing__container">
            <div className="landing__header__container">
                <div className="landing__header">
                    <h3 className="landing__header__discount">UP TO 15% DISCOUNT</h3>
                    <h1 className="landing__header__main">Checkout The Best Fashion Style</h1>
                    <Link to="/shop">
                        <Button variant='outlined' sx={[ {width: '190px', height: '50px', borderRadius: '20px' , fontWeight: '700', backgroundColor: 'none', borderColor: 'black', color: 'black' }, {'&:hover': {  backgroundColor: "black" , color: "#FFE26E", borderColor: 'black'}}]}>SHOP NOW</Button>
                    </Link>
                </div>
            </div>
            <div className="landing__image__container">
                <img className="landing__image" src={land} alt=""/>
            </div>
        </div>




.landing__container {
    width: 100%;
    min-height: 420px;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap-reverse;
    background-color: #ffe26e;
    position: relative;
}


.landing__header a {
    text-decoration: none;
    color: #000;
}

.landing__header__container {
    width: 40%;
    height: auto;
    min-height: 450px;
    min-width: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.landing__header {
    height: 100%;
    width: 90%;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
}

.landing__header__main {
    font-size: 4.0rem;
    font-weight: 800;
}

.landing__header__discount {
    font-size: 1.2rem;
}

.landing__button {
    width: 60%;
    cursor: pointer;
    transition: .3s;
}

.landing__image__container {
    width: 50%;
    height:100% ;
    display: flex;
    justify-content: center;
    align-items: center;
}

.landing__image {
    height: auto;
    width: auto;
    top: 0%;
    z-index: 10;
}


@media screen and (max-width: 850px) {
    .landing__image__container{
       display: none;
    }
}
downloadDownload PNG downloadDownload JPEG downloadDownload SVG

Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!

Click to optimize width for Twitter