EdPike365

import React from "react"
import styled from "@emotion/styled"
import useDarkMode from "use-dark-mode"

//This widget was based on https://codepen.io/Qvcool/pen/bdzVYW, with some modifications
//A real benefit of this approach is that it can also be used with a radio button set
//A real warning on this is it uses some CSS "tricks". 
//Also I have yet to get the unicode sequences (or Font Awesome) references to work for the icons
//In the meantime, just copy and paste unicode characters.

EdPike365

import React, { useEffect, useState } from "react"

//This will show the "prefers-color-scheme" value for this browser, reactively
//NOTE: Hook functions must use camel case because of linting rules.
function DarkModePreferredStatus() {
  
  //NOTES ON INTERACTIONS WITH CHROME DEV TOOLS:
  //On Windows 10, Chrome gets its settings from the OS via Settings> Colors
  //  options: light, dark, custom
  //This value can be overridden using Chrome dev tools emulator