j1-template 2024.3.20 → 2024.3.22

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 (151) hide show
  1. checksums.yaml +4 -4
  2. data/_layouts/page.html +1 -0
  3. data/assets/data/amplitude_app.html +87 -73
  4. data/assets/theme/j1/adapter/js/advertising.js +40 -38
  5. data/assets/theme/j1/adapter/js/algolia.js +13 -11
  6. data/assets/theme/j1/adapter/js/amplitude.js +882 -490
  7. data/assets/theme/j1/adapter/js/analytics.js +19 -17
  8. data/assets/theme/j1/adapter/js/asciidoctor.js +10 -8
  9. data/assets/theme/j1/adapter/js/attic.js +24 -22
  10. data/assets/theme/j1/adapter/js/bmd.js +10 -8
  11. data/assets/theme/j1/adapter/js/carousel.js +12 -9
  12. data/assets/theme/j1/adapter/js/chatbot.js +106 -104
  13. data/assets/theme/j1/adapter/js/clipboard.js +16 -14
  14. data/assets/theme/j1/adapter/js/comments.js +24 -22
  15. data/assets/theme/j1/adapter/js/cookieConsent.js +5 -1
  16. data/assets/theme/j1/adapter/js/customFunctions.js +12 -10
  17. data/assets/theme/j1/adapter/js/customModule.js +10 -8
  18. data/assets/theme/j1/adapter/js/docsearch.js +33 -31
  19. data/assets/theme/j1/adapter/js/dropdowns.js +16 -14
  20. data/assets/theme/j1/adapter/js/fab.js +34 -32
  21. data/assets/theme/j1/adapter/js/gallery.js +21 -19
  22. data/assets/theme/j1/adapter/js/gemini.js +66 -64
  23. data/assets/theme/j1/adapter/js/iconPicker.js +31 -29
  24. data/assets/theme/j1/adapter/js/iconPickerPage.js +11 -9
  25. data/assets/theme/j1/adapter/js/iframer.js +17 -15
  26. data/assets/theme/j1/adapter/js/j1.js +146 -143
  27. data/assets/theme/j1/adapter/js/lazyLoader.js +33 -31
  28. data/assets/theme/j1/adapter/js/lightbox.js +9 -7
  29. data/assets/theme/j1/adapter/js/logger.js +11 -9
  30. data/assets/theme/j1/adapter/js/lunr.js +37 -35
  31. data/assets/theme/j1/adapter/js/masonry.js +23 -21
  32. data/assets/theme/j1/adapter/js/masterslider.js +31 -29
  33. data/assets/theme/j1/adapter/js/mmenu.js +25 -23
  34. data/assets/theme/j1/adapter/js/navigator.js +43 -41
  35. data/assets/theme/j1/adapter/js/particles.js +12 -10
  36. data/assets/theme/j1/adapter/js/rangeSlider.js +21 -19
  37. data/assets/theme/j1/adapter/js/rouge.js +10 -8
  38. data/assets/theme/j1/adapter/js/rtable.js +14 -12
  39. data/assets/theme/j1/adapter/js/rtextResizer.js +10 -8
  40. data/assets/theme/j1/adapter/js/scroller.js +15 -13
  41. data/assets/theme/j1/adapter/js/slick.js +18 -16
  42. data/assets/theme/j1/adapter/js/slimSelect.js +30 -28
  43. data/assets/theme/j1/adapter/js/speak2me.js +25 -23
  44. data/assets/theme/j1/adapter/js/swiper.js +13 -11
  45. data/assets/theme/j1/adapter/js/themeToggler.js +11 -9
  46. data/assets/theme/j1/adapter/js/themes.js +25 -23
  47. data/assets/theme/j1/adapter/js/toccer.js +13 -11
  48. data/assets/theme/j1/adapter/js/translator.js +19 -16
  49. data/assets/theme/j1/adapter/js/videojs.js +9 -7
  50. data/assets/theme/j1/adapter/js/waves.js +18 -16
  51. data/assets/theme/j1/core/js/template.js +11180 -10968
  52. data/assets/theme/j1/core/js/template.min.js +13 -18
  53. data/assets/theme/j1/modules/amplitudejs/css/theme/uno/dark/amplitude.css +50 -4
  54. data/assets/theme/j1/modules/amplitudejs/css/theme/uno/dark/amplitude.min.css +1 -1
  55. data/assets/theme/j1/modules/amplitudejs/css/theme/uno/dark/player/compact.css +197 -403
  56. data/assets/theme/j1/modules/amplitudejs/css/theme/uno/dark/player/compact.min.css +1 -1
  57. data/assets/theme/j1/modules/amplitudejs/css/theme/uno/dark/player/large.css +70 -46
  58. data/assets/theme/j1/modules/amplitudejs/css/theme/uno/dark/player/large.min.css +1 -1
  59. data/assets/theme/j1/modules/amplitudejs/css/theme/uno/dark/player/mini.css +72 -9
  60. data/assets/theme/j1/modules/amplitudejs/css/theme/uno/dark/player/mini.min.css +2 -1
  61. data/assets/theme/j1/modules/amplitudejs/js/tech/ytp.js +481 -417
  62. data/assets/theme/j1/modules/backstretch/js/backstretch.js +2 -2
  63. data/assets/theme/j1/modules/backstretch/js/backstretch.min.js +1 -1
  64. data/assets/theme/j1/modules/cookieConsent/js/cookieConsent.js +11 -11
  65. data/assets/theme/j1/modules/cookieConsent/js/cookieConsent.min.js +2 -1
  66. data/assets/theme/j1/modules/dropdowns/js/dropdowns.js +2 -2
  67. data/assets/theme/j1/modules/dropdowns/js/dropdowns.min.js +1 -1
  68. data/assets/theme/j1/modules/fab/js/fab.js +2 -2
  69. data/assets/theme/j1/modules/fab/js/fab.min.js +1 -1
  70. data/assets/theme/j1/modules/lunr/js/j1.js +1 -1
  71. data/assets/theme/j1/modules/lunr/js/j1.min.js +2 -1
  72. data/assets/theme/j1/modules/rtable/js/rtable.js +2 -2
  73. data/assets/theme/j1/modules/rtable/js/rtable.min.js +2 -1
  74. data/assets/theme/j1/modules/scroller/js/scroller.js +31 -29
  75. data/assets/theme/j1/modules/scroller/js/scroller.min.js +2 -1
  76. data/assets/theme/j1/modules/themeSwitcher/js/switcher.js +26 -26
  77. data/assets/theme/j1/modules/themeSwitcher/js/switcher.min.js +2 -1
  78. data/assets/theme/j1/modules/translator/js/translator.js +17 -17
  79. data/assets/theme/j1/modules/translator/js/translator.min.js +1 -1
  80. data/assets/theme/j1/modules/videojs/js/plugins/players/dm/dailymotion.js +10 -8
  81. data/assets/theme/j1/modules/videojs/js/plugins/players/dm/dailymotion.min.js +1 -1
  82. data/assets/theme/j1/modules/videojs/js/plugins/players/vm/vimeo.js +9 -7
  83. data/assets/theme/j1/modules/videojs/js/plugins/players/vm/vimeo.min.js +1 -1
  84. data/assets/theme/j1/modules/videojs/js/plugins/players/wt/wistia.js +13 -11
  85. data/assets/theme/j1/modules/videojs/js/plugins/players/wt/wistia.min.js +1 -1
  86. data/assets/theme/j1/modules/videojs/js/plugins/players/yt/youtube.js +10 -8
  87. data/assets/theme/j1/modules/videojs/js/plugins/players/yt/youtube.min.js +1 -1
  88. data/lib/j1/version.rb +1 -1
  89. data/lib/starter_web/README.md +5 -5
  90. data/lib/starter_web/_config.yml +1 -1
  91. data/lib/starter_web/_data/modules/amplitude_app.yml +4 -4
  92. data/lib/starter_web/_data/modules/amplitude_playlists.yml +168 -123
  93. data/lib/starter_web/_data/modules/defaults/amplitude.yml +8 -3
  94. data/lib/starter_web/_data/modules/swiper_app.yml +67 -0
  95. data/lib/starter_web/_data/modules/swiper_playlists.yml +26 -0
  96. data/lib/starter_web/_data/templates/feed.xml +1 -1
  97. data/lib/starter_web/_includes/attributes.asciidoc +5 -4
  98. data/lib/starter_web/_plugins/asciidoctor/videojs-block.rb +8 -0
  99. data/lib/starter_web/_plugins/asciidoctor/youtube-block.rb +7 -0
  100. data/lib/starter_web/_plugins/index/lunr.rb +1 -1
  101. data/lib/starter_web/assets/audio/album/emancipator/Alligator.mp3 +0 -0
  102. data/lib/starter_web/assets/audio/album/emancipator/DabCity.mp3 +0 -0
  103. data/lib/starter_web/assets/audio/album/emancipator/SeaToSky.mp3 +0 -0
  104. data/lib/starter_web/assets/audio/album/emancipator/TimeForSpace.mp3 +0 -0
  105. data/lib/starter_web/assets/audio/cover/emancipator/alligator.jpg +0 -0
  106. data/lib/starter_web/assets/audio/cover/emancipator/anthem.jpg +0 -0
  107. data/lib/starter_web/assets/audio/cover/emancipator/dab-city.jpg +0 -0
  108. data/lib/starter_web/assets/audio/cover/emancipator/from-dusk-to-dawn.jpg +0 -0
  109. data/lib/starter_web/assets/audio/cover/emancipator/safe-in-the-steep-cliffs.jpg +0 -0
  110. data/lib/starter_web/assets/audio/cover/emancipator/sea-to-sky.jpg +0 -0
  111. data/lib/starter_web/assets/audio/cover/emancipator/soon-it-will-be-cold-enough.jpg +0 -0
  112. data/lib/starter_web/assets/audio/cover/emancipator/tine-for-space.jpg +0 -0
  113. data/lib/starter_web/assets/image/icon/bokeh/bokeh-32x32.ico +0 -0
  114. data/lib/starter_web/assets/image/icon/bokeh/bokeh.ico +0 -0
  115. data/lib/starter_web/assets/image/icon/bokeh/logo-160x160.png +0 -0
  116. data/lib/starter_web/assets/image/icon/hyvor-talk/hyvore-talk.ico +0 -0
  117. data/lib/starter_web/assets/image/icon/hyvor-talk/jpg/hyvor-logo.512x512.jpg +0 -0
  118. data/lib/starter_web/assets/image/icon/hyvor-talk/png/hyvor-logo.24x24.jpg +0 -0
  119. data/lib/starter_web/assets/image/icon/hyvor-talk/png/hyvor-logo.24x24.png +0 -0
  120. data/lib/starter_web/assets/image/icon/hyvor-talk/png/hyvor-logo.512x512.png +0 -0
  121. data/lib/starter_web/assets/image/icon/hyvor-talk/scalable/hyvor-logo.svg +81 -0
  122. data/lib/starter_web/assets/image/icon/jupyter/jupyter-32x32.ico +0 -0
  123. data/lib/starter_web/assets/image/icon/jupyter/jupyter.ico +0 -0
  124. data/lib/starter_web/assets/image/icon/jupyter/logo.png +0 -0
  125. data/lib/starter_web/assets/image/icon/mdi/mdi.svg +1 -0
  126. data/lib/starter_web/assets/image/icon/mdi/mdil.svg +1 -0
  127. data/lib/starter_web/assets/image/icon/scalable/facebook.svg +34 -0
  128. data/lib/starter_web/assets/image/icon/scalable/google.svg +35 -0
  129. data/lib/starter_web/assets/image/icon/scalable/ibm.svg +24 -0
  130. data/lib/starter_web/assets/image/icon/scalable/microsoft.svg +42 -0
  131. data/lib/starter_web/assets/image/module/swiper/simple/test/image/diana_krall.jpg +0 -0
  132. data/lib/starter_web/index.html +3 -3
  133. data/lib/starter_web/package.json +1 -1
  134. data/lib/starter_web/pages/public/learn/where_to_go.adoc +1 -1
  135. data/lib/starter_web/pages/public/tools/previewer/preview_amplitudejs.adoc +3 -18
  136. data/lib/starter_web/pages/public/tools/tester/app_tester_amplitudejs_yt.adoc +6 -6
  137. data/lib/starter_web/pages/public/tools/tester/app_tester_swiper.adoc +87 -0
  138. data/lib/starter_web/pages/public/tour/_includes/attributes.asciidoc +3 -3
  139. data/lib/starter_web/pages/public/tour/{play_audio.adoc → audio_data.adoc} +35 -55
  140. data/lib/starter_web/pages/public/tour/{present_images.adoc → image_data.adoc} +4 -5
  141. data/lib/starter_web/pages/public/tour/{play_video.adoc → video_data.adoc} +17 -16
  142. metadata +42 -14
  143. data/lib/starter_web/assets/audio/cover/emancipator/from-dusk-to-dawn/anthem.jpg +0 -0
  144. data/lib/starter_web/assets/audio/cover/emancipator/from-dusk-to-dawn/from-dusk-to-dawn.jpg +0 -0
  145. data/lib/starter_web/assets/audio/cover/emancipator/from-dusk-to-dawn/safe-in-the-steep-cliffs.jpg +0 -0
  146. data/lib/starter_web/assets/audio/cover/emancipator/from-dusk-to-dawn/soon-it-will-be-cold-enough.jpg +0 -0
  147. /data/lib/starter_web/assets/audio/album/emancipator/{from-dusk-to-dawn → !info}/!sound.links.txt +0 -0
  148. /data/lib/starter_web/assets/audio/album/emancipator/{from-dusk-to-dawn/Anthem.mp3 → Anthem.mp3} +0 -0
  149. /data/lib/starter_web/assets/audio/album/emancipator/{from-dusk-to-dawn/DuskToDawn.mp3 → DuskToDawn.mp3} +0 -0
  150. /data/lib/starter_web/assets/audio/album/emancipator/{from-dusk-to-dawn/FirstSnow.mp3 → FirstSnow.mp3} +0 -0
  151. /data/lib/starter_web/assets/audio/album/emancipator/{from-dusk-to-dawn/SafeInTheSteepCliffs.mp3 → SafeInTheSteepCliffs.mp3} +0 -0
