product card hover transition applied and reduced hover padding by 33%

This commit is contained in:
Prashant Singh 2019-07-14 12:38:15 +05:30
parent caf165d06c
commit f8a4f1ba1c
4 changed files with 38 additions and 38 deletions

File diff suppressed because one or more lines are too long

View File

@ -1,4 +1,4 @@
{
"/js/shop.js": "/js/shop.js?id=ad1039174ce2c81c8805",
"/css/shop.css": "/css/shop.css?id=d48d50893f24c7ee8ddf"
"/css/shop.css": "/css/shop.css?id=4e097d2404eec6b747d7"
}

View File

@ -1,16 +1,16 @@
@import url("https://fonts.googleapis.com/css?family=Montserrat:400,500");
//shop variables
$font-color: #242424;
$border-color: #C7C7C7;
$brand-color: #0031F0;
$font-color-light: #A5A5A5;
$link-color: #2650EF;
$background-color: #F2F2F2;
$dark-background: #121212;
$border-color: #C7C7C7;
$font-dark: #242424;
$font-light: #A5A5A5;
$link-color: #2650EF;
$black: #121212;
$disc-price: #FF6472;
$radio-button: #FF6472;
$radio-button-disabled: rgba(255, 100, 113, 0.400);
$danger-color: #FF6472;
$danger-color: rgb(251, 57, 73);
$disc-price-pro: #A5A5A5;
$other-font-color: #5E5E5E;
$title-color: #8E8E8E;

View File

@ -10,7 +10,7 @@ body {
font-weight: 500;
max-width: 100%;
width: auto;
color: $font-color;
color: $font-dark;
font-size: 16px;
}
@ -195,7 +195,7 @@ input {
}
.regular-price {
color: $font-color-light;
color: $font-light;
text-decoration: line-through;
margin-right: 10px;
}
@ -217,7 +217,7 @@ input {
.account-head {
.account-heading {
font-size: 28px;
color: $font-color;
color: $font-dark;
text-transform: capitalize;
text-align: left;
}
@ -341,7 +341,7 @@ input {
.product-card {
position: relative;
border: 1px solid black;
.product-image {
max-height: 350px;
max-width: 280px;
@ -357,10 +357,10 @@ input {
.product-name {
margin-bottom: 14px;
width: 100%;
color: $font-color;
color: $font-dark;
a {
color: $font-color;
color: $font-dark;
}
}
@ -642,7 +642,7 @@ section.slider-block {
flex-direction: row;
justify-content: center;
align-items: center;
color: $font-color;
color: $font-dark;
height: 100%;
width: 100%;
top: 0px;
@ -682,7 +682,7 @@ section.slider-block {
}
.light-right-icon {
background-color: $font-color;
background-color: $font-dark;
height: 48px;
width: 48px;
max-height: 100%;
@ -873,7 +873,7 @@ section.slider-block {
padding: 0;
.dropdown-cart {
color: $font-color;
color: $font-dark;
}
.dropdown-cart > .dropdown-header {
@ -999,7 +999,7 @@ section.slider-block {
.nav a {
display:block;
color: $font-color;
color: $font-dark;
text-decoration: none;
padding: 0.8em 0.3em 0.8em 0.5em;
text-transform: capitalize;
@ -1272,7 +1272,7 @@ section.slider-block {
padding-top: 25px;
a {
color: $font-color;
color: $font-dark;
}
li {
@ -1299,7 +1299,7 @@ section.slider-block {
}
.btn-primary {
background-color: $font-color;
background-color: $font-dark;
margin-top: 8px;
border-radius: 0px;
text-align: center;
@ -1337,7 +1337,7 @@ section.slider-block {
width: 100%;
height: 70px;
font-size: 16px;
color: $font-color-light;
color: $font-light;
letter-spacing: -0.26px;
display: flex;
flex-direction: row;
@ -1364,7 +1364,7 @@ section.slider-block {
.filter-title {
border-bottom: 1px solid $border-color;
color: $font-color;
color: $font-dark;
padding: 10px 0;
}
@ -1484,7 +1484,7 @@ section.slider-block {
.page-info {
float: left;
color: $font-color;
color: $font-dark;
line-height: 45px;
span {
@ -1507,7 +1507,7 @@ section.slider-block {
background: $background-color;
border: 1px solid $border-color;
border-radius: 3px;
color: $font-color;
color: $font-dark;
padding: 10px;
}
@ -1600,7 +1600,7 @@ section.slider-block {
// product pages css starts here
section.product-detail {
color: $font-color;
color: $font-dark;
div.category-breadcrumbs {
display: inline;
@ -1665,7 +1665,7 @@ section.product-detail {
.overlay {
opacity: 0.3;
background: $font-color;
background: $font-dark;
width: 100%;
height: 18px;
position: absolute;
@ -1779,7 +1779,7 @@ section.product-detail {
.product-heading {
font-size: 24px;
color: $font-color;
color: $font-dark;
margin-bottom: 15px;
}
@ -1886,7 +1886,7 @@ section.product-detail {
}
input:checked + span, input:checked + img {
border: 1px solid $font-color;
border: 1px solid $font-dark;
}
input {
@ -2061,7 +2061,7 @@ section.product-detail {
/* cart pages and elements css begins here */
section.cart {
width: 100%;
color: $font-color;
color: $font-dark;
margin-bottom: 80px;
margin-top: 20px;
@ -2135,7 +2135,7 @@ section.cart {
font-weight: 600;
a {
color: $font-color;
color: $font-dark;
}
}
@ -2344,7 +2344,7 @@ section.cart {
margin-top: 20px;
margin-bottom: 20px;
font-size: 16px;
color: $font-color;
color: $font-dark;
.col-main {
width: 70%;
@ -2493,7 +2493,7 @@ section.cart {
.title {
width: 100px;
display: inline-block;
color: $font-color-light;
color: $font-light;
font-weight: 500;
margin-bottom: 10px;
}
@ -2616,7 +2616,7 @@ section.cart {
.title {
margin-bottom: 40px;
font-size: 18px;
color: $font-color;
color: $font-dark;
text-align: center;
position: relative;
@ -2662,7 +2662,7 @@ section.review {
}
.product-name a {
color: $font-color;
color: $font-dark;
}
.product-price {
@ -2688,7 +2688,7 @@ section.review {
width: 55%;
.heading {
color: $font-color;
color: $font-dark;
font-weight: 600;
.right {
@ -2873,7 +2873,7 @@ section.review {
margin-right: auto;
text-align: center;
font-size: 18px;
color: $font-color-light;
color: $font-light;
text-align: center;
}
@ -2956,7 +2956,7 @@ section.review {
.menubar {
border: 1px solid $border-color;
color: $font-color-light;
color: $font-light;
position: relative;
li {
@ -3023,7 +3023,7 @@ section.review {
//Account content inside a table
.account-table-content {
color: $font-color;
color: $font-dark;
margin-top: 1.4%;
table {