main: Consider color-scheme setting for default stylesheet

Our own preference - equivalent to AdwStyleManager's color-scheme
property - is expressed via a new session mode property.

The default mode uses 'prefer-dark', gnome-classic is expected
to use 'force-light'.

https://gitlab.gnome.org/GNOME/gnome-shell/-/issues/5545

Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/2324>

js/ui/main.js

@@ -7,7 +7,7 @@
             kbdA11yDialog, introspectService, start, pushModal, popModal,
             activateWindow, moveWindowToMonitorAndWorkspace,
             createLookingGlass, initializeDeferredWork,
-            getThemeStylesheet, setThemeStylesheet, screenshotUI */
+            getStyleVariant, getThemeStylesheet, setThemeStylesheet, screenshotUI */
 
 const { Clutter, Gio, GLib, GObject, Meta, Shell, St } = imports.gi;
 
@@ -179,6 +179,7 @@ function start() {
     sessionMode.connect('updated', _sessionUpdated);
 
     St.Settings.get().connect('notify::high-contrast', _loadDefaultStylesheet);
+    St.Settings.get().connect('notify::color-scheme', _loadDefaultStylesheet);
 
     // Initialize ParentalControlsManager before the UI
     ParentalControlsManager.getDefault();
@@ -419,6 +420,25 @@ function _getStylesheet(name) {
     return null;
 }
 
+/** @returns {string} */
+function getStyleVariant() {
+    const {colorScheme} = St.Settings.get();
+    switch (sessionMode.colorScheme) {
+    case 'force-dark':
+        return 'dark';
+    case 'force-light':
+        return 'light';
+    case 'prefer-dark':
+        return colorScheme === St.SystemColorScheme.PREFER_LIGHT
+            ? 'light' : 'dark';
+    case 'prefer-light':
+        return colorScheme === St.SystemColorScheme.PREFER_DARK
+            ? 'dark' : 'light';
+    default:
+        return '';
+    }
+}
+
 function _getDefaultStylesheet() {
     let stylesheet = null;
     let name = sessionMode.stylesheetName;
@@ -427,8 +447,11 @@ function _getDefaultStylesheet() {
     if (St.Settings.get().high_contrast)
         stylesheet = _getStylesheet(name.replace('.css', '-high-contrast.css'));
 
+    if (stylesheet === null)
+        stylesheet = _getStylesheet(name.replace('.css', `-${getStyleVariant()}.css`));
+
     if (stylesheet == null)
-        stylesheet = _getStylesheet(sessionMode.stylesheetName);
+        stylesheet = _getStylesheet(name);
 
     return stylesheet;
 }

js/ui/sessionMode.js

@@ -22,7 +22,8 @@ if (Config.HAVE_NETWORKMANAGER)
 const _modes = {
     'restrictive': {
         parentMode: null,
-        stylesheetName: 'gnome-shell-dark.css',
+        stylesheetName: 'gnome-shell.css',
+        colorScheme: 'prefer-dark',
         themeResourceName: 'gnome-shell-theme.gresource',
         hasOverview: false,
         showCalendarEvents: false,