Ajuste no mobile da secção dos preços.
This commit is contained in:
parent
e61951ffbb
commit
2064e11bcc
|
@ -108,7 +108,7 @@
|
||||||
|
|
||||||
<section id="precos">
|
<section id="precos">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="col-lg-10 col-lg-offset-1">
|
<div class="col-lg-10 col-lg-offset-1 col-sm-12 col-xs-12">
|
||||||
<div class="pre-h1">ENEI 2019</div>
|
<div class="pre-h1">ENEI 2019</div>
|
||||||
<h1>Preços</h1>
|
<h1>Preços</h1>
|
||||||
<hr>
|
<hr>
|
||||||
|
|
|
@ -730,6 +730,12 @@ hr::after {
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1024px) {
|
||||||
|
#precos {
|
||||||
|
padding-bottom: 100px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
#precos hr {
|
#precos hr {
|
||||||
display: table;
|
display: table;
|
||||||
margin: 0 auto 60px;
|
margin: 0 auto 60px;
|
||||||
|
@ -766,6 +772,24 @@ hr::after {
|
||||||
-webkit-transition: transform 150ms ease-out;
|
-webkit-transition: transform 150ms ease-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1024px) {
|
||||||
|
#precos .price-block {
|
||||||
|
max-width: 210px;
|
||||||
|
padding: 0 15px 40px;
|
||||||
|
margin: 0 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 769px) {
|
||||||
|
#precos .price-block {
|
||||||
|
max-width: 350px;
|
||||||
|
min-height: inherit;
|
||||||
|
padding: 0 15px 40px;
|
||||||
|
margin: 0 auto 35px;
|
||||||
|
display: table;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
#precos .price-block:hover {
|
#precos .price-block:hover {
|
||||||
transform: scale(1.05);
|
transform: scale(1.05);
|
||||||
-webkit-transform: scale(1.05);
|
-webkit-transform: scale(1.05);
|
||||||
|
@ -792,6 +816,12 @@ hr::after {
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (max-width: 769px) {
|
||||||
|
#precos .price-block .price {
|
||||||
|
margin: 20px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
#precos .price-block .price span {
|
#precos .price-block .price span {
|
||||||
font-size: 30px;
|
font-size: 30px;
|
||||||
vertical-align: super;
|
vertical-align: super;
|
||||||
|
@ -845,6 +875,13 @@ hr::after {
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (max-width: 769px) {
|
||||||
|
#precos .price-block .buy-button {
|
||||||
|
display: inline-block;
|
||||||
|
margin-top: 30px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
#precos .ps {
|
#precos .ps {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 20px;
|
right: 20px;
|
||||||
|
|
File diff suppressed because one or more lines are too long
|
@ -605,6 +605,9 @@ hr {
|
||||||
#precos {
|
#precos {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
@include portable {
|
||||||
|
padding-bottom: 100px;
|
||||||
|
}
|
||||||
hr {
|
hr {
|
||||||
display: table;
|
display: table;
|
||||||
margin: 0 auto 60px;
|
margin: 0 auto 60px;
|
||||||
|
@ -627,6 +630,18 @@ hr {
|
||||||
margin: 0 15px;
|
margin: 0 15px;
|
||||||
transition: transform $transition-time ease-out;
|
transition: transform $transition-time ease-out;
|
||||||
-webkit-transition: transform $transition-time ease-out;
|
-webkit-transition: transform $transition-time ease-out;
|
||||||
|
@include portable {
|
||||||
|
max-width: 210px;
|
||||||
|
padding: 0 15px 40px;
|
||||||
|
margin: 0 10px;
|
||||||
|
}
|
||||||
|
@include mobile {
|
||||||
|
max-width: 350px;
|
||||||
|
min-height: inherit;
|
||||||
|
padding: 0 15px 40px;
|
||||||
|
margin: 0 auto 35px;
|
||||||
|
display: table;
|
||||||
|
}
|
||||||
&:hover {
|
&:hover {
|
||||||
transform: scale(1.05);
|
transform: scale(1.05);
|
||||||
-webkit-transform: scale(1.05);
|
-webkit-transform: scale(1.05);
|
||||||
|
@ -645,6 +660,9 @@ hr {
|
||||||
.price {
|
.price {
|
||||||
@include font($bai-font, 58px, 58px, $dark-grey);
|
@include font($bai-font, 58px, 58px, $dark-grey);
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
|
@include mobile{
|
||||||
|
margin: 20px 0;
|
||||||
|
}
|
||||||
span {
|
span {
|
||||||
font-size: 30px;
|
font-size: 30px;
|
||||||
vertical-align: super;
|
vertical-align: super;
|
||||||
|
@ -689,6 +707,10 @@ hr {
|
||||||
background-color: $red;
|
background-color: $red;
|
||||||
color: $white;
|
color: $white;
|
||||||
}
|
}
|
||||||
|
@include mobile{
|
||||||
|
display: inline-block;
|
||||||
|
margin-top: 30px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.ps {
|
.ps {
|
||||||
|
@ -877,8 +899,8 @@ footer {
|
||||||
color $transition-time ease,
|
color $transition-time ease,
|
||||||
background-color $transition-time ease;
|
background-color $transition-time ease;
|
||||||
margin-right: -1px;
|
margin-right: -1px;
|
||||||
@include portable{
|
@include portable {
|
||||||
padding:15px;
|
padding: 15px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue