@eeacms/volto-n2k 1.0.32 → 1.0.33

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -4,10 +4,16 @@ All notable changes to this project will be documented in this file. Dates are d
4
4
 
5
5
  Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
6
6
 
7
- ### [1.0.32](https://github.com/eea/volto-n2k/compare/1.0.31...1.0.32) - 20 June 2023
7
+ ### [1.0.33](https://github.com/eea/volto-n2k/compare/1.0.32...1.0.33) - 3 July 2023
8
8
 
9
9
  #### :hammer_and_wrench: Others
10
10
 
11
+ - hide arrows if pictures length <= 1 [Miu Razvan - [`5dfee21`](https://github.com/eea/volto-n2k/commit/5dfee212b039d92c325665eed203c99280fd8155)]
12
+ ### [1.0.32](https://github.com/eea/volto-n2k/compare/1.0.31...1.0.32) - 26 June 2023
13
+
14
+ #### :hammer_and_wrench: Others
15
+
16
+ - update [Miu Razvan - [`835cf25`](https://github.com/eea/volto-n2k/commit/835cf25febc14f7dcace0e943db84b1cbd186e40)]
11
17
  - Update style.less Refs#254603 [Claudia Ifrim - [`57f53b3`](https://github.com/eea/volto-n2k/commit/57f53b3fc9d5418cf1aa4139abd2843f6651ebd3)]
12
18
  - Update style.less Refs#254603 [Claudia Ifrim - [`84c68f3`](https://github.com/eea/volto-n2k/commit/84c68f3bf64569bafcf528b21baca7fa3f236f1e)]
13
19
  ### [1.0.31](https://github.com/eea/volto-n2k/compare/1.0.30...1.0.31) - 16 June 2023
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@eeacms/volto-n2k",
3
- "version": "1.0.32",
3
+ "version": "1.0.33",
4
4
  "description": "volto-n2k: Volto add-on",
5
5
  "main": "src/index.js",
6
6
  "author": "European Environment Agency: IDM2 A-Team",
@@ -60,47 +60,53 @@ const _View = (props) => {
60
60
  </div>
61
61
  {pictures_length > 0 && (
62
62
  <div className={cx('carousel one-slide')}>
63
- <div className="arrows">
64
- <button
65
- className="swiper-button image-swiper-button-prev"
66
- onClick={() => {
67
- swiperEl.current.slidePrev();
68
- if (previewEl.current?.[0]) {
69
- previewEl.current[0].slidePrev();
70
- }
71
- if (previewEl.current?.[1]) {
72
- previewEl.current[1].slidePrev();
73
- }
74
- setActiveSlide(swiperEl.current.realIndex);
75
- }}
76
- >
77
- <Icon
78
- className="icon-left"
79
- color="#000"
80
- name={arrowLeft}
81
- size="32px"
82
- />
83
- </button>
84
- <button
85
- className="swiper-button image-swiper-button-next"
86
- onClick={() => {
87
- swiperEl.current.slideNext();
88
- if (previewEl.current?.[0]) {
89
- previewEl.current[0].slideNext();
90
- }
91
- if (previewEl.current?.[1]) {
92
- previewEl.current[1].slideNext();
93
- }
94
- setActiveSlide(swiperEl.current.realIndex);
95
- }}
96
- >
97
- <Icon
98
- className="icon-right"
99
- color="#000"
100
- name={arrowRight}
101
- size="32px"
102
- />
103
- </button>
63
+ <div
64
+ className={cx('arrows', { 'arrows-hidden': pictures_length < 2 })}
65
+ >
66
+ {pictures_length > 1 && (
67
+ <>
68
+ <button
69
+ className="swiper-button image-swiper-button-prev"
70
+ onClick={() => {
71
+ swiperEl.current.slidePrev();
72
+ if (previewEl.current?.[0]) {
73
+ previewEl.current[0].slidePrev();
74
+ }
75
+ if (previewEl.current?.[1]) {
76
+ previewEl.current[1].slidePrev();
77
+ }
78
+ setActiveSlide(swiperEl.current.realIndex);
79
+ }}
80
+ >
81
+ <Icon
82
+ className="icon-left"
83
+ color="#000"
84
+ name={arrowLeft}
85
+ size="32px"
86
+ />
87
+ </button>
88
+ <button
89
+ className="swiper-button image-swiper-button-next"
90
+ onClick={() => {
91
+ swiperEl.current.slideNext();
92
+ if (previewEl.current?.[0]) {
93
+ previewEl.current[0].slideNext();
94
+ }
95
+ if (previewEl.current?.[1]) {
96
+ previewEl.current[1].slideNext();
97
+ }
98
+ setActiveSlide(swiperEl.current.realIndex);
99
+ }}
100
+ >
101
+ <Icon
102
+ className="icon-right"
103
+ color="#000"
104
+ name={arrowRight}
105
+ size="32px"
106
+ />
107
+ </button>
108
+ </>
109
+ )}
104
110
  {!!attribution_copyright[activeSlide] && (
105
111
  <p>{attribution_copyright[activeSlide]}</p>
106
112
  )}
@@ -218,13 +218,19 @@ div#view .habitat-banner-details .ui.container > * {
218
218
 
219
219
  p {
220
220
  overflow: hidden;
221
- width: calc(100% - 64px);
221
+ width: 100%;
222
222
  padding: 0.25rem 0.25rem 0.25rem 1rem;
223
223
  margin: 0;
224
224
  backdrop-filter: brightness(0.5);
225
225
  text-overflow: ellipsis;
226
226
  white-space: nowrap;
227
227
  }
228
+
229
+ &:not(.arrows-hidden) {
230
+ p {
231
+ width: calc(100% - 64px);
232
+ }
233
+ }
228
234
  }
229
235
  }
230
236
 
@@ -99,47 +99,53 @@ const _View = (props) => {
99
99
 
100
100
  {pictures_length > 0 && (
101
101
  <div className={cx('carousel one-slide')}>
102
- <div className="arrows">
103
- <button
104
- className="swiper-button image-swiper-button-prev"
105
- onClick={() => {
106
- swiperEl.current.slidePrev();
107
- if (previewEl.current?.[0]) {
108
- previewEl.current[0].slidePrev();
109
- }
110
- if (previewEl.current?.[1]) {
111
- previewEl.current[1].slidePrev();
112
- }
113
- setActiveSlide(swiperEl.current.realIndex);
114
- }}
115
- >
116
- <Icon
117
- className="icon-left"
118
- color="#000"
119
- name={arrowLeft}
120
- size="32px"
121
- />
122
- </button>
123
- <button
124
- className="swiper-button image-swiper-button-next"
125
- onClick={() => {
126
- swiperEl.current.slideNext();
127
- if (previewEl.current?.[0]) {
128
- previewEl.current[0].slideNext();
129
- }
130
- if (previewEl.current?.[1]) {
131
- previewEl.current[1].slideNext();
132
- }
133
- setActiveSlide(swiperEl.current.realIndex);
134
- }}
135
- >
136
- <Icon
137
- className="icon-right"
138
- color="#000"
139
- name={arrowRight}
140
- size="32px"
141
- />
142
- </button>
102
+ <div
103
+ className={cx('arrows', { 'arrows-hidden': pictures_length < 2 })}
104
+ >
105
+ {pictures_length > 1 && (
106
+ <>
107
+ <button
108
+ className="swiper-button image-swiper-button-prev"
109
+ onClick={() => {
110
+ swiperEl.current.slidePrev();
111
+ if (previewEl.current?.[0]) {
112
+ previewEl.current[0].slidePrev();
113
+ }
114
+ if (previewEl.current?.[1]) {
115
+ previewEl.current[1].slidePrev();
116
+ }
117
+ setActiveSlide(swiperEl.current.realIndex);
118
+ }}
119
+ >
120
+ <Icon
121
+ className="icon-left"
122
+ color="#000"
123
+ name={arrowLeft}
124
+ size="32px"
125
+ />
126
+ </button>
127
+ <button
128
+ className="swiper-button image-swiper-button-next"
129
+ onClick={() => {
130
+ swiperEl.current.slideNext();
131
+ if (previewEl.current?.[0]) {
132
+ previewEl.current[0].slideNext();
133
+ }
134
+ if (previewEl.current?.[1]) {
135
+ previewEl.current[1].slideNext();
136
+ }
137
+ setActiveSlide(swiperEl.current.realIndex);
138
+ }}
139
+ >
140
+ <Icon
141
+ className="icon-right"
142
+ color="#000"
143
+ name={arrowRight}
144
+ size="32px"
145
+ />
146
+ </button>
147
+ </>
148
+ )}
143
149
  {!!attribution_copyright[activeSlide] ? (
144
150
  <p>{attribution_copyright[activeSlide]}</p>
145
151
  ) : !!source[activeSlide] && !!license[activeSlide] ? (
@@ -214,13 +214,19 @@ div#view .species-banner-details .ui.container > * {
214
214
 
215
215
  p {
216
216
  overflow: hidden;
217
- width: calc(100% - 64px);
217
+ width: 100%;
218
218
  padding: 0.25rem 0.25rem 0.25rem 1rem;
219
219
  margin: 0;
220
220
  backdrop-filter: brightness(0.5);
221
221
  text-overflow: ellipsis;
222
222
  white-space: nowrap;
223
223
  }
224
+
225
+ &:not(.arrows-hidden) {
226
+ p {
227
+ width: calc(100% - 64px);
228
+ }
229
+ }
224
230
  }
225
231
  }
226
232