From 0ebeb644940c613b359e04de65a2f45533b5adcc Mon Sep 17 00:00:00 2001
From: didierfred <didierfred@gmail.com>
Date: Fri, 9 Feb 2018 15:17:41 +0100
Subject: [PATCH] review UI design
---
popup/config.html | 56 ++++++++++++++++++++++++-----------------------
popup/config.js | 6 ++---
popup/menu.js | 5 +++--
3 files changed, 35 insertions(+), 32 deletions(-)
diff --git a/popup/config.html b/popup/config.html
index 43c5680..e2813fc 100644
--- a/popup/config.html
+++ b/popup/config.html
@@ -9,7 +9,7 @@
background-color: #008CBA; /* Blue */
border: none;
color: white;
- padding: 1px 5px;
+ padding: 5px 5px;
text-align: center;
text-decoration: none;
display: inline-block;
@@ -20,6 +20,10 @@
background-color: #0070A0;
}
+.input_field{
+ font-size: 14px;
+ padding: 1px 5px;
+}
.colonne{
background-color: #008CBA; /* Blue */
@@ -33,35 +37,29 @@ color: #008CBA;
</head>
<body>
-
<table>
-<tr>
+<tr><td>
+
+
+
+<h2 class="title"> SIMPLE MODIFY HEADERS
+
+<img id="start_img" src="img/start.png" align="right" valign="top"> </img>
+</h2>
+
+</td></tr>
+<tr><td>
-<td width="680" align="left">
-<h2 class="title"> SIMPLE MODIFY HEADERS </h2>
-</td>
-<td width="50">
-<br>
-<img id="start_img" src="img/start.png" align="left" valign="top"> </img>
-<br>
-</td>
-</tr>
-</table>
-<br>
-<table>
-<tr>
-<td width="450">
- Url Pattern* : <input size="50" id="targetPage" type="text" value="">
-</td>
-
-<td width="270" align="right">
-<input type="button" class="button" style="width:100px" id="export_button" value="Export"></input> 
-<input type="button" class="button" style="width:100px" id="import_button" value="Import"></input>
-</td>
-</tr>
-</table>
+ Url Pattern* : <input size="50" id="targetPage" class="input_field" type="text" value="">
+
+
+<input align="right" type="button" class="button" style="width:100px" id="export_button" value="Export"></input> 
+<input align="right" type="button" class="button" style="width:100px" id="import_button" value="Import"></input>
+
+</td></tr>
+<tr><td>
<br>
<br>
@@ -74,6 +72,9 @@ color: #008CBA;
<td> Status </td>
</tr>
</table>
+
+</td></tr>
+<tr><td>
<center>
<br>
<input type="button" class="button" style="width:100px" id="add_button" value="Add new line" ></input>
@@ -82,7 +83,8 @@ color: #008CBA;
<br>
</center>
</i> * Informations on url pattern can be found <a href="https://developer.chrome.com/extensions/match_patterns" target="_blank"> here </a> </i>
-
+</td></tr>
+</table>
<iframe id="download" width="0" height="0" frameBorder="0">
</iframe>
diff --git a/popup/config.js b/popup/config.js
index 289824c..5e3e784 100644
--- a/popup/config.js
+++ b/popup/config.js
@@ -30,9 +30,9 @@ window.onload = function() {
function appendLine(action,header_name,header_value,comment,status) {
var html = "<td><select id=\"select_action" + line_number + "\" disable=false><option value=\"add\">add</option><option value=\"modify\">modify</option><option value=\"delete\">delete</option></select></td>";
-html = html + "<td><input id=\"header_name"+ line_number + "\"></input></td>";
-html = html + "<td><input size=\"30\" id=\"header_value"+ line_number + "\"></input></td>";
-html = html + "<td><input size=\"30\" id=\"comment"+ line_number + "\"></input></td>";
+html = html + "<td><input class=\"input_field\" size=\"15\" id=\"header_name"+ line_number + "\"></input></td>";
+html = html + "<td><input class=\"input_field\" size=\"20\" id=\"header_value"+ line_number + "\"></input></td>";
+html = html + "<td><input class=\"input_field\" size=\"20\" id=\"comment"+ line_number + "\"></input></td>";
html = html + "<td><select id=\"select_status" + line_number + "\"><option value=\"on\"> on </option><option value=\"off\">off</option></select></td>";
html = html + "<td><input class=\"button\" type=\"button\" value=\"Delete\" id=\"delete_button" + line_number + "\"></input> </td>";
diff --git a/popup/menu.js b/popup/menu.js
index dcb4a17..b90cdc7 100644
--- a/popup/menu.js
+++ b/popup/menu.js
@@ -41,6 +41,7 @@ function start_modify()
function start_config()
{
- var strWindowFeatures = "menubar=no,location=no,resizable=yes,scrollbars=yes,status=no,width=800,height=600";
- window.open("config.html","Simple Modify Headers",strWindowFeatures);
+ //var strWindowFeatures = "menubar=no,location=no,resizable=yes,scrollbars=yes,status=no,width=800,height=600";
+ // window.open("config.html","Simple Modify Headers",strWindowFeatures);
+ browser.tabs.create({url:"config.html"});
}
--
GitLab