appscms-tools-theme 4.8.4 → 4.8.6

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: d75afd795b163b0ed730ed89678e03ed308a27ca5c9239d402bfd98b16051741
4
- data.tar.gz: 408c6560bfd846078478b9b50a7e854a61ae9e46911e40d765bb3c8ba1d8072b
3
+ metadata.gz: ae9825c20f03eee64a536a32700a3cd46ccce4a273c47e38c1c19c3786f80268
4
+ data.tar.gz: 36eed1340f35436d0ebc51fc4d27526fa0b3ea6aaf756ecc97d1886c61625765
5
5
  SHA512:
6
- metadata.gz: cd1e4e7a6da52500557b909d44d5653d187988d566c39d1aa1533b3f6fc0595a5d7d2d64214a584579faf64ecb1dcaa018cbcb9cd2593efa4b18503d5d2b6c31
7
- data.tar.gz: 6afc623496f576192cbba247c594e7276c84a7a56452ea123ef90aa24114e939f702142c86cc2b3e91e6f192953e8f91aa9a1ff21a9666f80a134c7832518d38
6
+ metadata.gz: c1f82195160cf40e10aa7f5d7e4eb75f69ce9c1d2a10760d85ee6a316f695417b44190149b72a6cee7be45bb4026c4399535ab387eae9e76cc2d9a32af1b7295
7
+ data.tar.gz: 7ddcbd7bae8eb50d0580eb1d2d25db7d5563e574777bcb6779d3b56546c08c8837e26abc2f8f1fd9c8f9a707c2eb5431c7f33d6638b95087bec6dc36db8dde38
@@ -1,23 +1,23 @@
1
1
  {
2
2
  "internatlionalization_whitelist_urls": [
3
- "http://localhost:3000/hi",
4
- "http://localhost:3000/ar",
5
- "http://localhost:3000/id",
6
- "http://localhost:3000/da",
7
- "http://localhost:3000/de",
8
- "http://localhost:3000/es",
9
- "http://localhost:3000/fr",
10
- "http://localhost:3000/it",
11
- "http://localhost:3000/nl",
12
- "http://localhost:3000/appscms-feature",
13
- "http://localhost:3000/hi/appscms-feature",
14
- "http://localhost:3000/ar/appscms-feature",
15
- "http://localhost:3000/id/appscms-feature",
16
- "http://localhost:3000/da/appscms-feature",
17
- "http://localhost:3000/de/appscms-feature",
18
- "http://localhost:3000/es/appscms-feature",
19
- "http://localhost:3000/fr/appscms-feature",
20
- "http://localhost:3000/it/appscms-feature",
21
- "http://localhost:3000/nl/appscms-feature"
3
+ "http://localhost:4000/hi",
4
+ "http://localhost:4000/ar",
5
+ "http://localhost:4000/id",
6
+ "http://localhost:4000/da",
7
+ "http://localhost:4000/de",
8
+ "http://localhost:4000/es",
9
+ "http://localhost:4000/fr",
10
+ "http://localhost:4000/it",
11
+ "http://localhost:4000/nl",
12
+ "http://localhost:4000/appscms-feature",
13
+ "http://localhost:4000/hi/appscms-feature",
14
+ "http://localhost:4000/ar/appscms-feature",
15
+ "http://localhost:4000/id/appscms-feature",
16
+ "http://localhost:4000/da/appscms-feature",
17
+ "http://localhost:4000/de/appscms-feature",
18
+ "http://localhost:4000/es/appscms-feature",
19
+ "http://localhost:4000/fr/appscms-feature",
20
+ "http://localhost:4000/it/appscms-feature",
21
+ "http://localhost:4000/nl/appscms-feature"
22
22
  ]
23
23
  }
@@ -12,7 +12,7 @@ contains full_url -%}
12
12
  href="{{site.url}}/{{ page.permalink}}"
13
13
  hreflang="{{item}}"
14
14
  />
15
- 1 {%- endif -%} {%- else -%} {%- if dataFile.features -%}
15
+ {%- endif -%} {%- else -%} {%- if dataFile.features -%}
16
16
 
17
17
  <link data-rh="true" rel="alternate" data-rh="true" rel="alternate" href="/" />
18
18
  {%- else -%} {% assign full_url = site.url | append: page.permalink %} {% assign
@@ -25,15 +25,15 @@ full_url -%}
25
25
  href="{{site.url}}/{{ page.permalink | split: '/' | last}}"
26
26
  hreflang="{{item}}"