@@ -29,11 +29,16 @@
29
29
  overflow-y: clip;
30
30
  }
31
31
 
32
- .meta-container.compact-player {
33
- height: 120px;
34
- border: 0px; /* jadams 2024-11-06: workaround, prevent double borders */
32
+ .compact-player-middle {
33
+ padding: 10px 10px 10px 10px;
34
+ background-color: var(--ajs-theme-uno--blue-gray-900);
35
+ }
36
+
37
+ .player-bottom {
38
+ background-color: var(--ajs-theme-uno--black);
35
39
  }
36
40
 
41
+
37
42
  /* 2. Components
38
43
  # ------------------------------------------------------------------------------ */
39
44
 
@@ -43,7 +48,6 @@
43
48
  position: relative;
44
49
  }
45
50
 
46
- /* jadams, 2024-11-04: Overload user agent styles for width|height */
47
51
  .player-top img[data-amplitude-song-info="cover_art_url"] {
48
52
  width: 498px; /* size of cover image (rendered) - 1px borders left|right */
49
53
  height: auto;
@@ -66,260 +70,121 @@
66
70
  left: 15px;
67
71
  }
68
72
 
69
- /*
70
- .compact-player-header-arrows.arrow-down {
71
- background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/up.svg") no-repeat;
72
- }
73
-
74
- .compact-player-header-arrows.arrow-up {
75
- background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/down.svg") no-repeat;
76
- }
77
- */
78
-
79
-
80
73
  /* Player MIDDLE
81
74
  # --------------------------------------------------------- */
