TPS/birzha
TPS
/
birzha
5
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

styles, animations, svg, password recov adaptive

This commit is contained in:
saparatayev 2022-04-15 19:18:28 +05:00
parent e19371c56b
commit ee02011702
12 changed files with 3099 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
plugins/rainlab/user/components/resetpassword/reset.htm
View File

@ -1,4 +1,4 @@
<div class="pass_change">
<div class="pass_change active">
<div class="pass_title">
{{ 'account.new_password'|_ }}
</div>

11
plugins/tps/birzha/components/categories/with_images.htm
View File

@ -1,6 +1,15 @@
<div class="categories">
{% for category in categories %}
<a href="{{ 'category'|page({ slug: category.slug }) }}" class="cat_item">
<a href="{{ 'category'|page({ slug: category.slug }) }}" class="cat_item wow fadeInUp"
data-wow-duration=".5s"
{% if loop.index < 10 %}
data-wow-delay=".{{ loop.index }}s"
{% else %}
data-wow-delay="{{ loop.index / 10 }}s"
{% endif %}
>
<div class="cat_photo">
<img src="{{ category.icon|media }}" alt="">
</div>

11
plugins/tps/birzha/components/myoffers/default.htm
View File

@ -54,7 +54,16 @@
<div class="product_box">
{% for offer in offers %}
<div class="product_item">
<div class="product_item wow bounceInUp"
data-wow-duration="1s"
{% if loop.index < 10 %}
data-wow-delay=".{{ loop.index }}s"
{% else %}
data-wow-delay="{{ loop.index / 10 }}s"
{% endif %}
>
<div class="item_head">
<div class="item_lot">
{{ 'page.prod_id'|_ }} №:

11
plugins/tps/birzha/components/offers/default.htm
View File

@ -2,7 +2,16 @@
<div class="product_box">
{% for offer in offers %}
<div class="product_item">
<div class="product_item wow bounceInUp"
data-wow-duration="1s"
{% if loop.index < 10 %}
data-wow-delay=".{{ loop.index }}s"
{% else %}
data-wow-delay="{{ loop.index / 10 }}s"
{% endif %}
>
<div class="item_head">
<div class="item_lot">
{{ 'page.prod_id'|_ }} №:

2829
themes/birzha/assets/css/animate.css vendored Normal file
View File

File diff suppressed because it is too large Load Diff

169
themes/birzha/assets/css/main.css
View File

