@finqu/cool 1.2.0 → 1.2.3

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 (60) hide show
  1. package/dist/css/cool-grid.css +2 -2
  2. package/dist/css/cool-grid.css.map +3 -3
  3. package/dist/css/cool-grid.min.css +1 -1
  4. package/dist/css/cool-grid.min.css.map +1 -1
  5. package/dist/css/cool-reboot.css +2 -2
  6. package/dist/css/cool-reboot.css.map +6 -6
  7. package/dist/css/cool-reboot.min.css +1 -1
  8. package/dist/css/cool-reboot.min.css.map +1 -1
  9. package/dist/css/cool.css +2668 -726
  10. package/dist/css/cool.css.map +18 -18
  11. package/dist/css/cool.min.css +2 -2
  12. package/dist/css/cool.min.css.map +1 -1
  13. package/dist/js/cool.bundle.js +119 -32
  14. package/dist/js/cool.bundle.js.map +1 -1
  15. package/dist/js/cool.bundle.min.js +2 -2
  16. package/dist/js/cool.bundle.min.js.map +1 -1
  17. package/dist/js/cool.esm.js +119 -32
  18. package/dist/js/cool.esm.js.map +1 -1
  19. package/dist/js/cool.esm.min.js +2 -2
  20. package/dist/js/cool.esm.min.js.map +1 -1
  21. package/dist/js/cool.js +119 -32
  22. package/dist/js/cool.js.map +1 -1
  23. package/dist/js/cool.min.js +2 -2
  24. package/dist/js/cool.min.js.map +1 -1
  25. package/html/dropdown-test.html +200 -0
  26. package/html/index.html +480 -5
  27. package/js/dist/collapse.js +1 -1
  28. package/js/dist/common.js +677 -545
  29. package/js/dist/common.js.map +1 -1
  30. package/js/dist/dropdown.js +3188 -1819
  31. package/js/dist/dropdown.js.map +1 -1
  32. package/js/dist/popover.js +1 -1
  33. package/js/dist/sectiontabs.js +1 -1
  34. package/js/dist/select.js +2842 -2649
  35. package/js/dist/select.js.map +1 -1
  36. package/js/dist/tooltip.js +1 -1
  37. package/js/src/common.js +8 -0
  38. package/js/src/dialog.js +6 -1
  39. package/js/src/dropdown.js +77 -5
  40. package/js/src/select.js +31 -31
  41. package/package.json +21 -21
  42. package/scss/_alert.scss +79 -82
  43. package/scss/_badge.scss +16 -22
  44. package/scss/_dialog.scss +1 -0
  45. package/scss/_dropdown.scss +1 -4
  46. package/scss/_frame.scss +23 -3
  47. package/scss/_functions.scss +10 -0
  48. package/scss/_images.scss +7 -1
  49. package/scss/_navbar.scss +40 -0
  50. package/scss/_section.scss +14 -0
  51. package/scss/_type.scss +37 -6
  52. package/scss/_variables.scss +4 -3
  53. package/scss/cool-grid.scss +1 -1
  54. package/scss/cool-reboot.scss +1 -1
  55. package/scss/cool.scss +1 -1
  56. package/scss/mixins/_alert-variant.scss +13 -28
  57. package/scss/mixins/_badge-variant.scss +27 -5
  58. package/scss/mixins/_text-truncate.scss +77 -4
  59. package/scss/utilities/_cursor.scss +2 -2
  60. package/scss/utilities/_text.scss +4 -2
