restore compatibility before nc 25

Signed-off-by: dartcafe <github@dartcafe.de>

appinfo/info.xml

@@ -23,7 +23,7 @@
     <screenshot>https://raw.githubusercontent.com/nextcloud/polls/master/screenshots/edit-poll.png</screenshot>
     <dependencies>
         <php min-version="7.4"/>
-        <nextcloud min-version="25" max-version="25" />
+        <nextcloud min-version="22" max-version="25" />
     </dependencies>
     <activity>
 		<providers>

src/js/assets/scss/colors.scss

@@ -18,15 +18,17 @@
 	--color-polls-dashboard-light-text: #ffffff;
 	--color-background-translucent: rgba(255,255,255,0.8);
 	--background-blur: blur(10px);
-}
 
-:root .theme--dark {
-	--color-foreground-error: #dddddd;
-	--color-foreground-success: #dddddd;
-	--color-background-success: #2e4600;
-	--color-background-error: #4d0d00;
-	--color-polls-background-yes: #2e4600;
-	--color-polls-background-no: #4d0d00;
-	--color-polls-background-maybe: #665600;
-	--color-background-translucent: rgba(24,24,24,0.8);
+	.theme--dark {
+		// @deprecated: compatibility for nc versions before 25
+		--color-main-background-blur: rgba(var(--color-main-background-rgb), .8);
+		--color-foreground-error: #dddddd;
+		--color-foreground-success: #dddddd;
+		--color-background-success: #2e4600;
+		--color-background-error: #4d0d00;
+		--color-polls-background-yes: #2e4600;
+		--color-polls-background-no: #4d0d00;
+		--color-polls-background-maybe: #665600;
+		--color-background-translucent: rgba(24,24,24,0.8);
+	}
 }

src/js/assets/scss/hacks.scss

@@ -1,5 +1,14 @@
 // some hacks, do alter the display of third parity components
 
+// until NC24: compatibility hack
+:root {
+	--color-main-background-blur: rgba(var(--color-main-background-rgb), .8);
+	--color-main-background-rgb: 255, 255, 255;
+	.theme--dark {
+		--color-main-background-rgb: 23, 23, 23;
+	}
+}
+
 // fill full input with background color
 .mx-input {
 	background-clip: initial !important;
@@ -31,6 +40,7 @@
 .user-item.add-public > .icon-add {
 	margin-right: 20px !important;
 }
+
 // fix avatardiv size to match the image
 .avatardiv img {
 	display: block;