Merge pull request #20 from MrCull/improve_appearance

copy to clipboard control

Author: MrCull

.gitignore

@@ -35,6 +35,7 @@ bld/
 
 # Visual Studio 2015/2017 cache/options directory
 .vs/
+.vscode/
 # Uncomment if you have tasks that create the project's static files in wwwroot
 #wwwroot/
 

MyDevTools/Components/Pages/BranchNameFormatter.razor

@@ -13,28 +13,18 @@
             </div>
 
             <button class="btn btn-primary btn-block" @onclick="FormatGitBranchName">Format Git Branch Name</button>
-            <button class="btn btn-success btn-block" @onclick="CopyToClipboard">Copy to Clipboard</button>
         </div>
     </div>
 
     @if (!string.IsNullOrEmpty(formattedString))
     {
-        <div class="row mt-4">
-            <div class="col-md-6 offset-md-3">
-                <div class="alert alert-success" role="alert">
-                    <strong>Formatted Branch Name:</strong>
-                    <textarea readonly class="form-control" rows="3">@formattedString</textarea>
-                    <div class="mt-2 text-success">@copyConfirmationMessage</div>
-                </div>
-            </div>
-        </div>
+        <OutputAndCopyToClipboard OutputText="@formattedString" />
     }
 </div>
 
 @code {
     private string inputString = "Feature 12345 : Example work item name";
     private string formattedString = "";
-    private string copyConfirmationMessage = "";
 
     protected override async Task OnInitializedAsync()
     {
@@ -59,17 +49,4 @@
             formattedString = "Error: " + ex.Message;
         }
     }
-
-    private async Task CopyToClipboard()
-    {
-        try
-        {
-            await ClipboardService.CopyToClipboardAsync(formattedString);
-            copyConfirmationMessage = "Text copied to clipboard!";
-        }
-        catch (Exception ex)
-        {
-            copyConfirmationMessage = "Error: " + ex.Message;
-        }
-    }
 }

MyDevTools/Components/Pages/ColorPickerConverter.razor

@@ -21,10 +21,7 @@
                 </select>
             </div>
 
-            <div class="alert alert-success" role="alert">
-                <strong>Converted Color:</strong>
-                <pre>@convertedColor</pre>
-            </div>
+            <OutputAndCopyToClipboard OutputText="@convertedColor" />
         </div>
     </div>
 </div>

MyDevTools/Components/Pages/Components/DiffOutput.razor.css

@@ -2,8 +2,8 @@
 .line-numbers {
     counter-reset: line-number;
     font-family: 'Courier New', monospace;
-    background-color: #f4f4f4;
-    border: 1px solid #ccc;
+    background-color: var(--background-color);
+    border: 1px solid var(--border-color);
     padding: 10px;
     line-height: 1;
     margin: 0;

MyDevTools/Components/Pages/ContainerIds.razor

@@ -20,20 +20,13 @@
 
             <div class="d-flex justify-content-between">
                 <button class="btn btn-primary btn-block" @onclick="GenerateCodes">Generate Ids</button>
-                <button class="btn btn-success btn-block" @onclick="CopyToClipboard">Copy To Clipboard</button>
             </div>
         </div>
     </div>
 
     @if (!string.IsNullOrEmpty(generatedCodes))
     {
-        <div class="row mt-4">
-            <div class="col-md-6 offset-md-3">
-                <label>Generated Codes:</label>
-                <textarea readonly class="form-control monospace-font" style="width: 180px;" rows="6">@generatedCodes</textarea>
-                <div class="mt-2 text-success">@copyConfirmationMessage</div>
-            </div>
-        </div>
+        <OutputAndCopyToClipboard OutputText="@generatedCodes" />
     }
 </div>
 
@@ -107,18 +100,4 @@
         }
         return sum % 11 % 10;
     }
-
-
-    private async Task CopyToClipboard()
-    {
-        try
-        {
-            await ClipboardService.CopyToClipboardAsync(generatedCodes);
-            copyConfirmationMessage = "Text copied to clipboard!";
-        }
-        catch (Exception ex)
-        {
-            Console.WriteLine(ex.Message);
-        }
-    }
 }

MyDevTools/Components/Pages/ContainerIds.razor.css

@@ -59,21 +59,12 @@
             </div>
 
             <button class="btn btn-primary btn-block" @onclick="GenerateCronExpression">Generate Cron Expression</button>
-            <button class="btn btn-success btn-block" @onclick="CopyToClipboard">Copy to Clipboard</button>
         </div>
     </div>
 
     @if (!string.IsNullOrEmpty(cronExpression))
     {
-        <div class="row mt-4">
-            <div class="col-md-10 offset-md-1">
-                <div class="alert alert-success" role="alert">
-                    <strong>Generated Cron Expression:</strong>
-                    <textarea readonly id="cronExpression" class="form-control" rows="3">@cronExpression</textarea>
-                    <div class="mt-2 text-success">@copyConfirmationMessage</div>
-                </div>
-            </div>
-        </div>
+        <OutputAndCopyToClipboard OutputText="@cronExpression" />
     }
 </div>
 
@@ -106,17 +97,4 @@
             cronExpression = "Error: " + ex.Message;
         }
     }
-
-    private async Task CopyToClipboard()
-    {
-        try
-        {
-            await ClipboardService.CopyToClipboardAsync(cronExpression);
-            copyConfirmationMessage = "Cron expression copied to clipboard!";
-        }
-        catch (Exception ex)
-        {
-            copyConfirmationMessage = "Error: " + ex.Message;
-        }
-    }
 }

MyDevTools/Components/Pages/CronGenerator.razor

@@ -23,20 +23,12 @@
             </div>
 
             <button class="btn btn-primary btn-block" @onclick="GenerateGUID">Generate GUID</button>
-            <button class="btn btn-success btn-block" @onclick="CopyToClipboard">Copy to Clipboard</button>
         </div>
     </div>
 
     @if (guidResults != null && guidResults.Count > 0)
     {
-        <div class="row mt-4">
-            <div class="col-md-6 offset-md-3">
-                <div class="alert alert-success" role="alert">
-                    <strong>GUID Results:</strong>
-                    <pre>@string.Join("\n", guidResults)</pre>
-                </div>
-            </div>
-        </div>
+        <OutputAndCopyToClipboard OutputText="@string.Join("\n", guidResults)" />
     }
 </div>
 
@@ -71,16 +63,4 @@
             guidResults.Add(guid);
         }
     }
-
-    private async Task CopyToClipboard()
-    {
-        try
-        {
-            await ClipboardService.CopyToClipboardAsync(string.Join("\n", guidResults));
-        }
-        catch (Exception ex)
-        {
-            Console.WriteLine("Failed to copy to clipboard: " + ex.Message);
-        }
-    }
 }

MyDevTools/Components/Pages/GuidGenerator.razor

@@ -29,14 +29,7 @@
 
     @if (!string.IsNullOrEmpty(hashResult))
     {
-        <div class="row mt-4">
-            <div class="col-md-6 offset-md-3">
-                <div class="alert alert-success" role="alert">
-                    <strong>Hash Result:</strong>
-                    <pre>@hashResult</pre>
-                </div>
-            </div>
-        </div>
+        <OutputAndCopyToClipboard OutputText="@hashResult" />
     }
 </div>
 

MyDevTools/Components/Pages/HashGenerator.razor

@@ -4,6 +4,7 @@
 
 
 <label for="inputQuery">Input JSON (rest assured, your data stays on your device):</label>
+<br />
 <iframe id="myiframe" src="iframepages/jsonformatter.html" height="650px" width="1050px" scrolling="no" />