JSFiddle - React, Tailwind, and code Playground

HTML

<div class="cart_popup open_popup">
    <p>The item was added to your cart</p>
    <a href="#" class="cont_btn">Continue</a> <a href="#" class="addCart_btn">View Cart</a> 
    </div>

CSS

.cart_popup {
    margin:0px; padding:10px;
    background: #000000; opacity:0.5;
    color:#ffffff;
    width:210px; height:70px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    position:absolute;
    right:2px; top:48px;
    z-index:1000;
    display:none; 
}
.open_popup {
    display:block; 
}
.cart_popup:before {
    content:'';
    width:0px; height:0px; 
    position: absolute; left:194px; top:-18px;
    border:10px solid;
    border-color: transparent transparent rgba(0,0,0,1.0) transparent;
}
.cart_popup p {
    color:#ffffff;
    font: normal 14px "Helvetica Neue", Helvetica, Arial, sans-serif;
    padding:0px; margin:6px 0px 14px 0px;
    text-align:center;    
}
.cart_popup a.cont_btn {
    margin:0px 10px 0px 0px;
    text-decoration:none;
    width:auto; height:32px; padding:0 18px;
    background: #dcdcdc;
    display:block; float:left;
    text-align:center;
    background: #e2e2e2; 
    background: -moz-linear-gradient(top, #e2e2e2 1%, #aeaeae 100%); 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#e2e2e2), color-stop(100%,#aeaeae)); 
    background: -o-linear-gradient(top, #e2e2e2 1%,#aeaeae 100%); 
    -webkit-border-radius: 4px;
    border-radius: 4px; 
    color:#4d4d4d;
    font: bold 14px "Helvetica Neue", Helvetica, Arial, sans-serif;
    line-height:32px;
    opacity:1.0; 
}
.cart_popup a.addCart_btn {
    text-decoration:none;
    width:auto; height:32px; padding:0 18px;
    background: #dcdcdc;
    display:block; float:left;
    text-align:center;
    background: #80b82e;
    background: -moz-linear-gradient(top, #80b82e 0%, #598a12 84%, #6ba01d 100%); 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#80b82e), color-stop(84%,#598a12), color-stop(100%,#6ba01d)); 
    background: -o-linear-gradient(top, #80b82e 0%,#598a12 84%,#6ba01d 100%);
    -webkit-border-radius: 4px;
    border-radius: 4px; 
    color:#ffffff;
    font: bold 14px "Helvetica Neue", Helvetica,...