@iris.interactive/handcook 2.3.11 → 2.5.1

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.
Files changed (26) hide show
  1. package/mix-manifest.json +7 -0
  2. package/package.json +10 -2
  3. package/public/index.html +390 -29
  4. package/public/scripts/components/collapse/collapse.component.css +50 -0
  5. package/public/scripts/components/collapse/collapse.component.js +66 -0
  6. package/public/scripts/components/collapse/collapse.component.scss +19 -0
  7. package/public/scripts/components/dropdown/dropdown.component.js +45 -0
  8. package/public/scripts/components/lazyload/lazyload.component.js +26 -0
  9. package/public/scripts/components/lightbox/lightbox.component.js +32 -0
  10. package/public/scripts/components/modal/modal.component.css +18 -0
  11. package/public/scripts/components/modal/modal.component.js +45 -0
  12. package/public/scripts/components/modal/modal.component.scss +20 -0
  13. package/public/scripts/components/slider/slider.component.js +123 -0
  14. package/public/scripts/components/smooth-scroll/smooth-scroll.component.js +64 -0
  15. package/public/scripts/components/tab/tab.component.css +20 -0
  16. package/public/scripts/components/tab/tab.component.js +46 -0
  17. package/public/scripts/components/tab/tab.component.scss +23 -0
  18. package/public/scripts/components/toggle/toggle.component.js +50 -0
  19. package/public/scripts/components/tooltip/tooltip.component.js +75 -0
  20. package/public/scripts/enumerators/element.enum.js +28 -0
  21. package/public/scripts/enumerators/tooltip.enum.js +21 -0
  22. package/public/scripts/index.js +21962 -65
  23. package/public/styles/scss/mixins/_mixin-font.scss +2 -2
  24. package/public/styles/scss/style.css +186 -0
  25. package/public/mix-manifest.json +0 -9
  26. package/public/scripts/SmoothScroll.js +0 -41
package/public/styles/scss/mixins/_mixin-font.scss CHANGED
@@ -16,8 +16,8 @@
16
16
 
17
17
  /* Font icon
18
18
  /* ============================================= */