27
27
  />
28
- 2 {%- endif -%} {%- endif -%} {%- endif -%} {%- else -%} {%- if
28
+ {%- endif -%} {%- endif -%} {%- endif -%} {%- else -%} {%- if
29
29
  dataFile.htmlLangAtt == item -%} {%- if page.permalink | split: '/' | last !=
30
30
  item -%} {% assign full_url = site.url | append: page.permalink %} {%- if
31
31
  whitelist_urls contains full_url -%}
32
32
  <link href="{{site.url}}/{{ page.permalink}}" hreflang="{{item}}" />
33
- 3 {%- endif -%} {%- else -%} {% assign full_url = site.url | append: '/' |
34
- append: item %} {%- if whitelist_urls contains full_url -%}
33
+ {%- endif -%} {%- else -%} {% assign full_url = site.url | append: '/' | append:
34
+ item %} {%- if whitelist_urls contains full_url -%}
35
35
  <link class="active-lang" href="{{site.url}}/{{item}}" hreflang="{{item}}" />
36
- 4 {%- endif -%} {%- endif -%} {%- else -%} {%- if page.permalink | split: '/' |
36
+ {%- endif -%} {%- endif -%} {%- else -%} {%- if page.permalink | split: '/' |
37
37
  last != item -%} {%- if dataFile.features -%} {%- if whitelist_urls contains
38
38
  page.permalink -%}
39
39
  <link
@@ -52,13 +52,13 @@ append: '/' | append: last_segment %} {%- if whitelist_urls contains full_url
52
52
  href="{{site.url}}/{{item}}/{{ page.permalink | split: '/' | last}}"
53
53
  hreflang="{{item}}"
54
54
  />
55
- 6 {%- endif -%} {%- endif -%} {%- else -%} {% assign full_url = site.url |
56
- append: '/' | append: item %} {%- if whitelist_urls contains full_url -%}
55
+ {%- endif -%} {%- endif -%} {%- else -%} {% assign full_url = site.url | append:
56
+ '/' | append: item %} {%- if whitelist_urls contains full_url -%}
57
57
  <link
58
58
  data-rh="true"
59
59
  rel="alternate"
60
60
  href="{{site.url}}/{{item}}"
61
61
  hreflang="{{item}}"
62
62
  />
63
- 7 {%- endif -%} {%- endif -%} {%- endif -%} {%- endif -%} {%- endif -%} {%-
64
- endfor -%} {%- endif -%}
63
+ {%- endif -%} {%- endif -%} {%- endif -%} {%- endif -%} {%- endif -%} {%- endfor
64
+ -%} {%- endif -%}
@@ -1,168 +1,108 @@
1
1
  <style>
2
- .inforgraphics_section {
3
- width: 100%;
4
- padding: 50px 0px 50px 0px;
5
- border-top: 1px solid rgb(224, 224, 224);
6
- display: flex;
7
- flex-direction: column;
8
- align-items: center;
9
- }
10
-
11
- .inforgraphics_section .wrapper {
12
- display: flex;
13
- max-width: 700px;
14
- position: relative;
15
- }
16
-
17
- .inforgraphics_section .wrapper i {
18
- top: 50%;
19
- height: 44px;
20
- width: 44px;
21
- color: #343f4f;
22
- cursor: pointer;
23
- font-size: 1.15rem;
24
- position: absolute;
25
- text-align: center;
26
- line-height: 44px;
27
- background: #eee;
28
- border-radius: 50%;
29
- transform: translateY(-50%);
30
- transition: transform 0.1s linear;
31
- }
32
-
33
- .inforgraphics_section .wrapper i:active {
34
- transform: translateY(-50%) scale(0.9);
35
- }
36
-
37
- .inforgraphics_section .wrapper i:hover {
38
- background: #f2f2f2;
39
- }
40
-
41
- .inforgraphics_section .wrapper i:first-child {
42
- left: 0px;
2
+ .modal1 {
43
3
  display: none;
44
- z-index: 999;
45
- }
46
-
47
- .inforgraphics_section .wrapper i:last-child {
48
- right: 0px;
49
- }
50
-
51
- .carousel {
52
- display: flex;
53
- max-width: 700px;
54
- overflow-x: scroll;
55
- scroll-snap-type: x mandatory;
56
- scroll-behavior: smooth;
57
- }
58
-
59
- .carousel-inner {
60
- display: flex;
61
- flex-wrap: nowrap;
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);
62
12
  }
63
-
64
- .slide {
65
- flex: 0 0 calc(100% / 3);
66
- scroll-snap-align: start;
67
- padding: 20px;
13
+ .modal1-content1 {
14
+ margin: auto;
15
+ display: block;
16
+ width: 80%;
17
+ max-width: 800px;
18
+ margin-top: 20px;
68
19
  }
69
-
70
- .carousel img {
20
+ .modal1-body img {
71
21
  width: 100%;
72
- object-fit: contain;
73
- max-width: 100%;
74
22
  height: auto;
75
- border-radius: 8px;
76
23
  }
77
-
78
- .carousel-inner p {
79
- text-align: center;
80
- margin: 10px 0;
81
- font-size: 14px;
82
- white-space: normal;
83
- word-wrap: break-word;
24
+ .close1 {
25
+ position: absolute;
26
+ top: 10px;
27
+ right: 10px;
28
+ font-size: 24px;
29
+ color: #fff;
30
+ cursor: pointer;
84
31
  }
85
-
86
- @media screen and (max-width: 768px) {
87
- .inforgraphics_section .wrapper {
88
- max-width: 100%;
89
- }
90
-
91
- .carousel-inner p {
92
- font-size: 20px;
93
- }
94
-
95
- .inforgraphics_section .wrapper i:first-child {
96
- left: 0;
97
- /* margin-left: 14px; */
98
- z-index: 99;
99
- }
100
-
101
- .inforgraphics_section .wrapper i:last-child {
102
- right: 0;
103
- z-index: 99;
104
- display: block !important;
105
- }
106
-
107
- .carousel {
108
- overflow-x: hidden;
109
- }
110
-
111
- .slide {
112
- flex: 0 0 100%;
113
- margin-right: 0;
114
- }
32
+ .close1:hover {
33
+ color: #ccc;
115
34
  }
116
35
  </style>
117
-
118
36
  <div class="inforgraphics_section">
119
37
  <h3 class="text-center w-100 mb-5"><b>Other useful information</b></h3>
120
38
  <div class="wrapper">
121
- <i id="left" class="fas fa-angle-left"></i>
39
+ <img
40
+ class="infographics-arrow"
41
+ id="left"
42
+ src="/assets/images/arrow-left.svg"
43
+ alt=""
44
+ />
122
45
  <div class="carousel">
123
46
  <div class="carousel-inner">
124
- {%- if homeData.infographics -%} {% for item in homeData.infographics %}
125
- <div class="slide">
126
- <img
127
- loading="lazy"
128
- src="{{ item.image }}"
129
- alt="img"
130
- draggable="false"
131
- />
132
- <p class="infographic-desc">{{ item.description | capitalize }}</p>
133
- </div>
134
- {% endfor %} {%- else -%} {% for item in featureData.infographics %}
47
+ {%- if pageData.infographics -%} {% for item in pageData.infographics %}
135
48
  <div class="slide">
136
49
  <img
137
50
  loading="lazy"
138
51
  src="{{ item.image }}"
139
52
  alt="img"
140
53
  draggable="false"
54
+ class="infographic-img"
55
+ onclick="openModal1('{{ item.image }}')"
141
56
  />
142
57
  <p class="infographic-desc">{{ item.description | capitalize }}</p>
143
58
  </div>
144
59
  {% endfor %} {%- endif -%}
145
60
  </div>
146
61
  </div>
147
- <i id="right" class="fas fa-angle-right"></i>
62
+ <img
63
+ class="infographics-arrow"
64
+ id="right"
65
+ src="/assets/images/arrow-right.svg"
66
+ alt=""
67
+ />
68
+ </div>
69
+ </div>
70
+ <div id="imageModal1" class="modal1" onclick="closeModal1()">
71
+ <span class="close1" onclick="closeModal1()">&times;</span>
72
+ <div class="modal1-content1">
73
+ <div class="modal1-body">
74
+ <img id="modal1Image" src="" alt="Image" />
75
+ </div>
148
76
  </div>
149
77
  </div>
150
-
151
78
  <script>
79
+ function openModal1(imageSrc) {
80
+ var modal1 = document.getElementById("imageModal1");
81
+ var modal1Img = document.getElementById("modal1Image");
82
+ modal1.style.display = "block";
83
+ modal1Img.src = imageSrc;
84
+ }
85
+ function closeModal1() {
86
+ var modal1 = document.getElementById("imageModal1");
87
+ modal1.style.display = "none";
88
+ }
89
+ document.addEventListener("click", function (event) {
90
+ var modal1 = document.getElementById("imageModal1");
91
+ if (event.target === modal1) {
92
+ closeModal1();
93
+ }
94
+ });
152
95
  const carousel = document.querySelector(".carousel-inner"),
153
96
  firstImg = carousel.querySelectorAll("img")[0],
154
- arrowIcons = document.querySelectorAll(".wrapper i");
155
-
97
+ arrowIcons = document.querySelectorAll(".infographics-arrow");
156
98
  const numImages = carousel.querySelectorAll("img").length;
157
99
  const isMobile = window.matchMedia("(max-width: 767px)").matches; // Check if screen width is less than or equal to 767px
158
-
159
100
  if (numImages > 3) {
160
101
  arrowIcons[1].style.display = "block";
161
102
  } else {
162
103
  arrowIcons[0].style.display = "none";
163
104
  arrowIcons[1].style.display = "none";
164
105
  }
165
-
166
106
  let isDragStart = false,
167
107
  isDragging = false,
168
108
  prevPageX,
@@ -174,7 +114,6 @@
174
114
  arrowIcons[1].style.display =
175
115
  carousel.scrollLeft == scrollWidth ? "none" : "block";
176
116
  };
177
-
178
117
  arrowIcons.forEach((icon) => {
179
118
  icon.addEventListener("click", () => {
180
119
  let firstImgWidth = firstImg.clientWidth + 40;
@@ -186,56 +125,4 @@
186
125
  setTimeout(() => showHideIcons(), 60); // calling showHideIcons after 60ms
187
126
  });
188
127
  });
189
-
190
- // const autoSlide = () => {
191
- // // if there is no image left to scroll then return from here
192
- // if (carousel.scrollLeft - (carousel.scrollWidth - carousel.clientWidth) > -1 || carousel.scrollLeft <= 0) return;
193
-
194
- // positionDiff = Math.abs(positionDiff); // making positionDiff value to positive
195
- // let firstImgWidth = firstImg.clientWidth + 14;
196
- // // getting difference value that needs to add or reduce from carousel left to take middle img center
197
- // let valDifference = firstImgWidth - positionDiff;
198
-
199
- // if (carousel.scrollLeft > prevScrollLeft) { // if user is scrolling to the right
200
- // return carousel.scrollLeft += positionDiff > firstImgWidth / 3 ? valDifference : -positionDiff;
201
- // }
202
- // // if user is scrolling to the left
203
- // carousel.scrollLeft -= positionDiff > firstImgWidth / 3 ? valDifference : -positionDiff;
204
- // }
205
-
206
- // const dragStart = (e) => {
207
- // // updatating global variables value on mouse down event
208
- // isDragStart = true;
209
- // prevPageX = e.pageX || e.touches[0].pageX;
210
- // prevScrollLeft = carousel.scrollLeft;
211
- // }
212
-
213
- // const dragging = (e) => {
214
- // // scrolling images/carousel to left according to mouse pointer
215
- // if (!isDragStart) return;
216
- // e.preventDefault();
217
- // isDragging = true;
218
- // carousel.classList.add("dragging");
219
- // positionDiff = (e.pageX || e.touches[0].pageX) - prevPageX;
220
- // carousel.scrollLeft = prevScrollLeft - positionDiff;
221
- // showHideIcons();
222
- // }
223
-
224
- // const dragStop = () => {
225
- // isDragStart = false;
226
- // carousel.classList.remove("dragging");
227
-
228
- // if (!isDragging) return;
229
- // isDragging = false;
230
- // autoSlide();
231
- // }
232
-
233
- // carousel.addEventListener("mousedown", dragStart);
234
- // carousel.addEventListener("touchstart", dragStart);
235
-
236
- // document.addEventListener("mousemove", dragging);
237
- // carousel.addEventListener("touchmove", dragging);
238
-
239
- // document.addEventListener("mouseup", dragStop);
240
- // carousel.addEventListener("touchend", dragStop);
241
128
  </script>
@@ -23,7 +23,7 @@
23
23
  }
24
24
 
25
25
  .search-button {
26
- background-color: #3078F2;
26
+ background-color: var(--primary-color);
27
27
  border: none;
28
28
  padding: 0 16px;
29
29
  display: flex;
@@ -3,57 +3,60 @@
3
3
  {%- elsif site.internationalizationall -%}
4
4
 
5
5
  <div class="internationalization-section">
6
- <div class="row">
7
- <div class="col-md-11 mx-auto">
8
- <div class="d-flex justify-content-center mt-1">
9
- <h3>Available in</h3>
6
+ <div class="container">
7
+ <div class="row">
8
+ <div class="col-md-12 mx-auto">
9
+ <div class="d-flex justify-content-center mt-1">
10
+ <h3>Available in</h3>
11
+ </div>
12
+ <div class="internationalization-languages">
13
+ {%- for item in matchurls -%} {%- if item != 'zh-TW' -%} {%- if item ==
14
+ 'en'-%} {%- if dataFile.htmlLangAtt == item -%}
15
+
16
+ <a
17
+ class="active-lang internationalization-language-drop-down-item font-weight-bold"
18
+ href="{{ page.permalink}}"
19
+ >English <i class="fas fa-check ml-auto"></i>
20
+ </a>
21
+
22
+ {%- else -%} {%- if dataFile.features -%}
23
+ <a class="internationalization-language-drop-down-item" href="/">English</a>
24
+ {%- else -%}
25
+ <a
26
+ class="internationalization-language-drop-down-item"
27
+ href="/{{ page.permalink | split: '/' | last}}"
28
+ >English
29
+ </a>
30
+ {%- endif -%} {%- endif -%} {%- else -%} {%- if dataFile.htmlLangAtt == item
31
+ -%} < > {%- if page.permalink | split: '/' | last != item -%}
32
+ <a
33
+ class="internationalization-language-drop-down-item font-weight-bold active-lang"
34
+ href="{{ page.permalink}}"
35
+ >{{[item][1]}}
36
+ <i class="fas fa-check ml-auto"></i>
37
+ </a>
38
+ {%- else -%}
39
+ <a class="active-lang" href="/{{item}}"
40
+ >{{[item][1]}}
41
+ <i class="fas fa-check ml-auto"></i>
42
+ </a>
43
+ {%- endif -%} {%- else -%} {%- if page.permalink | split: '/' | last != item
44
+ -%} {%- if dataFile.features -%}
45
+ <a class="internationalization-language-drop-down-item" href="/{{item}}">{{[item][1]}} </a>
46
+ {%- else -%}
47
+ <a
48
+ class="internationalization-language-drop-down-item"
49
+ href="/{{item}}/{{ page.permalink | split: '/' | last}}"
50
+ >{{[item][1]}}
51
+ </a>
52
+ {%- endif -%} {%- else -%}
53
+ <a class="internationalization-language-drop-down-item" href="/{{item}}">{{[item][1]}} </a>
54
+ {%- endif -%} {%- endif -%} {%- endif -%} {%- endif -%} {%- endfor -%}
55
+ </ul>
56
+ </div>
10
57
  </div>
11
- <div class="internationalization-languages">
12
- {%- for item in matchurls -%} {%- if item != 'zh-TW' -%} {%- if item ==
13
- 'en'-%} {%- if dataFile.htmlLangAtt == item -%}
14
-
15
- <a
16
- class="active-lang internationalization-language-drop-down-item font-weight-bold"
17
- href="{{ page.permalink}}"
18
- >English <i class="fas fa-check ml-auto"></i>
19
- </a>
20
-
21
- {%- else -%} {%- if dataFile.features -%}
22
- <a class="internationalization-language-drop-down-item" href="/">English</a>
23
- {%- else -%}
24
- <a
25
- class="internationalization-language-drop-down-item"
26
- href="/{{ page.permalink | split: '/' | last}}"
27
- >English
28
- </a>
29
- {%- endif -%} {%- endif -%} {%- else -%} {%- if dataFile.htmlLangAtt == item
30
- -%} < > {%- if page.permalink | split: '/' | last != item -%}
31
- <a
32
- class="internationalization-language-drop-down-item font-weight-bold active-lang"
33
- href="{{ page.permalink}}"
34
- >{{[item][1]}}
35
- <i class="fas fa-check ml-auto"></i>
36
- </a>
37
- {%- else -%}
38
- <a class="active-lang" href="/{{item}}"
39
- >{{[item][1]}}
40
- <i class="fas fa-check ml-auto"></i>
41
- </a>
42
- {%- endif -%} {%- else -%} {%- if page.permalink | split: '/' | last != item
43
- -%} {%- if dataFile.features -%}
44
- <a class="internationalization-language-drop-down-item" href="/{{item}}">{{[item][1]}} </a>
45
- {%- else -%}
46
- <a
47
- class="internationalization-language-drop-down-item"
48
- href="/{{item}}/{{ page.permalink | split: '/' | last}}"
49
- >{{[item][1]}}
50
- </a>
51
- {%- endif -%} {%- else -%}
52
- <a class="internationalization-language-drop-down-item" href="/{{item}}">{{[item][1]}} </a>
53
- {%- endif -%} {%- endif -%} {%- endif -%} {%- endif -%} {%- endfor -%}
54
- </ul>
55
- </div>
56
58
  </div>
59
+
57
60
  </div>
58
61
 
59
62
  </div>
@@ -2149,3 +2149,44 @@ select:focus {
2149
2149
  color: var(--black-color);
2150
2150
  padding: 10px 20px;
2151
2151
  }
2152
+ .infographics-arrow {
2153
+ height: 35px;
2154
+ width: 35px;
2155
+ filter: invert(1);
2156
+ position: absolute;
2157
+ top: 50%;
2158
+ background-color: #000;
2159
+ border-radius: 50%;
2160
+ padding: 8px;
2161
+ }
2162
+ #left {
2163
+ left: 3%;
2164
+ }
2165
+ #right {
2166
+ right: 3%;
2167
+ }
2168
+
2169
+ .internationalization-languages {
2170
+ display: grid;
2171
+ grid-template-columns: repeat(4, auto); /* Default: 4 columns */
2172
+ gap: 10px;
2173
+ padding: 10px;
2174
+ }
2175
+
2176
+ @media (max-width: 1200px) {
2177
+ .internationalization-languages {
2178
+ grid-template-columns: repeat(3, auto); /* 3 columns for large screens */
2179
+ }
2180
+ }
2181
+
2182
+ @media (max-width: 900px) {
2183
+ .internationalization-languages {
2184
+ grid-template-columns: repeat(2, auto); /* 2 columns for medium screens */
2185
+ }
2186
+ }
2187
+
2188
+ @media (max-width: 600px) {
2189
+ .internationalization-languages {
2190
+ grid-template-columns: auto; /* 1 column for small screens */
2191
+ }
2192
+ }
@@ -1,49 +0,0 @@
1
- function openModal1(imageSrc) {
2
- var modal1 = document.getElementById("imageModal1");
3
- var modal1Img = document.getElementById("modal1Image");
4
- modal1.style.display = "block";
5
- modal1Img.src = imageSrc;
6
- }
7
- function closeModal1() {
8
- var modal1 = document.getElementById("imageModal1");
9
- modal1.style.display = "none";
10
- }
11
- document.addEventListener("click", function (event) {
12
- var modal1 = document.getElementById("imageModal1");
13
- if (event.target === modal1) {
14
- closeModal1();
15
- }
16
- });
17
- const carousel = document.querySelector(".carousel-inner"),
18
- firstImg = carousel.querySelectorAll("img")[0],
19
- arrowIcons = document.querySelectorAll(".wrapper i");
20
- const numImages = carousel.querySelectorAll("img").length;
21
- const isMobile = window.matchMedia("(max-width: 767px)").matches; // Check if screen width is less than or equal to 767px
22
- if (numImages > 3) {
23
- arrowIcons[1].style.display = "block";
24
- } else {
25
- arrowIcons[0].style.display = "none";
26
- arrowIcons[1].style.display = "none";
27
- }
28
- let isDragStart = false,
29
- isDragging = false,
30
- prevPageX,
31
- prevScrollLeft,
32
- positionDiff;
33
- const showHideIcons = () => {
34
- let scrollWidth = carousel.scrollWidth - carousel.clientWidth; // getting max scrollable width
35
- arrowIcons[0].style.display = carousel.scrollLeft == 0 ? "none" : "block";
36
- arrowIcons[1].style.display =
37
- carousel.scrollLeft == scrollWidth ? "none" : "block";
38
- };
39
- arrowIcons.forEach((icon) => {
40
- icon.addEventListener("click", () => {
41
- let firstImgWidth = firstImg.clientWidth + 40;
42
- const scrollAmount = icon.id === "left" ? -firstImgWidth : firstImgWidth;
43
- carousel.scrollBy({
44
- left: scrollAmount,
45
- behavior: "smooth",
46
- });
47
- setTimeout(() => showHideIcons(), 60); // calling showHideIcons after 60ms
48
- });
49
- });
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.8.4
4
+ version: 4.8.6
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-08-21 00:00:00.000000000 Z
11
+ date: 2024-08-24 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: jekyll