Files
shop-ejs-expressjs/static/css/product.css
2022-03-29 14:38:40 +02:00

204 lines
3.7 KiB
CSS

.seller{
display: block;
height: 30px;
margin-top:10px;
padding: 0;
font-weight: bold;
font-size: 10pt;
}
.badge{
background-color: rgb(224, 224, 224);
color: black;
height: 15px;
padding-left: 3px;
padding-right: 3px;
font-size: 9pt;
display: block;
margin-top: -5;
border-radius: 5px;
padding-top: 0;
padding-bottom: 0;
margin-top: -10px;
border: 2px solid rgb(143, 143, 143);
float:left;
}
.order-button{
color: rgb(255, 255, 255);
font-weight: bold;
letter-spacing: 1.5px;
padding-left: 20px;
padding-right: 20px;
display:block;
float:left;
height: 35px;
border-radius: 5px;
border: 2px solid rgb(0, 99, 156);
background-color: rgb(0, 99, 156);
transition: 0.1s;
transition-timing-function: linear;
outline: none !important;
cursor:pointer;
margin-right: 30px;
margin-top: 10px;
}
/* Info header*/
.product-header{
height: 400px;
border-bottom: 2px solid rgb(104, 117, 151);;
}
#product-image
{
width: 40%;
height: 400px;
display: block;
float: left;
}
#product-image img
{
width: 90%;
display: block;
}
#product-info
{
width: 60%;
height: 400px;
display: block;
float: right;
}
/* Sections */
section
{
width: 100%;
display: block;
background-color: rgba(103, 187, 183, 0);
border-bottom: 2px solid rgb(104, 117, 151);
padding-top:20px;
padding-bottom: 10px;
}
section p, h2 {
padding-left: 30px;
padding-right: 30px;
}
#data
{
width: 100%;
height: 50px;
display: block;
background-color: rgb(124, 142, 212);
}
/* review */
.review-container{
margin-bottom: 20px;
}
.review-header{
padding-top:10px;
padding-bottom:10px;
background-color: rgb(124, 142, 212);
display:block;
width: 100%;
}
.review-content{
display: block;
width: 100%;
background-color: rgb(204, 214, 255);
padding-top:10px;
padding-bottom:20px;
}
.product-form{
display:block;
margin-left: auto;
margin-right: auto;
width: 500px;
}
.product-form label{
display:block;
margin-left: auto;
margin-right: auto;
width: 80%;
margin-top: 20px;
}
.product-form label p{
width: 100%;
display:block;
margin-left: auto;
margin-right: auto;
margin-bottom: 0px;
font-weight: bold;
letter-spacing: 1.5px;
}
.product-form label input{
width: 100%;
display:block;
margin-left: auto;
margin-right: auto;
height: 35px;
border-radius: 5px;
border: 2px solid rgb(0, 99, 156);
background-color: rgb(255, 255, 255);
transition: 0.1s;
transition-timing-function: linear;
outline: none !important;
}
/* Submit button with blue background horizontal center*/
.product-form input[type="submit"]{
color: rgb(255, 255, 255);
font-weight: bold;
letter-spacing: 1.5px;
width: 100%;
display:block;
margin-top: 20px;
margin-left: auto;
margin-right: auto;
height: 35px;
border-radius: 5px;
border: 2px solid rgb(0, 99, 156);
background-color: rgb(0, 99, 156);
transition: 0.1s;
transition-timing-function: linear;
outline: none !important;
cursor:pointer;
}
/* Hover */
.product-form label input:hover{
border: 2px solid rgb(1, 197, 246);
}
.product-form label input:focus{
border: 2px solid rgb(1, 197, 246);
box-shadow: 0 0 5px #719ece62;
}
.product-form input[type="submit"]:hover{
border: 2px solid rgb(7, 130, 200);
background-color: rgb(7, 130, 200);
}
.product-form textarea{
resize: vertical;
width: 100%;
display:block;
margin-left: auto;
margin-right: auto;
}