Fix audio player floating when scrolling (#2142) (#2206)

Signed-off-by: ManuelSailer <[email protected]>
Signed-off-by: Manuel Sailer <[email protected]>

CHANGELOG.md

@@ -7,9 +7,9 @@ The format is mostly based on [Keep a Changelog](https://keepachangelog.com/en/1
 ### Changed
 
 ### Fixed
+- Fix audio player floating when scrolling in NC25+ (#2142)
 - Fix sorting of folder names in select when adding subscription (#2090)
 
-
 # Releases
 ## [21.2.0-beta3] - 2023-04-16
 ### Changed

css/content.css

@@ -66,6 +66,10 @@
     align-items: center;
 }
 
+#app-content.nc-major-version-gte-25 .podcast {
+    top: 0;
+}
+
 #app-content .podcast audio {
     display: block;
     width: calc(100% - 60px);
@@ -108,6 +112,17 @@
     left: 0;
 }
 
+#app-content.nc-major-version-gte-25 .podcast {
+    position: sticky;
+}
+
+@media only screen and (width < 1024px) {
+    #app-content.nc-major-version-gte-25 .podcast {
+        left: 35px;
+        width: calc(100% - 35px);
+    }
+}
+
 #notification a {
     text-decoration: underline;
     color: blue;

js/directive/NewsStickyMenu.js

@@ -7,7 +7,7 @@
  * @author Bernhard Posselt <[email protected]>
  * @copyright Bernhard Posselt 2014
  */
-app.directive('newsStickyMenu', function () {
+app.directive('newsStickyMenu', function (NC_MAJOR_VERSION) {
     'use strict';
 
     return function (scope, elem, attr) {
@@ -18,7 +18,9 @@ app.directive('newsStickyMenu', function () {
 
             if (scrollHeight > height) {
                 elem.addClass('fixed');
-                elem.css('top', scrollHeight);
+                if (NC_MAJOR_VERSION < 25) {
+                    elem.css('top', scrollHeight);
+                }
             } else {
                 elem.removeClass('fixed');
             }