package/html/dropdown-test.html ADDED
@@ -0,0 +1,200 @@
1
+ <!DOCTYPE html>
2
+
3
+ <html>
4
+
5
+ <head>
6
+ <meta charset="utf-8">
7
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
8
+ <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
9
+
10
+ <title>Finqu UI</title>
11
+
12
+ <link rel="dns-prefetch" href="//cdn.finqu.com">
13
+ <link rel="dns-prefetch" href="//fonts.gstatic.com">
14
+
15
+ <meta name="application-name" content="Finqu UI">
16
+ <meta name="msapplication-TileColor" content="#212529">
17
+ <meta name="msapplication-TileImage" content="https://cdn.finqu.com/sites/public/images/favicons/mstile-144x144.png">
18
+ <meta name="theme-color" content="#212529">
19
+
20
+ <link rel="apple-touch-icon" sizes="57x57" href="https://cdn.finqu.com/sites/public/images/favicons/apple-touch-icon-57x57.png">
21
+ <link rel="apple-touch-icon" sizes="60x60" href="https://cdn.finqu.com/sites/public/images/favicons/apple-touch-icon-60x60.png">
22
+ <link rel="apple-touch-icon" sizes="72x72" href="https://cdn.finqu.com/sites/public/images/favicons/apple-touch-icon-72x72.png">
23
+ <link rel="apple-touch-icon" sizes="76x76" href="https://cdn.finqu.com/sites/public/images/favicons/apple-touch-icon-76x76.png">
24
+ <link rel="apple-touch-icon" sizes="114x114" href="https://cdn.finqu.com/sites/public/images/favicons/apple-touch-icon-114x114.png">
25
+ <link rel="apple-touch-icon" sizes="120x120" href="https://cdn.finqu.com/sites/public/images/favicons/apple-touch-icon-120x120.png">
26
+ <link rel="apple-touch-icon" sizes="144x144" href="https://cdn.finqu.com/sites/public/images/favicons/apple-touch-icon-144x144.png">
27
+ <link rel="apple-touch-icon" sizes="152x152" href="https://cdn.finqu.com/sites/public/images/favicons/apple-touch-icon-152x152.png">
28
+ <link rel="apple-touch-icon" sizes="180x180" href="https://cdn.finqu.com/sites/public/images/favicons/apple-touch-icon-180x180.png">
29
+
30
+ <link rel="icon" type="image/png" href="https://cdn.finqu.com/sites/public/images/favicons/favicon-16x16.png" sizes="16x16">
31
+ <link rel="icon" type="image/png" href="https://cdn.finqu.com/sites/public/images/favicons/favicon-32x32.png" sizes="32x32">
32
+ <link rel="icon" type="image/png" href="https://cdn.finqu.com/sites/public/images/favicons/favicon-96x96.png" sizes="96x96">
33
+ <link rel="icon" type="image/png" href="https://cdn.finqu.com/sites/public/images/favicons/android-chrome-192x192.png" sizes="192x192">
34
+
35
+ <link href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i" rel="stylesheet">
36
+ <link rel="stylesheet" href="../dist/css/cool.css">
37
+ <script defer src="https://use.fontawesome.com/releases/v5.8.1/js/all.js" integrity="sha384-g5uSoOSBd7KkhAMlnQILrecXvzst9TdC09/VM+pjDTCM+1il8RHz5fKANTFFb+gQ" crossorigin="anonymous"></script>
38
+ </head>
39
+
40
+ <body style="overflow: auto">
41
+
42
+ <!-- <div style="height: 2000px;"> -->
43
+
44
+ <div class="dropdown-test" style="position: fixed; top: 0; left: 0;">
45
+
46
+ <div class="dropdown dropleft">
47
+
48
+ <button class="btn btn-primary" type="button" data-toggle="dropdown">
49
+ Dropdown (top/left)
50
+ </button>
51
+
52
+ <div class="dropdown-menu dropdown-menu-left">
53
+
54
+ <ul class="dropdown-list">
55
+
56
+ <li class="dropdown-item">Item 1</li>
57
+ <li class="dropdown-item">Item 2</li>
58
+ <li class="dropdown-item">Item 3</li>
59
+ <li class="dropdown-divider"></li>
60
+ <li class="dropdown-item">Item 4</li>
61
+ <li class="dropdown-item">Item 5</li>
62
+
63
+ </ul>
64
+
65
+ </div>
66
+
67
+ </div>
68
+
69
+ </div>
70
+
71
+ <div class="dropdown-test" style="position: fixed; top: 0; right: 0;">
72
+
73
+ <div class="dropdown dropright">
74
+
75
+ <button class="btn btn-primary" type="button" data-toggle="dropdown">
76
+ Dropdown (top/right)
77
+ </button>
78
+
79
+ <div class="dropdown-menu dropdown-menu-right">
80
+
81
+ <ul class="dropdown-list">
82
+
83
+ <li class="dropdown-item">Item 1 asfdkhfakj ahsdfkjgads fjgadsjh</li>
84
+ <li class="dropdown-item">Item 2</li>
85
+ <li class="dropdown-item">Item 3</li>
86
+ <li class="dropdown-divider"></li>
87
+ <li class="dropdown-item">Item 4</li>
88
+ <li class="dropdown-item">Item 5</li>
89
+
90
+ </ul>
91
+
92
+ </div>
93
+
94
+ </div>
95
+
96
+ </div>
97
+
98
+ <div class="dropdown-test" style="position: fixed; bottom: 0; right: 0;">
99
+
100
+ <div class="dropdown">
101
+
102
+ <button class="btn btn-primary" type="button" data-toggle="dropdown">
103
+ Dropdown (bottom/right)
104
+ </button>
105
+
106
+ <div class="dropdown-menu dropdown-menu-right">
107
+
108
+ <ul class="dropdown-list">
109
+
110
+ <li class="dropdown-item">Item 1</li>
111
+ <li class="dropdown-item">Item 2</li>
112
+ <li class="dropdown-item">Item 3</li>
113
+ <li class="dropdown-divider"></li>
114
+ <li class="dropdown-item">Item 4</li>
115
+ <li class="dropdown-item">Item 5</li>
116
+
117
+ </ul>
118
+
119
+ </div>
120
+
121
+ </div>
122
+
123
+ </div>
124
+
125
+ <div class="dropdown-test" style="position: fixed; bottom: 0; left: 0;">
126
+
127
+ <div class="dropdown dropdown">
128
+
129
+ <button class="btn btn-primary" type="button" data-toggle="dropdown">
130
+ Dropdown (bottom/left)
131
+ </button>
132
+
133
+ <div class="dropdown-menu dropdown-menu-left">
134
+
135
+ <ul class="dropdown-list">
136
+
137
+ <li class="dropdown-item">Item 1</li>
138
+ <li class="dropdown-item">Item 2</li>
139
+ <li class="dropdown-item">Item 3</li>
140
+ <li class="dropdown-divider"></li>
141
+ <li class="dropdown-item">Item 4</li>
142
+ <li class="dropdown-item">Item 5</li>
143
+
144
+ </ul>
145
+
146
+ </div>
147
+
148
+ </div>
149
+
150
+ </div>
151
+
152
+ <div class="dropdown-test" style="margin-top: 200px; margin-left: 200px;">
153
+
154
+ <div class="dropdown dropdown">
155
+
156
+ <button class="btn btn-primary" type="button" data-toggle="dropdown">
157
+ Dropdown
158
+ </button>
159
+
160
+ <div class="dropdown-menu dropdown-menu-left">
161
+
162
+ <ul class="dropdown-list">
163
+
164
+ <li class="dropdown-item">Item 1</li>
165
+ <li class="dropdown-item">Item 2</li>
166
+ <li class="dropdown-item">Item 3</li>
167
+ <li class="dropdown-divider"></li>
168
+ <li class="dropdown-item">Item 4</li>
169
+ <li class="dropdown-item">Item 5</li>
170
+
171
+ </ul>
172
+
173
+ </div>
174
+
175
+ </div>
176
+
177
+ </div>
178
+
179
+ <!-- </div> -->
180
+
181
+ <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
182
+ <script src="../dist/js/cool.js"></script>
183
+ <script type="text/javascript">
184
+
185
+ Cool.initialize({
186
+ dropdown: {
187
+ debug: false,
188
+ onClose: function() {
189
+ let placements = ['top', 'left', 'right', 'bottom'];
190
+ let nextPlacement = placements[placements.indexOf(this.placement) + 1] || 'top';
191
+ this.placement = nextPlacement;
192
+ }
193
+ }
194
+ });
195
+
196
+ </script>
197
+
198
+ </body>
199
+
200
+ </html>