JSFiddle - React, Tailwind, and code Playground

by kougiland

HTML

<!DOCTYPE html>
<html>
<head>
    <title>Stilish CSS3 search box - demo</title>
    <style>
        
#sliding-tab-wrapper{
margin:0 auto;
top:0px;

width:100%;
height:100%;
background: rgba(204, 204, 204, 0.8);
z-index:9999999999999999;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
overflow:hidden;
position:relative;
}

#sliding-tab-wrapper:hover >#sliding-tab >.sliding-tab-picture, #sliding-tab-wrapper:hover >#sliding-tab >.sliding-tab-picture-info {
top:0px;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
-ms-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
}
#sliding-tab{
position: relative;
top: 0px;
left: 0px;
width: 1270px;
height: 100%;
margin: 0 auto;
background: whiteSmoke;
}
#sliding-tab ul.boxes{
float:left;
width:auto;
position:relative;
margin: 0px 10px 0px 0px;
}

#sliding-tab nav.slideMenu{
float:left;
width:200px;
min-height:100%;
background: rgb(92, 193, 233);
position:relative;
}
#sliding-tab nav.slideMenu:hover{
float:left;
width:200px;
min-height:100%;
background: rgb(92, 193, 233);
position:relative;
-webkit-background-size: 10px 10px;
-moz-background-size: 10px 10px;
-ms-background-size: 10px 10px;
-o-background-size: 10px 10px;
background-size: 10px 10px;
background-image: -webkit-gradient(linear, left top, right bottom, color-stop(.25, rgba(255, 255, 255, .15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .15)), color-stop(.75, rgba(255, 255, 255, .15)), color-stop(.75, transparent), to(transparent));
background-image: -webkit-linear-gradient(135deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
background-image: -moz-linear-gradient(135deg, rgba(255, 255, 255,...