слайдер из баннеров

remotes/origin/feature/banners-slider-24-06-19
gzbender 7 years ago
parent d851d7cc8c
commit 43b71d7d87
  1. 14
      project/templates/blocks/banners.html
  2. 21
      web/src/sass/_common.sass

@ -13,13 +13,13 @@
data-banner="{{banner.id}}" style="display: none; data-banner="{{banner.id}}" style="display: none;
background: {{ banner.color|default:'white' }}; background: {{ banner.color|default:'white' }};
{% if banner.color2 %} {% if banner.color2 %}
background: -moz-linear-gradient(top, {{ banner.color }} 0%, {{ banner.color2 }} 100%); background: -moz-linear-gradient(-45deg, {{ banner.color }} 0%, {{ banner.color2 }} 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, {{ banner.color }}), color-stop(100%, {{ banner.color2 }})); background: -webkit-gradient(left top, right bottom, color-stop(0%, {{ banner.color }}), color-stop(100%, {{ banner.color2 }}));
background: -webkit-linear-gradient(top, {{ banner.color }} 0%, {{ banner.color2 }} 100%); background: -webkit-linear-gradient(-45deg, {{ banner.color }} 0%, {{ banner.color2 }} 100%);
background: -o-linear-gradient(top, {{ banner.color }} 0%, {{ banner.color2 }} 100%); background: -o-linear-gradient(-45deg, {{ banner.color }} 0%, {{ banner.color2 }} 100%);
background: -ms-linear-gradient(top, {{ banner.color }} 0%, {{ banner.color2 }} 100%); background: -ms-linear-gradient(-45deg, {{ banner.color }} 0%, {{ banner.color2 }} 100%);
background: linear-gradient(to bottom, {{ banner.color }} 0%, {{ banner.color2 }} 100%); background: linear-gradient(135deg, {{ banner.color }} 0%, {{ banner.color2 }} 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='{{ banner.color }}', endColorstr='{{ banner.color2 }}', GradientType=0 ); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='{{ banner.color }}', endColorstr='{{ banner.color2 }}', GradientType=1 );
{% endif %}"> {% endif %}">
<div class="banner__content"> <div class="banner__content">
<div class="banner__text-column"> <div class="banner__text-column">

@ -4377,18 +4377,21 @@ a
position: relative position: relative
&__content &__content
width: 1024px width: 1024px
padding: 70px 20px 0 padding-top: 70px
display: flex display: flex
margin: 0 auto margin: 0 auto
height: 240px height: 240px
+t +t
width: 100% width: calc(100% - 40px)
padding-top: 0
+m +m
width: 100% height: 190px
&__text &__text
font-size: 30px font-size: 30px
text-shadow: none text-shadow: none
color: black color: black
+t
font-size: 25px
+m +m
font-size: 16px font-size: 16px
width: auto width: auto
@ -4408,21 +4411,27 @@ a
font-family: 'ProximaNova-Bold' font-family: 'ProximaNova-Bold'
box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.05), 0 9px 24px 0 rgba(33, 74, 211, 0.1) box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.05), 0 9px 24px 0 rgba(33, 74, 211, 0.1)
+m +m
margin-top: 25px margin-top: 20px
font-size: 10px
padding: 10px 14px
&__link:hover &__link:hover
background: #ddd background: #ddd
&__image-column &__image-column
flex: 50% flex: 50%
text-align: center text-align: center
position: relative position: relative
padding-right: 20px
& img & img
position: absolute position: absolute
bottom: 0 bottom: 0
transform: translateX(-50%) transform: translateX(-50%)
left: 50% left: 50%
max-width: 100%
&__text-column &__text-column
flex: 50% flex: 50%
text-align: left text-align: left
padding-bottom: 20px
padding-right: 10px
&__countdown-title &__countdown-title
color: black color: black
font-size: 15px font-size: 15px
@ -4430,7 +4439,9 @@ a
+m +m
font-size: 15px font-size: 15px
&__countdown-wrap &__countdown-wrap
display: inline-block position: absolute
transform: translateX(-50%)
left: 50%
&__countdown &__countdown
display: flex display: flex
color: black color: black

Loading…
Cancel
Save