82
75
 
83
- .compact-player-play-pause {
76
+ .compact-player-shuffle {
84
77
  display: inline-block;
85
78
  user-select: none;
86
- width: 60px;
87
- height: 60px;
88
- cursor: pointer;
89
- vertical-align: middle;
90
- }
91
- .compact-player-play-pause:hover {
92
- opacity: 0.5;
93
- }
94
- .compact-player-play-pause:focus:not(:focus-visible) {
95
- outline: none;
96
- }
97
- div.compact-player-play-pause.amplitude-paused {
98
- background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/play.svg") no-repeat;
99
- }
100
- div.compact-player-play-pause.amplitude-playing {
101
- background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/pause.svg") no-repeat;
102
- }
103
-
104
-
105
- div#compact_player_control_container {
106
- margin-top: 20px;
107
- margin-bottom: 20px;
108
- }
109
-
110
- /* clearfix */
111
- div#compact_player_control_container:after {
112
- content: "";
113
- display: table;
114
- clear: both;
115
- }
116
-
117
- div#compact_player_control_container
118
- div.volume-container {
119
- float: left;
120
- width: 88%;
121
- margin-top: 20px;
122
- margin-left: 12px;
123
- }
124
-
125
- /* clearfix */
126
- div#compact_player_control_container
127
- div.volume-container:after {
128
- content: "";
129
- display: table;
130
- clear: both;
131
- }
132
-
133
- div#compact_player_control_container
134
- div.volume-container
135
- div.volume-controls
136
- input[type=range] {
137
- width: calc(100% - 45px);
138
- }
139
-
140
- div#compact_player_control_container
141
- div.amplitude-mute {
142
- float: left;
143
- cursor: pointer;
144
- width: 25px;
145
- height: 19px;
146
- margin-left: 50px;
147
- }
148
-
149
- div#compact_player_control_container
150
- div.amplitude-mute.amplitude-muted {
151
- background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/mute.svg") no-repeat;
152
- }
153
-
154
- div#compact_player_control_container
155
- div.amplitude-mute.amplitude-not-muted {
156
- background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/volume.svg") no-repeat;
157
- }
158
-
159
- div#compact_player_controls {
160
- height: 65px;
161
- }
162
-
163
- div#compact_player_controls
164
- div.compact-player-controls-container {
165
- text-align: center;
166
- }
167
-
168
- div.compact-player-middle {
169
- padding: 10px 10px 10px 10px;
170
- background-color: var(--ajs-theme-uno--blue-gray-900);
171
- }
172
-
173
- div.compact-player-middle
174
- div.compact-player-controls-container {
175
- display: block;
176
- }
177
-
178
- div.compact-player-middle
179
- div.compact-player-controls-container
180
- div#compact_player_shuffle {
181
- display: inline-block;
182
79
  cursor: pointer;
