cleanup
This commit is contained in:
parent
b73ab237e3
commit
d90a3218b2
181
jsdev/index.html
181
jsdev/index.html
@ -66,32 +66,42 @@
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style>
|
<style>
|
||||||
|
|
||||||
|
td {
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
table {
|
table {
|
||||||
border: 1px solid;
|
border: 2px solid;
|
||||||
}
|
}
|
||||||
|
|
||||||
thead {
|
thead {
|
||||||
background-color: orange;
|
background-color: orange;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
h1.page-title {
|
||||||
|
background-color: orange;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
.outer {
|
.outer {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
background: grey;
|
background: grey;
|
||||||
}
|
}
|
||||||
.multiline {
|
|
||||||
text-align: left;
|
|
||||||
padding: 5px;
|
|
||||||
padding-left: 15px;
|
|
||||||
}
|
|
||||||
.inner {
|
.inner {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
border: 1px solid;
|
border: 2px solid;
|
||||||
background: white;
|
background-color: lightyellow;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
justify-content: center;
|
justify-content: space-around;
|
||||||
margin: 10px;
|
margin: 10px;
|
||||||
// flex: 1 0 0;
|
|
||||||
width: 1200px;
|
width: 1200px;
|
||||||
}
|
}
|
||||||
.m41-box {
|
.m41-box {
|
||||||
@ -101,6 +111,13 @@
|
|||||||
// background-color: lightblue;
|
// background-color: lightblue;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.multiline {
|
||||||
|
text-align: left;
|
||||||
|
padding: 5px;
|
||||||
|
padding-left: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
#web-cfg-matches {
|
#web-cfg-matches {
|
||||||
width: 90%;
|
width: 90%;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
@ -113,6 +130,7 @@
|
|||||||
#web-cfg-matches tbody tr:nth-of-type(even) {
|
#web-cfg-matches tbody tr:nth-of-type(even) {
|
||||||
background: lightgrey;
|
background: lightgrey;
|
||||||
}
|
}
|
||||||
|
|
||||||
#web-cfg-boxes {
|
#web-cfg-boxes {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
width: 90%;
|
width: 90%;
|
||||||
@ -123,11 +141,6 @@
|
|||||||
// background-color: blue;
|
// background-color: blue;
|
||||||
}
|
}
|
||||||
|
|
||||||
#web-cfg-boxes tbody tr td {
|
|
||||||
margin: 10px;
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#web-cfg-boxes tbody:nth-of-type(odd) {
|
#web-cfg-boxes tbody:nth-of-type(odd) {
|
||||||
background: lightblue;
|
background: lightblue;
|
||||||
}
|
}
|
||||||
@ -165,46 +178,19 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
#web-cfg-boxes tbody:only-of-type tr td.box div.dummy {
|
#web-cfg-boxes tbody:only-of-type tr td.box div.dummy {
|
||||||
display: block;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
td th {
|
td.box {
|
||||||
padding: 5px;
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.m41-box-info {
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: 4fr 2fr 5fr;
|
|
||||||
// align-items: stretch;
|
|
||||||
// justify-content: space-around;
|
|
||||||
// background-color: grey;
|
|
||||||
}
|
|
||||||
.button-group {
|
.button-group {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
// grid-template-columns: 1fr 1fr 1fr;
|
|
||||||
// align-items: stretch;
|
|
||||||
// display: inline-flex;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.m41-box-rule:only-child div.button-group button{
|
|
||||||
// display: none;
|
|
||||||
visibility: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.m41-box:only-child div div.button-group button{
|
|
||||||
// display: none;
|
|
||||||
visibility: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.m41-box-rule {
|
|
||||||
display: flex;
|
|
||||||
// grid-template-columns: 1fr 3fr 1fr 1fr;
|
|
||||||
align-items: center;
|
|
||||||
justify-items: center;
|
|
||||||
// background-color: lightblue;
|
|
||||||
}
|
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
<script type="application/javascript">
|
<script type="application/javascript">
|
||||||
"use strict"
|
"use strict"
|
||||||
@ -294,7 +280,7 @@
|
|||||||
] = box.children
|
] = box.children
|
||||||
|
|
||||||
box_text.value = box_name
|
box_text.value = box_name
|
||||||
|
|
||||||
const [first_rule, ...rest] = rules
|
const [first_rule, ...rest] = rules
|
||||||
|
|
||||||
const {match_name, negate = false, stop = false} = first_rule
|
const {match_name, negate = false, stop = false} = first_rule
|
||||||
@ -377,7 +363,7 @@
|
|||||||
<option value="addr_rexs">List of regexes for addresses</option>
|
<option value="addr_rexs">List of regexes for addresses</option>
|
||||||
</select>
|
</select>
|
||||||
</td>
|
</td>
|
||||||
<td contentEditable class="multiline" ></td>
|
<td contentEditable class="multiline"></td>
|
||||||
</tr>
|
</tr>
|
||||||
</template>
|
</template>
|
||||||
<template id="web-cfg-box">
|
<template id="web-cfg-box">
|
||||||
@ -391,16 +377,16 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="button-group real">
|
<div class="button-group real">
|
||||||
<button onClick="this.parentElement.parentElement.parentElement.parentElement.remove()">✗</button>
|
<button onClick="this.parentElement.parentElement.parentElement.parentElement.remove()">✗</button>
|
||||||
<button onClick="moveUp(this)" class="real up">↑</button>
|
<button onClick="moveBoxUp(this)" class="real up">↑</button>
|
||||||
<button disabled class="dummy up">↑</button>
|
<button disabled class="dummy up">↑</button>
|
||||||
<button onClick="moveDown(this)" class="real down">↓</button>
|
<button onClick="moveBoxDown(this)" class="real down">↓</button>
|
||||||
<button disabled class="dummy down">↓</button>
|
<button disabled class="dummy down">↓</button>
|
||||||
</div>
|
</div>
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
<input type="text" contentEditable>
|
|
||||||
<button onClick="addRule(this.parentElement.parentElement)">+</button>
|
<button onClick="addRule(this.parentElement.parentElement)">+</button>
|
||||||
</td>
|
</td>
|
||||||
|
<td contentEditable>
|
||||||
|
<input type="text" contentEditable>
|
||||||
|
</td>
|
||||||
<td class="rule">
|
<td class="rule">
|
||||||
<div class="button-group dummy">
|
<div class="button-group dummy">
|
||||||
<button disabled>✗</button>
|
<button disabled>✗</button>
|
||||||
@ -409,9 +395,9 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="button-group real">
|
<div class="button-group real">
|
||||||
<button onClick="this.parentElement.parentElement.parentElement.remove()">✗</button>
|
<button onClick="this.parentElement.parentElement.parentElement.remove()">✗</button>
|
||||||
<button onClick="moveUp(this)">↑</button>
|
<button onClick="moveRuleUp(this)" class="real up">↑</button>
|
||||||
<button disabled class="dummy up">↑</button>
|
<button disabled class="dummy up">↑</button>
|
||||||
<button onClick="moveDown(this)">↓</button>
|
<button onClick="moveRuleDown(this)" class="real down">↓</button>
|
||||||
<button disabled class="dummy down">↓</button>
|
<button disabled class="dummy down">↓</button>
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
@ -429,47 +415,58 @@
|
|||||||
</template>
|
</template>
|
||||||
<div class="outer">
|
<div class="outer">
|
||||||
<div class="inner">
|
<div class="inner">
|
||||||
<h1>Mail4one Web config</h1>
|
<h1 class="page-title">Mail4one Web config</h1>
|
||||||
<table id="web-cfg-matches">
|
<div id="top-menu">
|
||||||
<thead>
|
<button onClick="save()">Previous</button>
|
||||||
<tr>
|
<button onClick="save()">Matches</button>
|
||||||
<th></th>
|
<button onClick="save()">Boxes</button>
|
||||||
<th>Match</th>
|
<button onClick="save()">Users</button>
|
||||||
<th>Type</th>
|
<button onClick="save()">JSON</button>
|
||||||
<th>Values</th>
|
<button onClick="save()">Next</button>
|
||||||
</tr>
|
</div>
|
||||||
</thead>
|
<div id="match-page">
|
||||||
<tbody>
|
<h3> Matches </h3>
|
||||||
</tbody>
|
<table id="web-cfg-matches">
|
||||||
</table>
|
<thead>
|
||||||
<div>
|
<tr>
|
||||||
<button onClick="addMatchRow()">Add Match</button>
|
<th>
|
||||||
<button onClick="save()">Save</button>
|
<button onClick="addMatchRow()">+</button>
|
||||||
</div>
|
</th>
|
||||||
|
<th>Match</th>
|
||||||
|
<th>Type</th>
|
||||||
|
<th>Values</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
<h3>Boxes <button onClick="addBox()">+</button></h3>
|
<div id=box-page">
|
||||||
|
<h3>Boxes</h3>
|
||||||
|
|
||||||
<table id="web-cfg-boxes">
|
<table id="web-cfg-boxes">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th></th>
|
<th><button onClick="addBox()">+</button></th>
|
||||||
<th>Mailbox</th>
|
<th>Mailbox</th>
|
||||||
<th></th>
|
<th></th>
|
||||||
<th>Match</th>
|
<th>Match</th>
|
||||||
<th>Invert</th>
|
<th>Invert</th>
|
||||||
<th>Stop</th>
|
<th>Stop</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
</table>
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
<hr>
|
<hr>
|
||||||
|
|
||||||
<h3>Before</h3>
|
<h3>Before</h3>
|
||||||
<pre id="before"></pre>
|
<pre id="before"></pre>
|
||||||
<hr>
|
<hr>
|
||||||
<h3>After</h3>
|
<h3>After</h3>
|
||||||
<pre id="after"></pre>
|
<pre id="after"></pre>
|
||||||
<hr>
|
<hr>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
|
Loading…
Reference in New Issue
Block a user