move log

10 files changed, 18 insertions, 28 deletions

diff --git a/Blog/Components/Pages/Calc.razor b/Blog/Components/Pages/Calc.razor
index 942d9a9..295daf6 100644
--- a/Blog/Components/Pages/Calc.razor
+++ b/Blog/Components/Pages/Calc.razor
@@ -8,9 +8,7 @@
         <input id="input" type="text" placeholder="1 2 +" />
         <input type="submit" value="Evaluate">
     </form>
-    <div>
-        <div id="log"></div>
-    </div>
+    <Log/>
 
     <fieldset class="docs">
         <legend>Available stack operations</legend>
diff --git a/Blog/Components/Pages/Concat.razor b/Blog/Components/Pages/Concat.razor
index 856d4e0..4c59211 100644
--- a/Blog/Components/Pages/Concat.razor
+++ b/Blog/Components/Pages/Concat.razor
@@ -7,9 +7,7 @@
         <textarea id="input" placeholder="1 2 +" rows="5"></textarea>
         <input type="submit" value="Run program">
     </form>
-    <div>
-        <div id="log"></div>
-    </div>
+    <Log/>
 
     <fieldset class="docs">
         <legend>Predefined operations</legend>
diff --git a/Blog/Components/Pages/Generator.razor b/Blog/Components/Pages/Generator.razor
index 52d9d1a..80bb1e9 100644
--- a/Blog/Components/Pages/Generator.razor
+++ b/Blog/Components/Pages/Generator.razor
@@ -6,7 +6,5 @@
     <button id="bsn">Generate BSN</button>
     <!-- <button id="iban">Generate IBAN</button> -->
 
-    <div>
-        <div id="log"></div>
-    </div>
+    <Log/>
 </main>
\ No newline at end of file
diff --git a/Blog/Components/Pages/Home.razor b/Blog/Components/Pages/Home.razor
index be924d5..91d6931 100644
--- a/Blog/Components/Pages/Home.razor
+++ b/Blog/Components/Pages/Home.razor
@@ -4,7 +4,4 @@
 
 <main>
     <p>A couple of JS/HTML experiments.</p>
-    <div>
-        <div id="log"></div>
-    </div>
 </main>
\ No newline at end of file
diff --git a/Blog/Components/Pages/Letterflixd.razor b/Blog/Components/Pages/Letterflixd.razor
index b6a088a..7deef04 100644
--- a/Blog/Components/Pages/Letterflixd.razor
+++ b/Blog/Components/Pages/Letterflixd.razor
@@ -20,11 +20,5 @@
             </div>
         </fieldset>
     </form>
-    <div>
-        <label for="debug">
-            Show debug log
-            <input type="checkbox" id="debug">
-        </label>
-        <div id="log"></div>
-    </div>
+    <Log/>
 </main>
\ No newline at end of file
diff --git a/Blog/Components/Pages/Note.razor b/Blog/Components/Pages/Note.razor
index 531adcf..0871386 100644
--- a/Blog/Components/Pages/Note.razor
+++ b/Blog/Components/Pages/Note.razor
@@ -4,5 +4,5 @@
 
 <main>
     <textarea id="input" style="height:60vh" autofocus></textarea>
-    <div id="log"></div>
+    <Log/>
 </main>
\ No newline at end of file
diff --git a/Blog/Components/Pages/QRCodeGenerator.razor b/Blog/Components/Pages/QRCodeGenerator.razor
index 07c651e..5eb0166 100644
--- a/Blog/Components/Pages/QRCodeGenerator.razor
+++ b/Blog/Components/Pages/QRCodeGenerator.razor
@@ -5,7 +5,5 @@
 <main>
     <textarea id="input" rows="5" autofocus>https://bes.is/</textarea>
     <div id="qrcode"></div>
-    <div>
-        <div id="log"></div>
-    </div>
+    <Log/>
 </main>
\ No newline at end of file
diff --git a/Blog/Components/Pages/QRCodeScan.razor b/Blog/Components/Pages/QRCodeScan.razor
index 292a8e8..8a99bde 100644
--- a/Blog/Components/Pages/QRCodeScan.razor
+++ b/Blog/Components/Pages/QRCodeScan.razor
@@ -4,7 +4,5 @@
 
 <main>
     <video id="video"></video>
-    <div>
-        <div id="log"></div>
-    </div>
+    <Log/>
 </main>
\ No newline at end of file
diff --git a/Blog/Components/_Shared/Log.razor b/Blog/Components/_Shared/Log.razor
new file mode 100644
index 0000000..588f293
--- /dev/null
+++ b/Blog/Components/_Shared/Log.razor
@@ -0,0 +1,7 @@
+<div>
+    <label for="debug">
+        Show debug log
+        <input type="checkbox" id="debug">
+    </label>
+    <div id="log"></div>
+</div>
\ No newline at end of file
diff --git a/Blog/wwwroot/app.css b/Blog/wwwroot/app.css
index 0065fd6..913195b 100644
--- a/Blog/wwwroot/app.css
+++ b/Blog/wwwroot/app.css
@@ -272,9 +272,11 @@ input[type="checkbox"] {
     appearance: none;
 }
 input[type="checkbox"]:checked::after {
-    content: "[x]"
+    content: "[x]";
+    color: var(--color);
 }
 
 input[type="checkbox"]::after {
-    content: "[ ]"
+    content: "[ ]";
+    color: var(--color);
 }
\ No newline at end of file