diff options
| author | Shulhan <m.shulhan@gmail.com> | 2020-07-26 15:11:50 +0700 |
|---|---|---|
| committer | Shulhan <m.shulhan@gmail.com> | 2020-07-26 15:11:50 +0700 |
| commit | 5fa91b74cdf47e95a4cb8968bd5a505ea24efc6a (patch) | |
| tree | 24aa20a90e2c284bbeef0f99f8fa09d91358d1ce /_www | |
| parent | fb4161eaaf4da54729eb5c74f7b4944d81c64627 (diff) | |
| download | rescached-5fa91b74cdf47e95a4cb8968bd5a505ea24efc6a.tar.xz | |
wui: update the hosts block last-updated format
Use the format "Year-month-day hour:minute:second TZ" for
last updated value.
Diffstat (limited to '_www')
| -rw-r--r-- | _www/src/HostsBlock.svelte | 115 |
1 files changed, 62 insertions, 53 deletions
diff --git a/_www/src/HostsBlock.svelte b/_www/src/HostsBlock.svelte index 0b62544..49049a3 100644 --- a/_www/src/HostsBlock.svelte +++ b/_www/src/HostsBlock.svelte @@ -4,7 +4,11 @@ import { apiEnvironment, environment, nanoSeconds } from './environment.js'; const apiHostsBlock = "/api/hosts_block" - let env = {}; + let env = { + NameServers: [], + HostsBlocks: [], + HostsFiles: [], + }; const envUnsubscribe = environment.subscribe(value => { env = value; @@ -21,38 +25,42 @@ }); const resJSON = await res.json() - - console.log(resJSON); } </script> <style> - .block_source.header { - font-weight: 600; - } - .block_source span { - font-size: 14px; - display: inline-block; - margin-right: 10px; - vertical-align: middle; - } - .block_source > span:nth-child(1) { - width: 60px; - } - .block_source > span:nth-child(2) { - width: 200px; - } - .block_source > span:nth-child(3) { - width: 300px; - } - .block_source > span:nth-child(3) input { - width: 300px; - } - .block_source > span:nth-child(4) { - } + .block_source { + width: calc(100% - 2em); + overflow: auto; + font-size: 12px; + } .block_source input:disabled { color: black; } + .item span { + display: inline-block; + margin-right: 1em; + } + .item.header { + font-weight: bold; + margin-bottom: 1em; + border-bottom: 1px solid silver; + } + .item > span:nth-child(1) { + width: 4em; + } + .item > span:nth-child(2) { + width: 15em; + } + .item > span:nth-child(3) { + width: 23em; + } + .item > span:nth-child(3) input { + width: 100%; + } + .item > span:nth-child(4) { + width: 16em; + } </style> <div class="hosts-block"> @@ -64,35 +72,36 @@ Configure the source of blocked hosts file. </p> - <div class="block_source header"> - <span> Enabled </span> - <span> Name </span> - <span> URL </span> - <span> Last updated </span> - </div> - <br/> - {#each env.HostsBlocks as hostsBlock} <div class="block_source"> - <span> - <input - type=checkbox - bind:checked={hostsBlock.IsEnabled} - > - </span> - <span> - {hostsBlock.Name} - </span> - <span> - <input - bind:value={hostsBlock.URL} - disabled - > - </span> - <span> - {hostsBlock.LastUpdated} - </span> + <div class="item header"> + <span> Enabled </span> + <span> Name </span> + <span> URL </span> + <span> Last updated </span> + </div> + {#each env.HostsBlocks as hostsBlock} + <div class="item"> + <span> + <input + type=checkbox + bind:checked={hostsBlock.IsEnabled} + > + </span> + <span> + {hostsBlock.Name} + </span> + <span> + <input + bind:value={hostsBlock.URL} + disabled + > + </span> + <span> + {hostsBlock.LastUpdated} + </span> + </div> + {/each} </div> - {/each} <div> <button on:click={updateHostsBlocks}> |