Show unrated puzzles different, dark theme adjustments

src/css/states/puzzle_menu.scss

@@ -26,6 +26,10 @@
             @include S(border-radius, $globalBorderRadius);
             flex-wrap: wrap;
 
+            @include DarkThemeOverride {
+                background: $accentColorDark;
+            }
+
             input.search {
                 color: #333;
                 margin: 0;
@@ -60,6 +64,10 @@
                 @include PlainText;
                 @include S(margin-right, 10px);
 
+                @include DarkThemeOverride {
+                    color: #bbbbc4;
+                }
+
                 input {
                     @include S(width, 15px);
                     @include S(height, 15px);
@@ -311,6 +319,9 @@
                             &.stage--hard {
                                 color: $colorRedBright;
                             }
+                            &.stage--unknown {
+                                color: #888;
+                            }
                         }
                     }
 

src/js/states/puzzle_menu.js

@@ -357,10 +357,7 @@ export class PuzzleMenuState extends TextualGameState {
             stats.classList.add("stats");
             elem.appendChild(stats);
 
-            if (
-                puzzle.downloads > 3 &&
-                !["official", "easy", "medium", "hard"].includes(this.activeCategory)
-            ) {
+            if (!["official", "easy", "medium", "hard"].includes(this.activeCategory)) {
                 const difficulty = document.createElement("div");
                 difficulty.classList.add("difficulty");
 
@@ -371,7 +368,10 @@ export class PuzzleMenuState extends TextualGameState {
                 difficulty.innerText = completionPercentage + "%";
                 stats.appendChild(difficulty);
 
-                if (puzzle.difficulty < 0.2) {
+                if (puzzle.difficulty === null) {
+                    difficulty.classList.add("stage--unknown");
+                    difficulty.innerText = T.puzzleMenu.difficulties.unknown;
+                } else if (puzzle.difficulty < 0.2) {
                     difficulty.classList.add("stage--easy");
                     difficulty.innerText = T.puzzleMenu.difficulties.easy;
                 } else if (puzzle.difficulty > 0.6) {

translations/base-en.yaml

@@ -176,6 +176,7 @@ puzzleMenu:
         easy: Easy
         medium: Medium
         hard: Hard
+        unknown: Unrated
 
     validation:
         title: Invalid Puzzle