stylistic changes, fixed webpack.config.js for development

src/taskpane/taskpane.css

@@ -100,7 +100,7 @@ b {
     font-size: large;
     border-radius: 0px 5px 5px 0px;
     color: white;
-    background-color: #cc0033;
+    background-color: #CC0033;
     font-weight: bold;
     transition: 0.1s all;
 }
@@ -141,7 +141,7 @@ b {
     padding: 10px 15px;
     font-size: small;
     color: white;
-    background-color: #ff5b5b;
+    background-color: #CC0033;
     transition: 0.1s all;
     text-align: left;
 }
@@ -232,7 +232,7 @@ b {
 #inserted-tracking-pixels-container div {
     width: 100%;
     border-radius: 8px;
-    /* background-color: #ff5b5b; */
+    /* background-color: #CC0033; */
     /* color: white; */
     display: flex;
     flex-direction: row;
@@ -249,12 +249,16 @@ b {
     cursor: pointer;
 }
 
+#inserted-tracking-pixels-container div:active {
+    transform: scale(0.97);
+}
+
 #inserted-tracking-pixels-container div::before {
     content: " ";
     width: 10px;
     height: 10px;
     border-radius: 50%;
-    background-color: #ff5b5b;
+    background-color: #CC0033;
     margin-left: 10px;
 }
 
@@ -300,7 +304,7 @@ b {
     position: relative;
     color: white;
     font-weight: bold;
-    background-color: #ff5b5b;
+    background-color: #CC0033;
     border-radius: 8px;
     padding: 8px 10px;
     transition: 0.2s all;

src/taskpane/taskpane.html

@@ -24,7 +24,7 @@
     <section id="sideload-msg" class="ms-welcome__main">
         <h2 class="ms-font-xl">Please <a target="_blank" href="https://learn.microsoft.com/office/dev/add-ins/testing/test-debug-office-add-ins#sideload-an-office-add-in-for-testing">sideload</a> your add-in to see app body.</h2>
     </section>
-    <img src="../../assets/RUTGERS_H_RED_BLACK_RGB.png"  alt="" style="width: 60%; margin: 5px">
+    <!-- <img src="../../assets/RUTGERS_H_RED_BLACK_RGB.png"  alt="" style="width: 60%; margin: 5px"> -->
     <main id="app-body" class="ms-welcome__main" style="display: none;">
         <h2 class="ms-font-xl bold"> Enter Tracking Pixel URL </h2>
         <div style="width:100%;">

src/taskpane/taskpane.ts

@@ -117,6 +117,15 @@ Office.onReady((info) => {
       insertLock = true;
       insert();
     };
+
+    let textItem = document.getElementById("tracking-pixel-url") as HTMLInputElement;
+    textItem.addEventListener("keyup", function (event) {
+      if (event.key === "Enter") {
+        event.preventDefault();
+        insertButton.click();
+      }
+    });
+
     setInterval(loadTrackingPixels, 500);
 
     setupInstructionDropdown();
@@ -129,6 +138,7 @@ export async function insert() {
   const urlItem = document.getElementById("tracking-pixel-url") as HTMLInputElement;
   urlItem.value = urlItem.value.trim();
   let error = false;
+
   if (!urlItem.value.match(/(https|http):\/\//)) {
     Office.context.mailbox.item.notificationMessages.replaceAsync("notify", {
       type: "informationalMessage",

webpack.config.js

@@ -14,7 +14,7 @@ async function getHttpsOptions() {
 module.exports = async (env, options) => {
   const dev = options.mode === "development";
 
-  if (!env.urlProd) {
+  if (!env.urlProd && !dev) {
     throw new Error("urlProd is required");
   }