status-im/react-native
2
0
Fork 0
mirror of https://github.com/status-im/react-native.git synced 2025-01-14 11:34:23 +00:00
Code Issues Projects Releases Wiki Activity

allow for dark background in the debugger view

Browse Source 
Summary:
I prefer a darker environment when coding, and having the Chrome window be dark except the part that I cannot hide, is making my eyes hurt. This is for the people that prefer the darker color scheme when developing.
Closes https://github.com/facebook/react-native/pull/11878

Differential Revision: D4494415

Pulled By: mkonicek

fbshipit-source-id: 423473ec073e6ddd0d14322c22ee37abed1c55bc
This commit is contained in:
Pavlos Vinieratos 2017-02-02 04:42:32 -08:00 committed by Facebook Github Bot
parent ee737e7d1c
commit 5e6f39aace
1 changed files with 14 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
local-cli/server/util/debugger.html
View File

@ -15,6 +15,19 @@
<link rel="icon" href="data:;base64,iVBORw0KGgo="> <link rel="icon" href="data:;base64,iVBORw0KGgo=">
<title>React Native Debugger</title> <title>React Native Debugger</title>
<script> <script>
function toggleDark() {
const shortcutRule = document.styleSheets[0]['cssRules'][1]
const contentRule = document.styleSheets[0]['cssRules'][2]
if (document.getElementById("dark").checked) {
shortcutRule.style.color = '#777'
contentRule.style.color = '#666'
contentRule.style.backgroundColor = '#242424'
} else {
shortcutRule.style.color = '#eee'
contentRule.style.color = ''
contentRule.style.backgroundColor = ''
}
}
/* eslint-env browser */ /* eslint-env browser */
(function() { (function() {
@ -170,6 +183,7 @@ connectToDebuggerProxy();
</head> </head>
<body> <body>
<div class="content"> <div class="content">
<input type="checkbox" id="dark" onclick="toggleDark()"> Dark background
<p> <p>
React Native JS code runs inside this Chrome tab. React Native JS code runs inside this Chrome tab.
</p> </p>