🚀 RELEASE: Wild & dark theme

ortoniKC · Sep 25, 2023 · 0a67779 · 0a67779
1 parent a9de61d
commit 0a67779
Show file tree

Hide file tree

Showing 7 changed files with 28 additions and 25 deletions.
diff --git a/app/styles/main.css b/app/styles/main.css
@@ -998,7 +998,7 @@ textarea.form-input.input-sm {
 }
 
 .form-select:not([multiple]):not([size]) {
-  background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center/.4rem .5rem;
+  background: #303742 url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center/.4rem .5rem;
   padding-right: 1.2rem;
 }
 

diff --git a/manifest.json b/manifest.json
@@ -3,7 +3,7 @@
   "short_name": "XPath finder",
   "description": "XPath Finder, simple and useful, open-source project by LetCode with Koushik",
   "author": "Koushik Chatterjee",
-  "version": "2.0.2",
+  "version": "2.0.3",
   "manifest_version": 2,
   "icons": {
     "16": "assets/16.png",

diff --git a/option/option.html b/option/option.html
@@ -12,7 +12,7 @@
     </style>
 </head>
 
-<body>
+<body class="bg-dark">
     <main>
         <section class="container">
             <div class="columns">
@@ -26,7 +26,7 @@ <h1>Code snippet</h1>
                     </div>
                     <br>
                     <div class="container p-centered">
-                        <div class="form-group">
+                        <div class="form-group bg-dark">
                             <select class="form-select" id="snippets">
                                 <option>Choose an option</option>
                                 <option value="playwrightJava">Playwright - Java</option>

diff --git a/package.json b/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "LetX - XPath Finder",
+  "name": "LetXPath - XPath Finder",
   "version": "1.0.0",
   "description": "Open-source project - XPath Finder",
   "main": "index.js",
@@ -17,4 +17,4 @@
   "devDependencies": {
     "jquery": "^3.5.1"
   }
-}
+}
diff --git a/panel/panel.html b/panel/panel.html
@@ -109,25 +109,28 @@
     <div class="toast toast-success d-hide">
     </div>
   </div>
-  <div class="container grid-lg" id="tab_container">
-    <div class="container_item card active" data-item="1">
+  <div class="container grid-lg bg-dark" id="tab_container">
+    <div class="container_item card active bg-dark" data-item="1">
       <div class="card-body" id="addXPath">
-        <div class="empty">
-          <p class="empty-title h5">Please select any element to get XPath/CSS</p>
+        <div class="empty bg-dark">
+          <p class="empty-title h5">Please select any element to get XPath</p>
           <p class="empty-subtitle">more new patterns coming soon :)</p>
         </div>
       </div>
     </div>
     <!-- CSS -->
-    <div class="container_item card" data-item="2">
+    <div class="container_item card bg-dark" data-item="2">
       <div class="card-body" id="cssbody">
-        CSS
+        <div class="empty bg-dark">
+          <p class="empty-title h5">Please select any element to get CSS</p>
+          <p class="empty-subtitle">more new patterns coming soon :)</p>
+        </div>
       </div>
     </div>
     <!-- Axes -->
-    <div class="container_item card" data-item="3">
+    <div class="container_item card bg-dark" data-item="3">
       <div class="card-body" id="anchorXPath">
-        <div class="empty">
+        <div class="empty bg-dark">
           <p class="empty-title h5">Please use the context menu (Right click on page) to select parent & child element
           </p>
           <p class="empty-subtitle">You can switch between XPath, CSS & Axes any time :)</p>

diff --git a/panel/panel.js b/panel/panel.js
@@ -26,7 +26,7 @@ chrome.runtime.onMessage.addListener((req, rec, res) => {
         buildCSSUI(req)
       } else {
         jQuery("#cssbody").empty();
-        let ui = `<div class="empty">
+        let ui = `<div class="empty bg-dark">
           <p class="empty-title h5">Please select any element to get CSS/XPath</p>
           <p class="empty-subtitle">more new patterns coming soon :)</p>
           <p class="empty-subtitle">Did you know LetXPath is an open-source, if you found something wrong fix it :)</p>
@@ -35,7 +35,7 @@ chrome.runtime.onMessage.addListener((req, rec, res) => {
       }
       if (req.xpathid.length == 0) {
         jQuery("#addXPath").empty();
-        let ui = `<div class="empty">
+        let ui = `<div class="empty bg-dark">
           <p class="empty-title h5">Please select any element to get XPath/CSS</p>
           <p class="empty-subtitle">more new patterns coming soon :)</p>
           <p class="empty-subtitle">Did you know LetXPath is an open-source, if you found something wrong fix it :)</p>