183
80
  width: 24px;
184
81
  height: 24px;
185
82
  vertical-align: middle;
186
83
  }
187
84
 
188
- div.compact-player-middle
189
- div.compact-player-controls-container
190
- div#compact_player_shuffle:hover {
85
+ .compact-player-shuffle:hover {
191
86
  opacity: 0.5;
192
87
  }
193
88
 
194
- div.compact-player-middle
195
- div.compact-player-controls-container
196
- div#compact_player_shuffle.amplitude-shuffle-off {
89
+ /* .compact-player-shuffle.amplitude-shuffle-off {
197
90
  background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/shuffle-off.svg") no-repeat;
198
91
  }
199
92
 
200
- div.compact-player-middle
201
- div.compact-player-controls-container
202
- div#compact_player_shuffle.amplitude-shuffle-on {
93
+ .compact-player-shuffle.amplitude-shuffle-on {
203
94
  background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/shuffle-on.svg") no-repeat;
204
- }
95
+ } */
205
96
 
206
- div.compact-player-middle
207
- div.compact-player-controls-container
208
- div.compact-player-previous {
97
+ .compact-player-previous {
209
98
  display: inline-block;
99
+ user-select: none;
210
100
  cursor: pointer;
211
101
  vertical-align: middle;
212
102
  width: 24px;
213
103
  height: 24px;
214
104
  margin-right: 20px;
215
- margin-left: 20px; /* jadams: workaround to center player controls|volume slider */
216
- }
217
-
218
- div.compact-player-middle
219
- div.compact-player-controls-container
220
- div.compact-player-previous {
221
- display: inline-block;
222
- cursor: pointer;
223
- height: 24px;
224
- width: 24px;
225
- margin-right: 20px;
226
- vertical-align: middle;
227
- background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/previous.svg") no-repeat;
105
+ margin-left: 20px;
106
+ /* background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/previous.svg") no-repeat; */
228
107
  }
229
108
 
230
- div.compact-player-middle
231
- div.compact-player-controls-container
232
- div.compact-player-previous:hover {
109
+ .compact-player-previous:hover {
233
110
  opacity: 0.5;
234
111
  }
235
112
 
236
- div.compact-player-middle
237
- div.compact-player-controls-container
238
- div.compact-player-skip-backward {
113
+ .compact-player-skip-backward {
239
114
  display: inline-block;
115
+ user-select: none;
240
116
  cursor: pointer;
241
117
  height: 24px;
242
118
  width: 24px;
243
119
  margin-right: 20px;
244
120
  vertical-align: middle;
245
- background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/skip-backward.svg") no-repeat;
121
+ /* background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/skip-backward.svg") no-repeat; */
246
122
  }
247
123
 
248
- div.compact-player-middle
249
- div.compact-player-controls-container
250
- div.compact-player-skip-backward:hover {
124
+ .compact-player-skip-backward:hover {
251
125
  opacity: 0.5;
252
126
  }
253
127
 
254
- div.compact-player-middle
255
- div.compact-player-controls-container
256
- div.compact-player-play-pause {
128
+ .compact-player-play-pause {
257
129
  display: inline-block;
258
- cursor: pointer;
130
+ user-select: none;
259
131
  width: 60px;
260
132
  height: 60px;
133
+ cursor: pointer;
261
134
  vertical-align: middle;
262
135
  }
263
136
 
264
- div.compact-player-middle
265
- div.compact-player-controls-container
266
- div#compact_player_play_pause:hover {
267
- opacity: .5;
137
+ .compact-player-play-pause:hover {
138
+ opacity: 0.5;
268
139
  }
269
140
 
270
- div.compact-player-middle
271
- div.compact-player-controls-container
272
- div#compact_player_play_pause.amplitude-paused {
141
+ .compact-player-play-pause:focus:not(:focus-visible) {
142
+ outline: none;
143
+ }
144
+
145
+ .compact-player-play-pause.amplitude-paused {
273
146
  background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/play.svg") no-repeat;
274
147
  }
275
148
 
276
- div.compact-player-middle
277
- div.compact-player-controls-container
278
- div#compact_player_play_pause.amplitude-playing {
149
+ .compact-player-play-pause.amplitude-playing {
279
150
  background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/pause.svg") no-repeat;
280
151
  }
281
152
 
282
- div.compact-player-middle
283
- div.compact-player-controls-container
284
- div.compact-player-skip-forward {
153
+
154
+ .compact-player-skip-forward {
285
155
  display: inline-block;
156
+ user-select: none;
286
157
  cursor: pointer;
287
158
  height: 24px;
288
159
  width: 24px;
289
160
  margin-left: 20px;
290
161
  vertical-align: middle;
291
- background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/skip-forward.svg") no-repeat;
162
+ /* background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/skip-forward.svg") no-repeat; */
292
163
  }
293
164
 
294
- div.compact-player-middle
295
- div.compact-player-controls-container
296
- div.compact-player-skip-forward:hover {
165
+ .compact-player-skip-forward:hover {
297
166
  opacity: .5;
298
167
  }
299
168
 
300
- div.compact-player-middle
301
- div.compact-player-controls-container
302
- div.compact-player-next {
169
+ .compact-player-next {
303
170
  display: inline-block;
171
+ user-select: none;
304
172
  cursor: pointer;
305
173
  height: 24px;
306
174
  width: 24px;
307
175
  margin-right: 25px;
308
176
  margin-left: 20px;
309
177
  vertical-align: middle;
310
- background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/next.svg") no-repeat;
178
+ /* background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/next.svg") no-repeat; */
311
179
  }
312
180
 
313
- div.compact-player-middle
314
- div.compact-player-controls-container
315
- div.compact-player-next:hover {
181
+ .compact-player-next:hover {
316
182
  opacity: .5;
317
183
  }
318
184
 
319
- div.compact-player-middle
320
- div.compact-player-controls-container
321
- div#compact_player_repeat {
185
+ .compact-player-repeat {
322
186
  display: inline-block;
187
+ user-select: none;
323
188
  cursor: pointer;
324
189
  width: 24px;
325
190
  height: 24px;
@@ -327,61 +192,61 @@ div#compact_player_repeat {
327
192
  margin-right: 25px;
328
193
  }
329
194
 
330
- div.compact-player-middle
331
- div.large-player-controls-container
332
- div#compact_player_repeat:hover {
195
+ .compact-player-repeat:hover {
333
196
  opacity: .5;
334
197
  }
335
198
 
336
- div.compact-player-middle
337
- div.compact-player-controls-container
338
- div#compact_player_repeat.amplitude-repeat-off {
199
+ /* .compact-player-repeat.amplitude-repeat-off {
339
200
  background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/repeat-off.svg") no-repeat;
340
201
  }
341
202
 
342
- div.compact-player-middle
343
- div.compact-player-controls-container
344
- div#compact_player_repeat.amplitude-repeat-on {
203
+ .compact-player-repeat.amplitude-repeat-on {
345
204
  background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/repeat-on.svg") no-repeat;
205
+ } */
206
+
207
+ .compact-player-control-container {
208
+ margin-top: 20px;
209
+ margin-bottom: 10px;
210
+ }
211
+
212
+ /* clearfix */
213
+ .compact-player-control-container:after {
214
+ content: "";
215
+ display: table;
216
+ clear: both;
217
+ }
218
+
219
+ .compact-player-controls-container {
220
+ text-align: center;
346
221
  }
347
222
 
348
223
  /* clearfix */
349
- div.compact-player-middle
350
- div.compact-player-controls-container::after {
224
+ .compact-player-controls-container::after {
351
225
  content: "";
352
226
  display: table;
353
227
  clear: both;
354
228
  }
355
229
 
356
- div.compact-player-middle
357
- div.volume-container img {
230
+ .volume-container img {
358
231
  display: block;
359
232
  float: left;
360
233
  }
361
234
 
362
235
  /* clearfix */
363
- div.compact-player-middle
364
- div.volume-container:after {
236
+ .volume-container:after {
365
237
  content: "";
366
238
  display: table;
367
239
  clear: both;
368
240
  }
369
241
 
370
- div.compact-player-middle
371
- div.volume-controls
372
- div.amplitude-mute.amplitude-not-muted {
373
- background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/volume.svg") no-repeat;
242
+ .compact-player-amplitude-mute {
243
+ margin-left: 28px;
374
244
  }
375
245
 
376
- div.compact-player-middle
377
- div.volume-controls
378
- div.amplitude-mute.amplitude-muted {
379
- background: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/mute.svg") no-repeat;
380
- }
381
246
 
382
247
  /* Player BOTTOM
383
248
  # --------------------------------------------------------- */
384
- div.player-bottom {
249
+ .player-bottom {
385
250
  background-color: var(--ajs-theme-uno--black);
386
251
  }
387
252
 
@@ -407,35 +272,34 @@ Bootstrap (BS) grid breakpoints
407
272
 
408
273
  @media screen and (max-width: 576px) {
409
274
 
410
- /* jadams, workaround to limit player width on smart phones */
411
275
  .compact-player {
412
276
  max-width: -webkit-fill-available; /* Chrome, Safari, Edge */
413
277
  max-width: -moz-available; /* Firefox */
414
278
  }
415
279
 
416
- div.player-top img[data-amplitude-song-info="cover_art_url"] {
280
+ .player-top img[data-amplitude-song-info="cover_art_url"] {
417
281
  max-width: -webkit-fill-available; /* Chrome, Safari, Edge */
418
282
  max-width: -moz-available; /* Firefox */
419
283
  }
420
284
 
421
- div.compact-player-playlist {
285
+ .compact-player-playlist {
422
286
  width: calc(100% - 1px);
423
287
  }
424
288
 
425
- div.compact-player-volume-container
289
+ .compact-player-volume-container
426
290
  input[type=range].amplitude-volume-slider {
427
291
  appearance: none;
428
- width: calc(100% - 100px);
429
292
  }
430
293
 
431
- div.compact-player-volume-container
294
+ .compact-player-volume-container
432
295
  input[type=range].amplitude-volume-slider::-webkit-slider-thumb {
433
296
  width: 30px;
434
297
  height: 30px;
435
298
  border-radius: 30px;
436
299
  margin-top: -15px;
437
300
  }
438
- div.compact-player-volume-container
301
+
302
+ .compact-player-volume-container
439
303
  input[type=range].amplitude-volume-slider::-moz-slider-thumb {
440
304
  width: 30px;
441
305
  height: 30px;
@@ -451,10 +315,10 @@ Bootstrap (BS) grid breakpoints
451
315
 
452
316
  /* playlist
453
317
  # --------------------------------------------------------- */
454
- .compact-player-title-list {
455
- display: block;
456
- height: 550px;
457
- overflow-y: scroll;
318
+
319
+ .meta-container.compact-player {
320
+ height: 120px;
321
+ border: 0px;
458
322
  }
459
323
 
460
324
  .playlist-screen-meta-container {
@@ -462,84 +326,64 @@ Bootstrap (BS) grid breakpoints
462
326
  width: calc(100% - 123px);
463
327
  }
464
328
 
465
- div.compact-player-volume-container {
329
+ .compact-player-volume-container {
466
330
  margin-top: 20px;
467
331
  }
468
332
 
469
- div.compact-player-playlist {
470
- display: none;
471
- position: absolute;
472
- top: 0;
473
- right: 0;
474
- left: 0;
475
- bottom: 0;
476
- /* jadams 2024-11-07, workaround (reason unclear) */
477
- /* NOTE: make playlist 1 pixel wider to fit in width */
478
- width: calc(100% + 1px);
479
- background-color: var(--ajs-theme-uno--black);
333
+ .compact-player-volume-container
334
+ input[type=range].amplitude-volume-slider {
335
+ float: left;
336
+ height: 1px;
337
+ margin-top: 10px;
338
+ margin-left: 5px;
339
+ width: calc(100% - 118px);
340
+ background: transparent;
480
341
  }
481
342
 
482
- div.compact-player-playlist
483
- div.compact-player-title-list {
484
- height: 600px;
485
- overflow-y: scroll;
343
+ .compact-player-list-controls {
344
+ width: 128px !important;
345
+ margin-top: 50px !important;
346
+ margin-right: -32px !important;
486
347
  }
487
348
 
488
- div.compact-player-playlist
489
- div.compact-player-title-list
490
- div.song {
349
+ .compact-player-title-list
350
+ .song {
491
351
  padding: 15px;
492
352
  cursor: pointer;
493
353
  line-height: 20px;
494
354
  background-color: var(--ajs-theme-uno--darker-silver);
495
355
  }
496
356
 
497
- div.compact-player-playlist
498
- div.compact-player-title-list
499
- div.song
500
- span.song-number-now-playing {
357
+ .compact-player-title-list
358
+ .song-number-now-playing {
501
359
  float: left;
502
360
  width: 5px;
503
361
  height: 20px;
504
- margin-top: 8px;
362
+ margin-top: 14px;
505
363
  margin-right: 20px;
506
364
  }
507
365
 
508
- div.compact-player-playlist
509
- div.compact-player-title-list
510
- div.song
511
- span.song-number-now-playing
512
- span.number {
366
+ .compact-player-title-list
367
+ .song-number-now-playing
368
+ .number {
513
369
  opacity: 0.5;
514
370
  font-family: "Lato", sans-serif;
515
371
  font-size: 14px;
516
372
  color: var(--ajs-theme-uno--white);
517
373
  }
518
374
 
519
- div.compact-player-playlist
520
- div.compact-player-title-list
521
- div.song
522
- span.song-number-now-playing
375
+ .compact-player-title-list
376
+ .song-number-now-playing
523
377
  img.now-playing {
524
378
  display: none;
525
379
  }
526
380
 
527
- div.compact-player-playlist
528
- div.compact-player-title-list
529
- div.song
530
- div.song-meta-container {
531
- display: inline-block;
532
- width: calc(100% - 120px);
533
- }
534
-
535
- div.compact-player-playlist
536
- div.compact-player-title-list
537
- div.song
538
- div.song-meta-container
539
- span.song-name {
381
+ .compact-player-title-list
382
+ .song-meta-container
383
+ .song-name {
540
384
  display: block;
541
385
  width: calc(100% - 40px);
542
- margin-left: 10px;
386
+ margin-left: 38px;
543
387
  font-family: "Lato", sans-serif;
544
388
  font-size: 18px;
545
389
  white-space: nowrap;
@@ -548,118 +392,69 @@ span.song-name {
548
392
  color: var(--ajs-theme-uno--blue);
549
393
  }
550
394
 
551
- div.compact-player-playlist
552
- div.playlist-screen-controls
553
- div.playlist-screen-meta-container
554
- span.amplitude-audio-info {
555
- float: right;
556
- margin-right: -130px;
557
- }
558
-
559
- /*
560
- div.compact-player-playlist
561
- div.playlist-screen-controls
562
- div.playlist-screen-meta-container
563
- span.audio-rating {
564
- float: right;
565
- margin-right: -100px;
566
- margin-top: 10px;
567
- }
568
- */
569
-
570
- div.screen-controls-compact-player
571
- div.playlist-screen-meta-container
572
- span.audio-rating {
573
- display: flex;
574
- float: right;
575
- margin-top: 10px;
576
- margin-right: -100px;
577
- }
578
-
579
- /*
580
- div.screen-controls-large-player
581
- div.playlist-screen-meta-container
582
- span.audio-rating {
583
- display: flex;
584
- float: right;
585
- margin-top: 10px;
586
- margin-right: -48px;
587
- }
588
- */
589
-
590
- div.compact-player-playlist
591
- div.compact-player-title-list
592
- div.song
593
- div.song-meta-container
594
- span.audio-rating {
395
+ .compact-player-title-list
396
+ .song-meta-container
397
+ .audio-rating {
595
398
  display: flex;
596
399
  float: right;
597
- margin-top: -17px;
598
- margin-right: -96px;
400
+ margin-top: -38px;
401
+ margin-right: -3px;
599
402
  }
600
403
 
601
- div.compact-player-playlist
602
- div.compact-player-title-list
603
- div.song
604
- div.song-meta-container
605
- span.song-artist-album {
404
+ .compact-player-title-list
405
+ .song-meta-container
406
+ .song-artist-album {
606
407
  display: block;
607
- margin-left: 10px;
408
+ margin-left: 38px;
608
409
  font-family: "Lato", sans-serif;
609
410
  font-size: 16px;
610
411
  color: var(--ajs-theme-uno--gray-300);
611
412
  }
612
413
 
613
- div.compact-player-playlist
614
- div.compact-player-title-list
615
- div.song
616
- span.audio-duration {
414
+ .compact-player-title-list
415
+ .song-meta-container
416
+ .audio-duration {
617
417
  float: right;
618
- margin-top: -40px;
619
- margin-right: -93px;
418
+ margin-top: -18px;
620
419
  font-family: "Lato", sans-serif;
621
420
  font-size: 16px;
622
421
  color: var(--ajs-theme-uno--gray-300);
623
422
  }
624
423
 
625
- div.compact-player-playlist
626
- div.compact-player-title-list
627
- div.song
628
- span.song-duration {
629
- display: inline-block;
630
- opacity: 0.5;
631
- width: 35px;
632
- font-family: "Lato", sans-serif;
633
- font-size: 18px;
634
- text-align: center;
635
- color: var(--ajs-theme-uno--white);
424
+ /* .playlist-screen-meta-container */
425
+ .amplitude-audio-info-compact-player
426
+ .audio-rating {
427
+ display: flex;
428
+ float: right;
429
+ margin-top: 10px;
430
+ margin-right: -100px;
636
431
  }
637
432
 
638
- div.compact-player-playlist
639
- div.compact-player-title-list
640
- div.song
641
- span.audio-info {
642
- float: right;
643
- margin-top: -24px;
644
- margin-right: -110px;
433
+ .screen-controls-compact-player
434
+ .playlist-screen-meta-container
435
+ .amplitude-audio-info {
436
+ float: right;
437
+ margin-top: -10px;
438
+ margin-right: -130px;
645
439
  }
646
440
 
647
- .amplitude-audio-info-compact-player {
441
+ .screen-controls-compact-player
442
+ .playlist-screen-meta-container
443
+ .audio-rating {
444
+ display: flex;
648
445
  float: right;
649
- margin-right: -128px;
446
+ margin-top: 0px;
447
+ margin-right: -94px;
650
448
  }
651
449
 
652
-
653
- div.compact-player-playlist
654
- div.compact-player-title-list
655
- div.song.amplitude-active-song-container {
450
+ .compact-player-title-list
451
+ .song.amplitude-active-song-container {
656
452
  background-color: var(--ajs-theme-uno--medium-silver) !important;
657
453
  }
658
454
 
659
- div.compact-player-playlist
660
- div.compact-player-title-list
661
- div.song.amplitude-active-song-container
662
- span.song-number-now-playing
455
+ .compact-player-title-list
456
+ .song.amplitude-active-song-container
457
+ .song-number-now-playing
663
458
  img.now-playing {
664
459
  display: inline-block;
665
460
  height: 16px;
@@ -668,38 +463,47 @@ img.now-playing {
668
463
  margin-left: 4px;
669
464
  }
670
465
 
671
- div.compact-player-playlist
672
- div.compact-player-title-list
673
- div.song.amplitude-active-song-container
674
- span.song-number-now-playing
675
- span.number {
466
+ .compact-player-title-list
467
+ .song.amplitude-active-song-container
468
+ .song-number-now-playing
469
+ .number {
676
470
  display: none;
677
471
  }
678
472
 
679
- div.compact-player-playlist
680
- div.playlist-screen-controls
681
- div.playlist-screen-meta-container {
473
+ .compact-player-playlist {
474
+ display: none;
475
+ position: absolute;
476
+ top: 0;
477
+ right: 0;
478
+ left: 0;
479
+ bottom: 0;
480
+ /* jadams 2024-11-07, workaround (reason unclear) */
481
+ /* NOTE: make playlist 1 pixel wider to fit in width */
482
+ width: calc(100% + 1px);
483
+ background-color: var(--ajs-theme-uno--black);
484
+ }
485
+
486
+ .playlist-screen-controls
487
+ .playlist-screen-meta-container {
682
488
  float: left;
683
489
  width: calc(100% - 123px);
684
490
  }
685
491
 
686
- div.compact-player-playlist
687
- div.playlist-screen-controls
688
- div.playlist-screen-meta-container
689
- span.song-name {
492
+ .playlist-screen-controls
493
+ .playlist-screen-meta-container
494
+ .song-name {
495
+ display: block;
690
496
  font-family: "Lato", sans-serif;
691
497
  font-size: 18px;
692
498
  line-height: 24px;
693
499
  white-space: nowrap;
694
- overflow: hidden;
695
500
  text-overflow: ellipsis;
696
501
  color: var(--ajs-theme-uno--white);
697
502
  }
698
503
 
699
- div.compact-player-playlist
700
- div.playlist-screen-controls
701
- div.playlist-screen-meta-container
702
- div.song-artist-album {
504
+ .playlist-screen-controls
505
+ .playlist-screen-meta-container
506
+ .song-artist-album {
703
507
  opacity: 0.5;
704
508
  font-family: "Lato", sans-serif;
705
509
  font-size: 15px;
@@ -707,17 +511,15 @@ div.song-artist-album {
707
511
  color: var(--ajs-theme-uno--white);
708
512
  }
709
513
 
710
- div.compact-player-playlist
711
- div.playlist-screen-controls
712
- div.list-controls {
514
+ .playlist-screen-controls
515
+ .list-controls {
713
516
  float: right;
714
517
  margin-top: 48px;
715
518
  }
716
519
 
717
- div.compact-player-playlist
718
- div.playlist-screen-controls
719
- div.list-controls
720
- div.list-previous {
520
+ .playlist-screen-controls
521
+ .list-controls
522
+ .list-previous {
721
523
  float: left;
722
524
  cursor: pointer;
723
525
  width: 15px;
@@ -728,50 +530,44 @@ div.list-previous {
728
530
  background-image: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/small/previous.svg");
729
531
  }
730
532
 
731
- div.compact-player-playlist
732
- div.playlist-screen-controls
733
- div.list-controls
734
- div.list-previous:hover {
533
+ .playlist-screen-controls
534
+ .list-controls
535
+ .list-previous:hover {
735
536
  opacity: 0.5;
736
537
  }
737
538
 
738
- div.compact-player-playlist
739
- div.playlist-screen-controls
740
- div.list-controls
741
- div.list-play-pause {
539
+ .playlist-screen-controls
540
+ .list-controls
541
+ .amplitude-play-pause {
742
542
  float: left;
743
543
  cursor: pointer;
744
544
  width: 17px;
745
545
  height: 24px;
746
546
  }
747
547
 
748
- div.compact-player-playlist
749
- div.playlist-screen-controls
750
- div.list-controls
751
- div.list-play-pause:hover {
548
+ .playlist-screen-controls
549
+ .list-controls
550
+ .amplitude-play-pause:hover {
752
551
  opacity: 0.5;
753
552
  }
754
553
 
755
- div.compact-player-playlist
756
- div.playlist-screen-controls
757
- div.list-controls
758
- div.list-play-pause.amplitude-playing {
554
+ .playlist-screen-controls
555
+ .list-controls
556
+ .amplitude-play-pause.amplitude-playing {
759
557
  background-repeat: no-repeat;
760
558
  background-image: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/small/pause.svg");
761
559
  }
762
560
 
763
- div.compact-player-playlist
764
- div.playlist-screen-controls
765
- div.list-controls
766
- div.list-play-pause.amplitude-paused {
561
+ .playlist-screen-controls
562
+ .list-controls
563
+ .amplitude-play-pause.amplitude-paused {
767
564
  background-repeat: no-repeat;
768
565
  background-image: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/small/play.svg");
769
566
  }
770
567
 
771
- div.compact-player-playlist
772
- div.playlist-screen-controls
773
- div.list-controls
774
- div.list-next {
568
+ .playlist-screen-controls
569
+ .list-controls
570
+ .list-next {
775
571
  float: left;
776
572
  cursor: pointer;
777
573
  width: 15px;
@@ -782,25 +578,23 @@ div.list-next {
782
578
  background-image: url("/assets/theme/j1/modules/amplitudejs/icons/player/dark/small/next.svg");
783
579
  }
784
580
 
785
- div.compact-player-playlist
786
- div.playlist-screen-controls
787
- div.list-controls
788
- div.list-next:hover {
581
+ .playlist-screen-controls
582
+ .list-controls
583
+ .list-next:hover {
789
584
  opacity: 0.5;
790
585
  }
791
586
 
792
- div.compact-player-volume-container
587
+ .compact-player-volume-container
793
588
  input[type=range].amplitude-volume-slider {
794
589
  float: left;
795
590
  height: 1px;
796
591
  margin-top: 10px;
797
592
  margin-left: 5px;
798
- width: calc(100% - 165px);
593
+ width: calc(100% - 118px);
799
594
  background: transparent;
800
595
  }
801
596
 
802
597
 
803
-
804
598
  /* 5. Themes
805
599
  # ------------------------------------------------------------------------------ */
806
600