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 { .marquee {
&__outer {
position: relative;
}
width: 100%; width: 100%;
margin: 10px 0; margin: 10px 0;
overflow: hidden; overflow: hidden;
@ -13,20 +16,6 @@
line-height: 20px; line-height: 20px;
font-weight: 400; 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 { &__link {
position: absolute; position: absolute;

View File

@ -1190,6 +1190,9 @@ li {
height: 40px; height: 40px;
background: #00822c; background: #00822c;
} }
.marquee__outer {
position: relative;
}
.marquee__item { .marquee__item {
margin: 0 50px; margin: 0 50px;
} }
@ -1199,16 +1202,6 @@ li {
line-height: 20px; line-height: 20px;
font-weight: 400; 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 { .marquee__link {
position: absolute; position: absolute;
top: 0; top: 0;

View File

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