@@ -48,7 +48,7 @@ chrome.runtime.onMessage.addListener((req, rec, res) => {
       jQuery("#addXPath").empty();
       document.getElementById("cssbadge").attributes.getNamedItem('data-badge').value = 0;
       jQuery("#cssbody").empty();
-      let ui = `<div class="empty">
+      let ui = `<div class="empty bg-dark">
           <p class="empty-title h5">Please select any element to get XPath/CSS</p>
           <p class="empty-subtitle">more new patterns coming soon :)</p>
           <p class="empty-subtitle">Did you know LetXPath is an open-source, if you found something wrong fix it :)</p>
@@ -181,11 +181,11 @@ function targetElement(element) {
 function buildUI(data) {
   jQuery("#addXPath").empty();
   if (data.webtabledetails != null) {
-    let table = `<div class="form-horizontal bg-gray">
+    let table = `<div class="form-horizontal bg-dark">
       <span class="label label-rounded sm label-primary">Table Info - Total no.of table ${data.webtabledetails.totalTables}</span>
       <div class="form-group">
         <div class="col-11">
-        <span class="label label-rounded label-secondary sm">Table unique locator</span>
+        <span class="label label-rounded label-success sm">Table unique locator</span>
           <code class="form-label" id="tablelocator">${data.webtabledetails.tableLocator}</code>
         </div>
         <div class="col-1 p-centered text-center">
@@ -196,7 +196,7 @@ function buildUI(data) {
       </div>
       <div class="form-group">
         <div class="col-11">
-          <span class="label label-rounded label-secondary sm">Locator for selected row</span>
+          <span class="label label-rounded label-success sm">Locator for selected row</span>
           <code class="form-label" id="tabledata">${data.webtabledetails.tableData}</code>
         </div>
         <div class="col-1 p-centered text-center">
@@ -216,14 +216,14 @@ function buildUI(data) {
 }
 // -------- Build XPath UI ---------
 function generateXPathUI(data, i) {
-  let ui = `<div class="form-horizontal">
-    <span class="label label-secondary label-rounded sm">${i + 1}. ${data.xpathid[i][1]}</span>
+  let ui = `<div class="form-horizontal bg-dark">
+    <span class="label label-success label-rounded sm">${i + 1}. ${data.xpathid[i][1]}</span>
     <div class="form-group">
       <div class="col-10 c-hand" id="xpathVal" data-copytarget="#xpath${i}">
         <code class="form-label tooltip tooltip-top" id="xpath${i}" data-copytarget="#xpath${i}" data-tooltip="Click to copy">${data.xpathid[i][2]}</code>
       </div>
       <div class="col-2 tooltip tooltip-top" data-tooltip="Copy Snippet">
-        <select class="form-select select-sm" id="snippetsSelector">${getSelectionValues(data, i, data.xpathid, false)}</select>
+      <div class="form-group bg-dark"><select class="form-select select-sm " id="snippetsSelector">${getSelectionValues(data, i, data.xpathid, false)}</select></div>
       </div>
     </div>
   </div>`;
@@ -277,7 +277,7 @@ function buildCSSUI(data) {
   let ui = '';
   for (let i = 0; i < data.cssPath.length; i++) {
     ui += `<div class="form-horizontal">
-      <span class="label label-rounded label-secondary sm">${i + 1}. ${data.cssPath[i][1]}</span>
+      <span class="label label-rounded label-success sm">${i + 1}. ${data.cssPath[i][1]}</span>
         <div class="form-group">
           <div class="col-10 tooltip tooltip-top" id="xpathVal" data-tooltip="Click to copy" data-copytarget="#css${i}">
             <code class="form-label" id="css${i}" data-copytarget="#css${i}">${data.cssPath[i][2]}</code>

diff --git a/popup/popup.html b/popup/popup.html
@@ -70,7 +70,7 @@
         <p><a href="https://github.com/ortoniKC/LetXPath/blob/dev/privacy.md" target="_blank">Privacy Policy</a></p>
       </div>
       <div class="text-center">
-        <p>Copyright © 2022 <a href="https://www.linkedin.com/in/ortoni/" target="_blank">Koushik Chatterjee</a>
+        <p>Copyright © 2023 <a href="https://www.linkedin.com/in/ortoni/" target="_blank">Koushik Chatterjee</a>
         </p>
       </div>
     </div>