19
- @mixin fi($unicode) {
20
- content: #{'"\\' + $unicode + '"'};
19
+ @mixin fi($name) {
20
+ content: var(--font-icon--#{$name});
21
21
  font-family: "collection-font";
22
22
  font-style: initial;
23
23
  text-transform: none;
package/public/styles/scss/style.css ADDED
@@ -0,0 +1,186 @@
1
+ /*!
2
+ * IRIS Interactive
3
+ *
4
+ * NOTICE OF LICENSE
5
+ *
6
+ * This source file is no subject to a specific license
7
+ * but it belongs to the company IRIS Interactive.
8
+ * You can contact IRIS Interactive at the following
9
+ * address: contact@iris-interactive.fr
10
+ *
11
+ * @author Lucas ROCHE
12
+ * @date 27/01/2022 14:32
13
+ * @copyright Copyright (c) 2002-2022 IRIS Interactive, Inc. (http://www.iris-interactive.fr)
14
+ */
15
+ /*
16
+ * Created by IRIS Interactive
17
+ * User : IRIS Interactive
18
+ */
19
+ /* Layout
20
+ / ================================================== */
21
+ /* Gutter
22
+ / ================================================== */
23
+ /* Margin
24
+ / ================================================== */
25
+ /* Margin
26
+ / ================================================== */
27
+ /* Breakpoint
28
+ / ================================================== */
29
+ /* Global
30
+ / ================================================== */
31
+ /* Notifications
32
+ / ================================================== */
33
+ /* Difficulty
34
+ / ================================================== */
35
+ /*
36
+ * Created by IRIS Interactive
37
+ * User : IRIS Interactive
38
+ */
39
+ /* Main gutter
40
+ / ================================================== */
41
+ /* Breakpoints
42
+ /* ============================================= */
43
+ /* display flex
44
+ /* ============================================= */
45
+ /* Hover - TODO
46
+ /* ============================================= */
47
+ /* Touch
48
+ /* ============================================= */
49
+ /* Clear
50
+ /* ============================================= */
51
+ /*
52
+ * Created by IRIS Interactive
53
+ * User : IRIS Interactive
54
+ */
55
+ /* Transition
56
+ /* ============================================= */
57
+ /* Hover
58
+ /* ============================================= */
59
+ /* Ellipsis
60
+ /* ============================================= */
61
+ /* Adaptive height block
62
+ /* ============================================= */
63
+ /* Line clamp
64
+ /* ============================================= */
65
+ /* Object fit
66
+ /* ============================================= */
67
+ /* Linear Gradient
68
+ /* ============================================= */
69
+ /* fit-content
70
+ /* ============================================= */
71
+ /* stretched-link
72
+ /* ============================================= */
73
+ /* sr-only
74
+ /* ============================================= */
75
+ /*!
76
+ * IRIS Interactive
77
+ *
78
+ * NOTICE OF LICENSE
79
+ *
80
+ * This source file is no subject to a specific license
81
+ * but it belongs to the company IRIS Interactive.
82
+ * You can contact IRIS Interactive at the following
83
+ * address: contact@iris-interactive.fr
84
+ *
85
+ * @author Lucas ROCHE
86
+ * @date 28/01/2022 07:41
87
+ * @copyright Copyright (c) 2002-2022 IRIS Interactive, Inc. (http://www.iris-interactive.fr)
88
+ */
89
+ /* Font icon
90
+ /* ============================================= */
91
+ /* Font size
92
+ /* ============================================= */
93
+ /*
94
+ * Created by IRIS Interactive
95
+ * User : IRIS Interactive
96
+ */
97
+ /* Utils classes
98
+ /* ============================================= */
99
+ .stretched-link:before {
100
+ position: absolute;
101
+ top: 0;
102
+ right: 0;
103
+ bottom: 0;
104
+ left: 0;
105
+ z-index: 1;
106
+ pointer-events: auto;
107
+ content: "";
108
+ background-color: transparent;
109
+ }
110
+
111
+ /* ============================================= */
112
+ .list-flex {
113
+ display: flex;
114
+ flex-wrap: wrap;
115
+ margin-bottom: 0;
116
+ }
117
+ .list-flex > * {
118
+ list-style-type: none;
119
+ margin: 0 10px 10px 0;
120
+ }
121
+ .list-flex > *:last-child {
122
+ margin-right: 0;
123
+ }
124
+
125
+ /* Animations
126
+ /* ============================================= */
127
+ @-webkit-keyframes loader {
128
+ 100% {
129
+ transform: rotate(360deg);
130
+ }
131
+ }
132
+ @keyframes loader {
133
+ 100% {
134
+ transform: rotate(360deg);
135
+ }
136
+ }
137
+ /* Sr-only
138
+ /* ============================================= */
139
+ .sr-only {
140
+ clip: rect(0, 0, 0, 0);
141
+ border-width: 0;
142
+ height: 1px;
143
+ margin: -1px;
144
+ overflow: hidden;
145
+ padding: 0;
146
+ position: absolute;
147
+ white-space: nowrap;
148
+ width: 1px;
149
+ }
150
+
151
+ /* Text with icon before
152
+ /* ============================================= */
153
+ .text-icon {
154
+ display: inline-flex;
155
+ align-items: center;
156
+ }
157
+ .text-icon:before {
158
+ margin-right: 5px;
159
+ }
160
+ .text-icon:after {
161
+ margin-left: 5px;
162
+ }
163
+
164
+ /* Block with img animated on hover
165
+ /* ============================================= */
166
+ .hover-item img {
167
+ transition: 0.2s ease;
168
+ will-change: transform;
169
+ }
170
+ .hover-item:hover img {
171
+ transform: scale(1.02);
172
+ }
173
+
174
+ /* Opening
175
+ /* ============================================= */
176
+ .is-opened {
177
+ color: #009e55;
178
+ }
179
+
180
+ .soon-closed {
181
+ color: #ff890e;
182
+ }
183
+
184
+ .is-closed {
185
+ color: #f33;
186
+ }
package/public/mix-manifest.json DELETED
@@ -1,9 +0,0 @@
1
- {
2
- "/scripts/index.js": "/scripts/index.js",
3
- "/styles/style.css": "/styles/style.css",
4
- "/index.html": "/index.html",
5
- "/styles/scss/_utils.scss": "/styles/scss/_utils.scss",
6
- "/styles/scss/_variables.scss": "/styles/scss/_variables.scss",
7
- "/styles/scss/handcook.scss": "/styles/scss/handcook.scss",
8
- "/scripts/SmoothScroll.js": "/scripts/SmoothScroll.js"
9
- }
package/public/scripts/SmoothScroll.js DELETED
@@ -1,41 +0,0 @@
1
- const easeInCubic = function (t) { return t*t*t }
2
-
3
- const scrollToElem = (startTime, currentTime, duration, scrollEndElemTop, startScrollOffset) => {
4
- const runtime = currentTime - startTime;
5
- let progress = runtime / duration;
6
-
7
- progress = Math.min(progress, 1);
8
-
9
- const ease = easeInCubic(progress);
10
-
11
- window.scroll(0, startScrollOffset + (scrollEndElemTop * ease));
12
- if(runtime < duration){
13
- requestAnimationFrame((timestamp) => {
14
- const currentTime = timestamp || new Date().getTime();
15
- scrollToElem(startTime, currentTime, duration, scrollEndElemTop, startScrollOffset);
16
- })
17
- }
18
- }
19
-
20
- const SmoothScroll = (triggerAttribute, durationAnimation = 1000 ) => {
21
- const triggerElement = document.querySelectorAll( triggerAttribute );
22
- triggerElement.forEach( ( element, key ) => {
23
- element.addEventListener( 'click', ( event ) => {
24
- event.preventDefault();
25
- const target = ( element.getAttribute( 'href' ) != '' ) ? document.querySelector( element.getAttribute( 'href' ) ) : document.querySelector( element.dataset.href );
26
- const shift = ( element.dataset.shift !== undefined ) ? element.dataset.shift : 0;
27
-
28
- const anim = requestAnimationFrame((timestamp) => {
29
- const stamp = timestamp || new Date().getTime();
30
- const start = stamp;
31
-
32
- const startScrollOffset = window.pageYOffset;
33
- const scrollEndElemTop = target.getBoundingClientRect().top - shift;
34
-
35
- scrollToElem(start, stamp, durationAnimation, scrollEndElemTop, startScrollOffset);
36
- })
37
- } );
38
- } );
39
- }
40
-
41
- export default SmoothScroll;