This commit is contained in:
= 2021-05-24 14:55:15 +05:00
parent 9de660f204
commit bc7dda90a4
3 changed files with 35 additions and 58 deletions

View File

@ -1,4 +1,7 @@
.marquee {
&__outer {
position: relative;
}
width: 100%;
margin: 10px 0;
overflow: hidden;
@ -13,20 +16,6 @@
line-height: 20px;
font-weight: 400;
}
}
&::after {
position: absolute;
right: 0;
top: 0;
width: 260px;
height: 100%;
content: "";
background: rgb(255, 255, 255);
background: linear-gradient(
90deg,
rgba(255, 255, 255, 0) 0%,
rgba(255, 255, 255, 1) 100%
);
}
&__link {
position: absolute;

View File

@ -1190,6 +1190,9 @@ li {
height: 40px;
background: #00822c;
}
.marquee__outer {
position: relative;
}
.marquee__item {
margin: 0 50px;
}
@ -1199,16 +1202,6 @@ li {
line-height: 20px;
font-weight: 400;
}
.marquee::after {
position: absolute;
right: 0;
top: 0;
width: 260px;
height: 100%;
content: "";
background: white;
background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, white 100%);
}
.marquee__link {
position: absolute;
top: 0;

View File

@ -8,12 +8,16 @@ sortOrder = "published_at desc"
categoryPage = "category"
postPage = "post"
==
<div class="marquee">
<div class="marquee__outer">
<a href="#" class="marquee__link">
Главное
</a>
<div>{% for post in posts %} <span>{{post.title}}</span> {% endfor %}</div>
<div class="marquee">
<div>{% for post in posts %} <span>{{post.title}}</span> {% endfor %}</div>
</div>
</div>
<div class="swiper-container mySwiper">
<div class="swiper-wrapper">
@ -25,19 +29,19 @@ postPage = "post"
-o-background-size: cover;">
<div class="swiper-slide-content">
<div class="swiper-slide-content-date">
<span>
{{post.published_at|date('H:i')}}
</span>
<span>
{{post.published_at|date('H:i')}}
</span>
<svg xmlns="http://www.w3.org/2000/svg">
<path id="Polygon_1" data-name="Polygon 1" d="M2,0,4,2,2,4,0,2Z"
fill="#a2a2a2" />
<path id="Polygon_1" data-name="Polygon 1" d="M2,0,4,2,2,4,0,2Z" fill="#a2a2a2" />
</svg>
<span>
{{post.published_at|date('d.m.Y')}}
</span>
{{post.published_at|date('d.m.Y')}}
</span>
</div>
<div class="swiper-slide-content-footer">
<a href="{{'post'|page({id:post.id,slug:post.slug})}}" class="swiper-slide-content-link">{{post.title}}</a>
<a href="{{'post'|page({id:post.id,slug:post.slug})}}"
class="swiper-slide-content-link">{{post.title}}</a>
{% if post.categories.count()>0%}
<div class="swiper-slide-content-category">
{{post.categories.implode('name', ', ')}}
@ -50,37 +54,29 @@ postPage = "post"
{% endfor %}
</div>
<div class="p3">
<svg xmlns="http://www.w3.org/2000/svg" width="9.414" height="16.828"
viewBox="0 0 9.414 16.828">
<path id="Path_6497" data-name="Path 6497" d="M19,5l-7,7,7,7"
transform="translate(-11 -3.586)" fill="none" stroke="#fff" stroke-linecap="round"
stroke-linejoin="round" stroke-width="2" />
<svg xmlns="http://www.w3.org/2000/svg" width="9.414" height="16.828" viewBox="0 0 9.414 16.828">
<path id="Path_6497" data-name="Path 6497" d="M19,5l-7,7,7,7" transform="translate(-11 -3.586)" fill="none"
stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" />
</svg>
</div>
<div class="n3">
<svg xmlns="http://www.w3.org/2000/svg" width="9.414" height="16.828"
viewBox="0 0 9.414 16.828">
<path id="Path_6496" data-name="Path 6496" d="M12,5l7,7-7,7"
transform="translate(-10.586 -3.586)" fill="none" stroke="#fff" stroke-linecap="round"
stroke-linejoin="round" stroke-width="2" />
<svg xmlns="http://www.w3.org/2000/svg" width="9.414" height="16.828" viewBox="0 0 9.414 16.828">
<path id="Path_6496" data-name="Path 6496" d="M12,5l7,7-7,7" transform="translate(-10.586 -3.586)"
fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" />
</svg>
</div>
</div>
<div class="newsSlider__outer">
<div class="p2">
<svg xmlns="http://www.w3.org/2000/svg" width="9.414" height="16.828"
viewBox="0 0 9.414 16.828">
<path id="Path_6497" data-name="Path 6497" d="M19,5l-7,7,7,7"
transform="translate(-11 -3.586)" fill="none" stroke="#fff" stroke-linecap="round"
stroke-linejoin="round" stroke-width="2" />
<svg xmlns="http://www.w3.org/2000/svg" width="9.414" height="16.828" viewBox="0 0 9.414 16.828">
<path id="Path_6497" data-name="Path 6497" d="M19,5l-7,7,7,7" transform="translate(-11 -3.586)" fill="none"
stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" />
</svg>
</div>
<div class="n2">
<svg xmlns="http://www.w3.org/2000/svg" width="9.414" height="16.828"
viewBox="0 0 9.414 16.828">
<path id="Path_6496" data-name="Path 6496" d="M12,5l7,7-7,7"
transform="translate(-10.586 -3.586)" fill="none" stroke="#fff" stroke-linecap="round"
stroke-linejoin="round" stroke-width="2" />
<svg xmlns="http://www.w3.org/2000/svg" width="9.414" height="16.828" viewBox="0 0 9.414 16.828">
<path id="Path_6496" data-name="Path 6496" d="M12,5l7,7-7,7" transform="translate(-10.586 -3.586)"
fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" />
</svg>
</div>
<div class="newsSlider">
@ -89,10 +85,9 @@ postPage = "post"
<img src="{{post.featured_image|media_cdn}}" alt="{{post.title}}">
<div class="newsSlider__item-content">
<div class="newsSlider__item-content-date">
<span>{{post.published_at|date('H:i')}}</span>
<span>{{post.published_at|date('H:i')}}</span>
<svg xmlns="http://www.w3.org/2000/svg">
<path id="Polygon_1" data-name="Polygon 1" d="M2,0,4,2,2,4,0,2Z"
fill="#a2a2a2" />
<path id="Polygon_1" data-name="Polygon 1" d="M2,0,4,2,2,4,0,2Z" fill="#a2a2a2" />
</svg>
<span>{{post.published_at|date('d.m.Y')}}</span>
</div>
@ -103,4 +98,4 @@ postPage = "post"
</div>
{% endfor %}
</div>
</div>
</div>