appscms-tools-theme 4.6.3 → 4.6.4
Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 4aea7884a301df8c0e6e3ff5664fb2c61b16e44394eb6a74d47a0372f621e7e8
|
|
4
|
+
data.tar.gz: 7c62873b75bbcfef31aca661a1a59f44e21dd8da0524acfc61a2fa87faa5a01e
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: c4cc84e13da968b2bd5b69605468c937e83bf81671aa60a09e5d7207fffe7f010c1672154175bc570471f3ce123c1489e494268987ba0e585d7bab74d2aeac3c
|
|
7
|
+
data.tar.gz: b182143b4db87882ac62273f4a99365decb5d25aee59f484ddbf5d539e4356f720968136e2ddfe641bd39c675c3e67f1002246b5529f2337c8c0a402134b1e94
|
|
@@ -108,7 +108,20 @@
|
|
|
108
108
|
"jscdns": [
|
|
109
109
|
"<script crossorigin='anonymous' src=\"/assets/js/googledrive.js\"></script>"
|
|
110
110
|
],
|
|
111
|
-
"infographics": [
|
|
111
|
+
"infographics": [
|
|
112
|
+
{
|
|
113
|
+
"image": "/assets/images/1.webp",
|
|
114
|
+
"description": "How to set alarm on wake me up at 4:45 am tool"
|
|
115
|
+
},
|
|
116
|
+
{
|
|
117
|
+
"image": "/assets/images/2.webp",
|
|
118
|
+
"description": "5 benefits of using wake me up at 4:45 am tool"
|
|
119
|
+
},
|
|
120
|
+
{
|
|
121
|
+
"image": "/assets/images/3.webp",
|
|
122
|
+
"description": "Additional features of wake me up at 4:45 am tool"
|
|
123
|
+
}
|
|
124
|
+
],
|
|
112
125
|
"posts": [
|
|
113
126
|
{
|
|
114
127
|
"tags": ["ok"],
|
|
@@ -18,25 +18,46 @@
|
|
|
18
18
|
margin-top: 20px;
|
|
19
19
|
}
|
|
20
20
|
.modal1-body img {
|
|
21
|
-
width: 100%;
|
|
22
21
|
height: auto;
|
|
23
22
|
}
|
|
24
23
|
.close1 {
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
}
|
|
32
|
-
.close1:hover {
|
|
33
|
-
|
|
34
|
-
}
|
|
24
|
+
position: absolute;
|
|
25
|
+
top: 10px;
|
|
26
|
+
right: 10px;
|
|
27
|
+
font-size: 24px;
|
|
28
|
+
color: #fff;
|
|
29
|
+
cursor: pointer;
|
|
30
|
+
}
|
|
31
|
+
.close1:hover {
|
|
32
|
+
color: #ccc;
|
|
33
|
+
}
|
|
35
34
|
</style>
|
|
36
35
|
<div class="inforgraphics_section">
|
|
37
36
|
<h3 class="text-center w-100 mb-5"><b>Other useful information</b></h3>
|
|
38
37
|
<div class="wrapper">
|
|
39
|
-
<
|
|
38
|
+
<svg
|
|
39
|
+
id="left"
|
|
40
|
+
viewBox="0 0 24 24"
|
|
41
|
+
fill="none"
|
|
42
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
43
|
+
>
|
|
44
|
+
<g id="SVGRepo_bgCarrier" stroke-width="0"></g>
|
|
45
|
+
<g
|
|
46
|
+
id="SVGRepo_tracerCarrier"
|
|
47
|
+
stroke-linecap="round"
|
|
48
|
+
stroke-linejoin="round"
|
|
49
|
+
></g>
|
|
50
|
+
<g id="SVGRepo_iconCarrier">
|
|
51
|
+
<path
|
|
52
|
+
d="M15 19.9201L8.47997 13.4001C7.70997 12.6301 7.70997 11.3701 8.47997 10.6001L15 4.08008"
|
|
53
|
+
stroke="#292D32"
|
|
54
|
+
stroke-width="1.5"
|
|
55
|
+
stroke-miterlimit="10"
|
|
56
|
+
stroke-linecap="round"
|
|
57
|
+
stroke-linejoin="round"
|
|
58
|
+
></path>
|
|
59
|
+
</g>
|
|
60
|
+
</svg>
|
|
40
61
|
<div class="carousel">
|
|
41
62
|
<div class="carousel-inner">
|
|
42
63
|
{%- if pageData.infographics -%} {% for item in pageData.infographics %}
|
|
@@ -54,44 +75,65 @@
|
|
|
54
75
|
{% endfor %} {%- endif -%}
|
|
55
76
|
</div>
|
|
56
77
|
</div>
|
|
57
|
-
<
|
|
78
|
+
<svg
|
|
79
|
+
id="right"
|
|
80
|
+
viewBox="0 0 24 24"
|
|
81
|
+
fill="none"
|
|
82
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
83
|
+
>
|
|
84
|
+
<g id="SVGRepo_bgCarrier" stroke-width="0"></g>
|
|
85
|
+
<g
|
|
86
|
+
id="SVGRepo_tracerCarrier"
|
|
87
|
+
stroke-linecap="round"
|
|
88
|
+
stroke-linejoin="round"
|
|
89
|
+
></g>
|
|
90
|
+
<g id="SVGRepo_iconCarrier">
|
|
91
|
+
<path
|
|
92
|
+
d="M9 5L14.15 10C14.4237 10.2563 14.6419 10.5659 14.791 10.9099C14.9402 11.2539 15.0171 11.625 15.0171 12C15.0171 12.375 14.9402 12.7458 14.791 13.0898C14.6419 13.4339 14.4237 13.7437 14.15 14L9 19"
|
|
93
|
+
stroke="#000000"
|
|
94
|
+
stroke-width="1.5"
|
|
95
|
+
stroke-linecap="round"
|
|
96
|
+
stroke-linejoin="round"
|
|
97
|
+
></path>
|
|
98
|
+
</g>
|
|
99
|
+
</svg>
|
|
58
100
|
</div>
|
|
59
101
|
</div>
|
|
60
102
|
<div id="imageModal1" class="modal1" onclick="closeModal1()">
|
|
61
103
|
<span class="close1" onclick="closeModal1()">×</span>
|
|
62
104
|
<div class="modal1-content1">
|
|
63
105
|
<div class="modal1-body">
|
|
64
|
-
<img id="modal1Image" src="" alt="Image"
|
|
106
|
+
<img id="modal1Image" src="" alt="Image" />
|
|
65
107
|
</div>
|
|
66
108
|
</div>
|
|
67
109
|
</div>
|
|
68
110
|
<script>
|
|
69
|
-
|
|
70
|
-
var modal1 = document.getElementById(
|
|
71
|
-
var modal1Img = document.getElementById(
|
|
111
|
+
function openModal1(imageSrc) {
|
|
112
|
+
var modal1 = document.getElementById("imageModal1");
|
|
113
|
+
var modal1Img = document.getElementById("modal1Image");
|
|
72
114
|
modal1.style.display = "block";
|
|
73
115
|
modal1Img.src = imageSrc;
|
|
74
116
|
}
|
|
75
117
|
function closeModal1() {
|
|
76
|
-
var modal1 = document.getElementById(
|
|
118
|
+
var modal1 = document.getElementById("imageModal1");
|
|
77
119
|
modal1.style.display = "none";
|
|
78
120
|
}
|
|
79
|
-
document.addEventListener(
|
|
80
|
-
var modal1 = document.getElementById(
|
|
121
|
+
document.addEventListener("click", function (event) {
|
|
122
|
+
var modal1 = document.getElementById("imageModal1");
|
|
81
123
|
if (event.target === modal1) {
|
|
82
124
|
closeModal1();
|
|
83
125
|
}
|
|
84
126
|
});
|
|
85
127
|
const carousel = document.querySelector(".carousel-inner"),
|
|
86
128
|
firstImg = carousel.querySelectorAll("img")[0],
|
|
87
|
-
arrowIcons = document.querySelectorAll(".wrapper
|
|
129
|
+
arrowIcons = document.querySelectorAll(".wrapper svg");
|
|
88
130
|
const numImages = carousel.querySelectorAll("img").length;
|
|
89
131
|
const isMobile = window.matchMedia("(max-width: 767px)").matches; // Check if screen width is less than or equal to 767px
|
|
90
132
|
if (numImages > 3) {
|
|
91
133
|
arrowIcons[1].style.display = "block";
|
|
92
134
|
} else {
|
|
93
|
-
arrowIcons[0].style.display = "none";
|
|
94
|
-
arrowIcons[1].style.display = "none";
|
|
135
|
+
// arrowIcons[0].style.display = "none";
|
|
136
|
+
// arrowIcons[1].style.display = "none";
|
|
95
137
|
}
|
|
96
138
|
let isDragStart = false,
|
|
97
139
|
isDragging = false,
|
|
@@ -106,7 +148,7 @@
|
|
|
106
148
|
};
|
|
107
149
|
arrowIcons.forEach((icon) => {
|
|
108
150
|
icon.addEventListener("click", () => {
|
|
109
|
-
let firstImgWidth = firstImg.clientWidth +
|
|
151
|
+
let firstImgWidth = firstImg.clientWidth + 250;
|
|
110
152
|
const scrollAmount = icon.id === "left" ? -firstImgWidth : firstImgWidth;
|
|
111
153
|
carousel.scrollBy({
|
|
112
154
|
left: scrollAmount,
|
|
@@ -158,9 +200,3 @@
|
|
|
158
200
|
// document.addEventListener("mouseup", dragStop);
|
|
159
201
|
// carousel.addEventListener("touchend", dragStop);
|
|
160
202
|
</script>
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
@@ -65,12 +65,15 @@
|
|
|
65
65
|
flex: 0 0 calc(100% / 3);
|
|
66
66
|
scroll-snap-align: start;
|
|
67
67
|
padding: 20px;
|
|
68
|
+
display: flex;
|
|
69
|
+
flex-direction: column;
|
|
70
|
+
align-items: center;
|
|
71
|
+
justify-content: center;
|
|
68
72
|
}
|
|
69
73
|
|
|
70
74
|
.carousel img {
|
|
71
|
-
width: 100%;
|
|
72
75
|
object-fit: contain;
|
|
73
|
-
|
|
76
|
+
|
|
74
77
|
height: auto;
|
|
75
78
|
border-radius: 8px;
|
|
76
79
|
}
|
|
@@ -159,8 +162,8 @@
|
|
|
159
162
|
if (numImages > 3) {
|
|
160
163
|
arrowIcons[1].style.display = "block";
|
|
161
164
|
} else {
|
|
162
|
-
arrowIcons[0].style.display = "none";
|
|
163
|
-
arrowIcons[1].style.display = "none";
|
|
165
|
+
// arrowIcons[0].style.display = "none";
|
|
166
|
+
// arrowIcons[1].style.display = "none";
|
|
164
167
|
}
|
|
165
168
|
|
|
166
169
|
let isDragStart = false,
|
|
@@ -180,7 +183,7 @@
|
|
|
180
183
|
let firstImgWidth = firstImg.clientWidth + 40;
|
|
181
184
|
const scrollAmount = icon.id === "left" ? -firstImgWidth : firstImgWidth;
|
|
182
185
|
carousel.scrollBy({
|
|
183
|
-
left:
|
|
186
|
+
left: "100vw",
|
|
184
187
|
behavior: "smooth",
|
|
185
188
|
});
|
|
186
189
|
setTimeout(() => showHideIcons(), 60); // calling showHideIcons after 60ms
|
|
@@ -291,6 +291,7 @@
|
|
|
291
291
|
display: flex;
|
|
292
292
|
max-width: 90%;
|
|
293
293
|
position: relative;
|
|
294
|
+
align-items: center;
|
|
294
295
|
}
|
|
295
296
|
|
|
296
297
|
.inforgraphics_section .wrapper i {
|
|
@@ -349,12 +350,14 @@
|
|
|
349
350
|
flex: 0 0 calc(100% / 3);
|
|
350
351
|
scroll-snap-align: start;
|
|
351
352
|
padding: 20px;
|
|
353
|
+
display: flex;
|
|
354
|
+
align-items: center;
|
|
355
|
+
justify-content: center;
|
|
356
|
+
flex-direction: column;
|
|
352
357
|
}
|
|
353
358
|
|
|
354
359
|
.carousel img {
|
|
355
|
-
width: 100%;
|
|
356
360
|
object-fit: contain;
|
|
357
|
-
max-width: 100%;
|
|
358
361
|
height: auto;
|
|
359
362
|
border-radius: 8px;
|
|
360
363
|
}
|
|
@@ -396,3 +399,16 @@
|
|
|
396
399
|
margin-right: 0;
|
|
397
400
|
}
|
|
398
401
|
}
|
|
402
|
+
|
|
403
|
+
.modal1-body {
|
|
404
|
+
display: flex;
|
|
405
|
+
align-items: center;
|
|
406
|
+
justify-content: center;
|
|
407
|
+
height: 100vh;
|
|
408
|
+
}
|
|
409
|
+
|
|
410
|
+
.inforgraphics_section #right,
|
|
411
|
+
.inforgraphics_section #left {
|
|
412
|
+
height: 35px;
|
|
413
|
+
width: 200px;
|
|
414
|
+
}
|