From 325c5b0fe1b20d3cd03bb4dd2812ff345c2ef9f9 Mon Sep 17 00:00:00 2001
From: CheddarCrisp <cheddar@crispbyte.dev>
Date: Tue, 3 Mar 2020 22:21:43 -0500
Subject: [PATCH] Some style changes Add input mode to number fields

---
 src/ncounter/About.svelte   | 6 +++---
 src/ncounter/App.svelte     | 4 ++--
 src/ncounter/Counter.svelte | 6 +++---
 src/ncounter/site.css       | 4 ++--
 4 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/src/ncounter/About.svelte b/src/ncounter/About.svelte
index 70f57d8..dd0bfaa 100644
--- a/src/ncounter/About.svelte
+++ b/src/ncounter/About.svelte
@@ -19,7 +19,7 @@ const dispatch = createEventDispatcher();
 .about {
     background-color: var(--background-primary);
     color: var(--text-primary);
-    
+
     position: fixed;
     top: 0;
     right: 0;
@@ -56,8 +56,8 @@ h2 {
 
 .close {
     position: absolute;
-    top: 15px;
-    right: 15px;
+    top: 0;
+    right: 0;
 }
 
 .licenses {
diff --git a/src/ncounter/App.svelte b/src/ncounter/App.svelte
index dc7c38c..07bc046 100644
--- a/src/ncounter/App.svelte
+++ b/src/ncounter/App.svelte
@@ -13,8 +13,8 @@
 <div class="dialog">
     <div class="dialog-content">
         <label>Name<input type="text" bind:value={newCounter.title} use:focus/></label>
-        <label>Initial Value<input type="number" bind:value={newCounter.initialValue} /></label>
-        <label>Target<input type="number" bind:value={newCounter.max} /></label>
+        <label>Initial Value<input type="number" inputmode="decimal" bind:value={newCounter.initialValue} /></label>
+        <label>Target<input type="number" inputmode="decimal" bind:value={newCounter.max} /></label>
         <label>Save history<input type="checkbox" bind:checked={newCounter.saveHistory} /></label>
         <button on:click={ () => { showAddDialog = false; } }>Cancel</button>
         <button class="ok" on:click={ add }>OK</button>
diff --git a/src/ncounter/Counter.svelte b/src/ncounter/Counter.svelte
index b3b48d0..115bdec 100644
--- a/src/ncounter/Counter.svelte
+++ b/src/ncounter/Counter.svelte
@@ -18,7 +18,7 @@
     <div class="dialog">
         <div class="dialog-content">
             <h1>{ showIncrement ? "Add" : "Set" }</h1>
-            <input class="dialog-value" type="number" bind:value={ dialogValue } use:focus />
+            <input class="dialog-value" type="number" inputmode="decimal" bind:value={ dialogValue } use:focus />
             <button on:click={ dialogCancel }>Cancel</button>
             <button class="ok" on:click={ dialogDone }>OK</button>
         </div>
@@ -28,8 +28,8 @@
     <div class="dialog">
         <div class="dialog-content">
             <label>Name<input type="text" bind:value={editingCounter.title} use:focus/></label>
-            <label>Initial Value<input type="number" bind:value={editingCounter.initialValue} /></label>
-            <label>Target<input type="number" bind:value={editingCounter.max} /></label>
+            <label>Initial Value<input type="number" inputmode="decimal" bind:value={editingCounter.initialValue} /></label>
+            <label>Target<input type="number" inputmode="decimal" bind:value={editingCounter.max} /></label>
             <label>Save history<input type="checkbox" bind:checked={editingCounter.saveHistory} /></label>
             <button on:click={ () => { showEditDialog = false; } }>Cancel</button>
             <button class="ok" on:click={ finishEdit }>OK</button>
diff --git a/src/ncounter/site.css b/src/ncounter/site.css
index d644e8e..02bb4e1 100644
--- a/src/ncounter/site.css
+++ b/src/ncounter/site.css
@@ -52,8 +52,8 @@ button {
     
     color: var(--text-primary);
 
-    width: 36px;
-    height: 36px;
+    width: 40px;
+    height: 40px;
 
     display: flex;
     align-items: center;