@ -915,7 +915,11 @@ li {
background: #fff;
padding: 80px 60px;
/* display: none; */
display: none;
}
.pass_change.active {
display: block;
}
.pass_title {
@ -1045,6 +1049,49 @@ li {
-o-object-fit: contain;
}
.header_icon svg {
width: 100%;
height: 100%;
object-fit: contain;
-o-object-fit: contain;
}
.trend_line {
animation: trendUp 6.8s linear infinite;
animation-delay: .5s;
stroke-dasharray: 100;
pointer-events: none;
}
.trend_arrow {
animation: trendUp 6.8s linear infinite;
animation-delay: .5s;
stroke-dasharray: 120;
pointer-events: none;
}
@keyframes trendUp {
0% {
stroke-dashoffset: -31;
}
25% {
stroke-dashoffset: 31;
}
50% {
stroke-dashoffset: 31;
}
75% {
stroke-dashoffset: 31;
}
100% {
stroke-dashoffset: 31;
}
}
.head_text {
font-size: 14px;
font-weight: 400;
@ -1101,6 +1148,54 @@ li {
margin-right: 10px;
}
.header_img svg {
width: 100%;
height: 100%;
object-fit: contain;
-o-object-fit: contain;
}
#logo_top,
#logo_left,
#logo_right,
#logo_bottom {
animation: top 4s linear infinite;
}
#logo_right {
animation-delay: .3s;
}
#logo_bottom {
animation-delay: .5s;
}
#logo_left {
animation-delay: .8s;
}
@keyframes top {
0% {
fill: #aba17d;
}
25% {
fill: #003197;
}
50% {
fill: #0056ff;
}
75% {
fill: #003197;
}
100% {
fill: #aba17d;
}
}
.link {
margin: 30px 0 0 0;
display: flex;
@ -1645,6 +1740,26 @@ li {
height: 100%;
}
.slick-slide.slick-current .slider_item-img {
animation: slider_img 10s linear;
}
@keyframes slider_img {
0% {
transform: scale(2);
opacity: 0;
}
15% {
opacity: 1;
}
100% {
transform: scale(1);
}
}
.slider_item-img img {
width: 100%;
height: 100%;
@ -5187,6 +5302,31 @@ input::-webkit-calendar-picker-indicator {
padding: 0 50px;
}
.pass_mail,
.pass_change {
padding: 40px;
width: calc(100% - 50px);
max-width: 650px;
}
.pass_title {
font-size: 30px;
}
.pass_input input {
padding: 12px 20px;
font-size: 16px;
}
.pass_btn {
padding: 12px 0;
font-size: 16px;
}
.pass_input {
margin-bottom: 20px;
}
.acc_lang {
right: 50px;
top: 30px;
@ -6815,6 +6955,33 @@ input::-webkit-calendar-picker-indicator {
--text-20: 14px;
}
.pass_mail,
.pass_change {
padding: 30px;
}
.pass_title {
font-size: 24px;
}
.pass_input input {
padding: 12px 15px;
font-size: 14px;
}
.pass_input input::placeholder {
font-size: 14px;
}
.pass_btn {
padding: 12px 0;
font-size: 16px;
}
.pass_input {
margin-bottom: 20px;
}
.contact_title {
font-size: 18px;
}

6
themes/birzha/assets/images/svg/logo.svg Normal file
View File

@ -0,0 +1,6 @@
<svg id="Group_14" data-name="Group 14" xmlns="http://www.w3.org/2000/svg" width="100" height="100.001" viewBox="0 0 100 100.001">
<path id="Path_2130" data-name="Path 2130" d="M12613.869,7717.147l20.387-20.38v-9.209h9.2l3.371-3.372-16.276-16.277h-15.936v20.717l-14.645,14.635Z" transform="translate(-12599.973 -7653.263)" fill="#003197" fill-rule="evenodd" />
<path id="Path_2131" data-name="Path 2131" d="M14257.869,7055.751l16.273-16.274v-15.936h-20.728l-14.622-14.645-13.891,13.886,20.389,20.4h9.215v9.209Z" transform="translate(-14188.795 -7008.896)" fill="#aba17d" fill-rule="evenodd" />
<path id="Path_2132" data-name="Path 2132" d="M13308.307,9433.256l-20.394-20.391h-9.2v-9.215l-3.371-3.357-16.274,16.274V9432.5h20.706l14.647,14.644Z" transform="translate(-13244.428 -9347.147)" fill="#0056ff" fill-rule="evenodd" />
<path id="Path_2133" data-name="Path 2133" d="M15007.646,8683.345h15.934v-20.727l14.643-14.622-13.891-13.883-20.393,20.382v9.213h-9.207l-3.361,3.371Z" transform="translate(-14938.223 -8597.992)" fill="#003197" fill-rule="evenodd" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

8
themes/birzha/assets/images/svg/trend_up.svg
View File

@ -1,6 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24.828" height="14.828" viewBox="0 0 24.828 14.828">
<g id="trending-up" transform="translate(0.414 -4.586)">
<path id="Контур_121" data-name="Контур 121" d="M23,6l-9.5,9.5-5-5L1,18" fill="none" stroke="#01bf34" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Контур_122" data-name="Контур 122" d="M17,6h6v6" fill="none" stroke="#01bf34" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
</g>
<g id="trending-up" transform="translate(0.414 -4.586)">
<path id="Контур_121" data-name="Контур 121" d="M23,6l-9.5,9.5-5-5L1,18" fill="none" stroke="#01bf34" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" />
<path id="Контур_122" data-name="Контур 122" d="M17,6h6v6" fill="none" stroke="#01bf34" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" />
</g>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 527 B

After

Width:  |  Height:  |  Size: 523 B

8
themes/birzha/assets/images/svg/trending-down.svg
View File

@ -1,6 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24.828" height="14.828" viewBox="0 0 24.828 14.828">
<g id="trending-up" transform="translate(1.414 1.414)">
<path id="Контур_121" data-name="Контур 121" d="M23,18,13.5,8.5l-5,5L1,6" transform="translate(-1 -6)" fill="none" stroke="red" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Контур_122" data-name="Контур 122" d="M17,12h6V6" transform="translate(-1)" fill="none" stroke="red" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
</g>
<g id="trending-up" transform="translate(1.414 1.414)">
<path id="Контур_121" data-name="Контур 121" d="M23,18,13.5,8.5l-5,5L1,6" transform="translate(-1 -6)" fill="none" stroke="red" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" />
<path id="Контур_122" data-name="Контур 122" d="M17,12h6V6" transform="translate(-1)" fill="none" stroke="red" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" />
</g>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 575 B

After

Width:  |  Height:  |  Size: 571 B

3
themes/birzha/assets/js/wow.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

6
themes/birzha/layouts/default.htm
View File

@ -53,6 +53,7 @@ function onStart(){
<link rel="apple-touch-icon-precomposed" href="{{'assets/images/svg/fav_icon.svg'|theme}}">
<meta name="msapplication-TileImage" content="{{'assets/images/svg/fav_icon.svg'|theme}}">
{% styles %}
<link rel="stylesheet" href="{{'assets/css/animate.css'|theme}}">
<link rel="stylesheet" href="{{'assets/css/main.css'|theme}}">
<link rel="stylesheet" href="{{'assets/css/phone_box.css'|theme}}">
<!-- <link href="{{ ['assets/css/main.css']|theme }}" rel="stylesheet">-->
@ -109,6 +110,7 @@ function onStart(){
</script>
<!-- End hash script -->
<script src="{{'assets/js/wow.min.js'|theme}}"></script>
<script src="{{'assets/js/main.js'|theme}}"></script>
<script>
$('.iti__country').click(function (e) {
@ -132,5 +134,9 @@ function onStart(){
})
</script>
<script>
new WOW().init();
</script>
</body>
</html>

52
themes/birzha/partials/header.htm
View File

@ -31,7 +31,17 @@ code = "main-top"
<div class="info_block">
<div class="header_contact">
<div class="header_icon">
<img src="{{'assets/images/svg/trend_up.svg'|theme}}" alt="">
<svg xmlns="http://www.w3.org/2000/svg" width="24.828" height="14.828"
viewBox="0 0 24.828 14.828">
<g id="trend_up" transform="translate(0.414 -4.586)">
<path class="trend_line" data-name="Контур 121" d="M23,6l-9.5,9.5-5-5L1,18"
fill="none" stroke="#01bf34" stroke-linecap="round" stroke-linejoin="round"
stroke-width="2" />
<path class="trend_arrow" data-name="Контур 122" d="M17,6h6v6" fill="none"
stroke="#01bf34" stroke-linecap="round" stroke-linejoin="round"
stroke-width="2" />
</g>
</svg>
</div>
<div class="currency">
usd
@ -42,7 +52,17 @@ code = "main-top"
</div>
<div class="header_contact">
<div class="header_icon">
<img src="{{'assets/images/svg/trending-down.svg'|theme}}" alt="">
<svg xmlns="http://www.w3.org/2000/svg" width="24.828" height="14.828"
viewBox="0 0 24.828 14.828">
<g id="trending-up" transform="translate(1.414 1.414)">
<path class="trend_line" data-name="Контур 121" d="M23,18,13.5,8.5l-5,5L1,6"
transform="translate(-1 -6)" fill="none" stroke="red" stroke-linecap="round"
stroke-linejoin="round" stroke-width="2" />
<path class="trend_arrow" data-name="Контур 122" d="M17,12h6V6"
transform="translate(-1)" fill="none" stroke="red" stroke-linecap="round"
stroke-linejoin="round" stroke-width="2" />
</g>
</svg>
</div>
<div class="currency">
eur
@ -53,7 +73,17 @@ code = "main-top"
</div>
<div class="header_contact">
<div class="header_icon">
<img src="{{'assets/images/svg/trend_up.svg'|theme}}" alt="">
<svg xmlns="http://www.w3.org/2000/svg" width="24.828" height="14.828"
viewBox="0 0 24.828 14.828">
<g id="trend_up" transform="translate(0.414 -4.586)">
<path class="trend_line" data-name="Контур 121" d="M23,6l-9.5,9.5-5-5L1,18"
fill="none" stroke="#01bf34" stroke-linecap="round" stroke-linejoin="round"
stroke-width="2" />
<path class="trend_arrow" data-name="Контур 122" d="M17,6h6v6" fill="none"
stroke="#01bf34" stroke-linecap="round" stroke-linejoin="round"
stroke-width="2" />
</g>
</svg>
</div>
<div class="currency">
gbp
@ -110,7 +140,21 @@ code = "main-top"
<div class="header_wrap">
<a href="{{'index'|page}}" class="header_logo">
<div class="header_img">
<img src="{{'assets/images/big_logo.png'|theme}}" alt="logo">
<svg id="Group_14" data-name="Group 14" xmlns="http://www.w3.org/2000/svg" width="100"
height="100.001" viewBox="0 0 100 100.001">
<path id="logo_left" data-name="Path 2130"
d="M12613.869,7717.147l20.387-20.38v-9.209h9.2l3.371-3.372-16.276-16.277h-15.936v20.717l-14.645,14.635Z"
transform="translate(-12599.973 -7653.263)" fill="#003197" fill-rule="evenodd" />
<path id="logo_top" data-name="Path 2131"
d="M14257.869,7055.751l16.273-16.274v-15.936h-20.728l-14.622-14.645-13.891,13.886,20.389,20.4h9.215v9.209Z"
transform="translate(-14188.795 -7008.896)" fill="#aba17d" fill-rule="evenodd" />
<path id="logo_bottom" data-name="Path 2132"
d="M13308.307,9433.256l-20.394-20.391h-9.2v-9.215l-3.371-3.357-16.274,16.274V9432.5h20.706l14.647,14.644Z"
transform="translate(-13244.428 -9347.147)" fill="#0056ff" fill-rule="evenodd" />
<path id="logo_right" data-name="Path 2133"
d="M15007.646,8683.345h15.934v-20.727l14.643-14.622-13.891-13.883-20.393,20.382v9.213h-9.207l-3.361,3.371Z"
transform="translate(-14938.223 -8597.992)" fill="#003197" fill-rule="evenodd" />
</svg>
</div>
<div class="logo_text">
{{ site_name|raw }}