Revert "DOC-3143: Remove dark mode detection and set skin to oxide-dark in demo examples; update release notes formatting issue."

This reverts commit df31f31.

Author: kemister85

modules/ROOT/examples/live-demos/full-featured/example.js

@@ -6,6 +6,7 @@ const fetchApi = import(
 // Instead, an alternate method for retrieving the API key should be used.
 const openai_api_key = "<INSERT_OPENAI_API_KEY_HERE>";
 
+const useDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches;
 const isSmallScreen = window.matchMedia('(max-width: 1023.5px)').matches;
 
 tinymce.init({
@@ -110,7 +111,8 @@ tinymce.init({
   content_style: '.mymention{ color: gray; }',
   contextmenu: 'link image editimage table configurepermanentpen',
   a11y_advanced_options: true,
-  skin: 'oxide-dark',
+  skin: useDarkMode ? 'oxide-dark' : 'oxide',
+  content_css: useDarkMode ? 'dark' : 'default',
   autocorrect_capitalize: true,
   mergetags_list: [
     {

modules/ROOT/examples/live-demos/full-featured/index.js

@@ -141,6 +141,7 @@ tinymce.ScriptLoader.loadScripts(['https://cdn.jsdelivr.net/npm/faker@5/dist/fak
     });
   };
 
+  const useDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches;
   const isSmallScreen = window.matchMedia('(max-width: 1023.5px)').matches;
 
   const ai_request = (request, respondWith) => {
@@ -522,7 +523,8 @@ tinymce.ScriptLoader.loadScripts(['https://cdn.jsdelivr.net/npm/faker@5/dist/fak
     'body { font-family:Helvetica,Arial,sans-serif; font-size:16px }',
     contextmenu: 'link image editimage table spellchecker configurepermanentpen',
     a11y_advanced_options: true,
-    skin: 'oxide-dark',
+    skin: useDarkMode ? 'oxide-dark' : 'oxide',
+    content_css: useDarkMode ? 'dark' : 'default',
     mentions_selector: '.mymention',
     mentions_fetch: mentions_fetch,
     mentions_menu_hover: mentions_menu_hover,

modules/ROOT/pages/7.7.0-release-notes.adoc

@@ -242,7 +242,7 @@ For information on the **Accessibility Checker** plugin, see: xref:a11ychecker.a
 
 {productname} {release-version} also includes the following improvements:
 
-=== Improved visual indication of keyboard focus for a comment annotation when there is an image inside.
+==== Improved visual indication of keyboard focus for a comment annotation when there is an image inside.
 // #TINY-11596
 
 In previous versions of **Comments**, annotated non-text elements occasionally displayed a double bottom border when selected, leading to a visual inconsistency that appeared buggy and clashed with existing border styles.