appscms-tools-theme 4.4.8 → 4.5.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/_includes/appscms/infographics/infographics.html +62 -16
- data/_includes/appscms/searchbar/searchbar.html +3 -1
- data/_layouts/contenttool-feature.html +1 -1
- data/_layouts/home.html +1 -1
- data/assets/css/appscms-contenttool.css +1 -1
- data/assets/css/appscms-theme.css +2 -1
- data/assets/css/devtool-main.css +1 -1
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 1e1c23f0315670bf11919d55743066c044d512fd60635e1c42ac90f58237aa1f
|
4
|
+
data.tar.gz: 8c6c8585a67016bb6583563f82ddc27b0659e83554dd741b75db54b121d51053
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 4243c50b36cb4c36aafaa5ee90b54aef4b02286231f2f4b5ce5d5e36f1fd068de10914bfcf8fae11cd8aca9d394a639e809584799efce5c06f7bced9b59527b9
|
7
|
+
data.tar.gz: b375918797d270fce6b76a1e43bdb57a7bcdbd858aa51426d71b11f69f378d4c4f73d25fe21a71bcca2df375baab8ed0f2e13244a6d30c7dad1bfbd3b4346cb5
|
@@ -1,3 +1,38 @@
|
|
1
|
+
<style>
|
2
|
+
.modal {
|
3
|
+
display: none;
|
4
|
+
position: fixed;
|
5
|
+
z-index: 1000;
|
6
|
+
left: 0;
|
7
|
+
top: 0;
|
8
|
+
width: 100%;
|
9
|
+
height: 100%;
|
10
|
+
overflow: auto;
|
11
|
+
background-color: rgba(59, 58, 58, 0.9);
|
12
|
+
}
|
13
|
+
.modal-content {
|
14
|
+
margin: auto;
|
15
|
+
display: block;
|
16
|
+
width: 80%;
|
17
|
+
max-width: 800px;
|
18
|
+
margin-top: 20px;
|
19
|
+
}
|
20
|
+
.modal-body img {
|
21
|
+
width: 100%;
|
22
|
+
height: auto;
|
23
|
+
}
|
24
|
+
.close {
|
25
|
+
position: absolute;
|
26
|
+
top: 10px;
|
27
|
+
right: 10px;
|
28
|
+
font-size: 24px;
|
29
|
+
color: #fff;
|
30
|
+
cursor: pointer;
|
31
|
+
}
|
32
|
+
.close:hover {
|
33
|
+
color: #ccc;
|
34
|
+
}
|
35
|
+
</style>
|
1
36
|
<div class="inforgraphics_section">
|
2
37
|
<h3 class="text-center w-100 mb-5"><b>Other useful information</b></h3>
|
3
38
|
<div class="wrapper">
|
@@ -11,6 +46,8 @@
|
|
11
46
|
src="{{ item.image }}"
|
12
47
|
alt="img"
|
13
48
|
draggable="false"
|
49
|
+
class="infographic-img"
|
50
|
+
onclick="openModal('{{ item.image }}')"
|
14
51
|
/>
|
15
52
|
<p class="infographic-desc">{{ item.description | capitalize }}</p>
|
16
53
|
</div>
|
@@ -20,22 +57,42 @@
|
|
20
57
|
<i id="right" class="fas fa-angle-right"></i>
|
21
58
|
</div>
|
22
59
|
</div>
|
23
|
-
|
60
|
+
<div id="imageModal" class="modal" onclick="closeModal()">
|
61
|
+
<span class="close" onclick="closeModal()">×</span>
|
62
|
+
<div class="modal-content">
|
63
|
+
<div class="modal-body">
|
64
|
+
<img id="modalImage" src="" alt="Image">
|
65
|
+
</div>
|
66
|
+
</div>
|
67
|
+
</div>
|
24
68
|
<script>
|
69
|
+
function openModal(imageSrc) {
|
70
|
+
var modal = document.getElementById('imageModal');
|
71
|
+
var modalImg = document.getElementById('modalImage');
|
72
|
+
modal.style.display = "block";
|
73
|
+
modalImg.src = imageSrc;
|
74
|
+
}
|
75
|
+
function closeModal() {
|
76
|
+
var modal = document.getElementById('imageModal');
|
77
|
+
modal.style.display = "none";
|
78
|
+
}
|
79
|
+
document.addEventListener('click', function(event) {
|
80
|
+
var modal = document.getElementById('imageModal');
|
81
|
+
if (event.target === modal) {
|
82
|
+
closeModal();
|
83
|
+
}
|
84
|
+
});
|
25
85
|
const carousel = document.querySelector(".carousel-inner"),
|
26
86
|
firstImg = carousel.querySelectorAll("img")[0],
|
27
87
|
arrowIcons = document.querySelectorAll(".wrapper i");
|
28
|
-
|
29
88
|
const numImages = carousel.querySelectorAll("img").length;
|
30
89
|
const isMobile = window.matchMedia("(max-width: 767px)").matches; // Check if screen width is less than or equal to 767px
|
31
|
-
|
32
90
|
if (numImages > 3) {
|
33
91
|
arrowIcons[1].style.display = "block";
|
34
92
|
} else {
|
35
93
|
arrowIcons[0].style.display = "none";
|
36
94
|
arrowIcons[1].style.display = "none";
|
37
95
|
}
|
38
|
-
|
39
96
|
let isDragStart = false,
|
40
97
|
isDragging = false,
|
41
98
|
prevPageX,
|
@@ -47,7 +104,6 @@
|
|
47
104
|
arrowIcons[1].style.display =
|
48
105
|
carousel.scrollLeft == scrollWidth ? "none" : "block";
|
49
106
|
};
|
50
|
-
|
51
107
|
arrowIcons.forEach((icon) => {
|
52
108
|
icon.addEventListener("click", () => {
|
53
109
|
let firstImgWidth = firstImg.clientWidth + 40;
|
@@ -59,30 +115,25 @@
|
|
59
115
|
setTimeout(() => showHideIcons(), 60); // calling showHideIcons after 60ms
|
60
116
|
});
|
61
117
|
});
|
62
|
-
|
63
118
|
// const autoSlide = () => {
|
64
119
|
// // if there is no image left to scroll then return from here
|
65
120
|
// if (carousel.scrollLeft - (carousel.scrollWidth - carousel.clientWidth) > -1 || carousel.scrollLeft <= 0) return;
|
66
|
-
|
67
121
|
// positionDiff = Math.abs(positionDiff); // making positionDiff value to positive
|
68
122
|
// let firstImgWidth = firstImg.clientWidth + 14;
|
69
123
|
// // getting difference value that needs to add or reduce from carousel left to take middle img center
|
70
124
|
// let valDifference = firstImgWidth - positionDiff;
|
71
|
-
|
72
125
|
// if (carousel.scrollLeft > prevScrollLeft) { // if user is scrolling to the right
|
73
126
|
// return carousel.scrollLeft += positionDiff > firstImgWidth / 3 ? valDifference : -positionDiff;
|
74
127
|
// }
|
75
128
|
// // if user is scrolling to the left
|
76
129
|
// carousel.scrollLeft -= positionDiff > firstImgWidth / 3 ? valDifference : -positionDiff;
|
77
130
|
// }
|
78
|
-
|
79
131
|
// const dragStart = (e) => {
|
80
132
|
// // updatating global variables value on mouse down event
|
81
133
|
// isDragStart = true;
|
82
134
|
// prevPageX = e.pageX || e.touches[0].pageX;
|
83
135
|
// prevScrollLeft = carousel.scrollLeft;
|
84
136
|
// }
|
85
|
-
|
86
137
|
// const dragging = (e) => {
|
87
138
|
// // scrolling images/carousel to left according to mouse pointer
|
88
139
|
// if (!isDragStart) return;
|
@@ -93,22 +144,17 @@
|
|
93
144
|
// carousel.scrollLeft = prevScrollLeft - positionDiff;
|
94
145
|
// showHideIcons();
|
95
146
|
// }
|
96
|
-
|
97
147
|
// const dragStop = () => {
|
98
148
|
// isDragStart = false;
|
99
149
|
// carousel.classList.remove("dragging");
|
100
|
-
|
101
150
|
// if (!isDragging) return;
|
102
151
|
// isDragging = false;
|
103
152
|
// autoSlide();
|
104
153
|
// }
|
105
|
-
|
106
154
|
// carousel.addEventListener("mousedown", dragStart);
|
107
155
|
// carousel.addEventListener("touchstart", dragStart);
|
108
|
-
|
109
156
|
// document.addEventListener("mousemove", dragging);
|
110
157
|
// carousel.addEventListener("touchmove", dragging);
|
111
|
-
|
112
158
|
// document.addEventListener("mouseup", dragStop);
|
113
159
|
// carousel.addEventListener("touchend", dragStop);
|
114
|
-
</script>
|
160
|
+
</script>
|
@@ -15,7 +15,7 @@
|
|
15
15
|
appscms/uploadbutton/uploadbutton.html -%} {%- include
|
16
16
|
appscms/featurehighlight/featurehighlight.html -%} {%- include
|
17
17
|
appscms/howto/howto.html -%} {%- if pageData.infographics.size > 0 -%} {%-
|
18
|
-
include appscms/infographics/infographics.html -%} {%- endif -%} {%- include
|
18
|
+
include /appscms/infographics/infographics.html -%} {%- endif -%} {%- include
|
19
19
|
appscms/faq/faq.html -%}
|
20
20
|
<!-- {%- include
|
21
21
|
appscms/extras/traffic-count.html -%} -->
|
data/_layouts/home.html
CHANGED
@@ -217,7 +217,7 @@
|
|
217
217
|
{%- endif -%} {%- endif -%} {%- include share/socialshare.html -%} {%-
|
218
218
|
include Rating/rating.html -%}
|
219
219
|
{%- if homeData.infographics.size > 0 -%}
|
220
|
-
{%- include infographics/infographics.html -%}
|
220
|
+
{%- include /appscms/infographics/infographics.html -%}
|
221
221
|
{%- endif -%}
|
222
222
|
|
223
223
|
{%- if homeData.USPS -%} {%- include
|
@@ -1287,8 +1287,9 @@ body {
|
|
1287
1287
|
transition-duration: 0.27s;
|
1288
1288
|
}
|
1289
1289
|
.slide img:hover {
|
1290
|
-
transform: scale(1.
|
1290
|
+
transform: scale(1.02);
|
1291
1291
|
box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.12);
|
1292
|
+
cursor: pointer;
|
1292
1293
|
}
|
1293
1294
|
.no-result-found-msg {
|
1294
1295
|
font-size: 20px;
|
data/assets/css/devtool-main.css
CHANGED
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: appscms-tools-theme
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 4.
|
4
|
+
version: 4.5.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- vivek-appscms
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2024-
|
11
|
+
date: 2024-04-12 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: jekyll
|