seasharp
/
basicswap_miserver
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

ui/ux: Update

Browse Source 
- Fixed UI (wallet) reseed wallet button styling/footer.
- Fixed (wallet page) coin icon sizes.
- Added BSX version in footer (unlock).
- Added version (Global for all pages) in render_template (http_server.py).
- Added (BSX) in title (header/unlock/error/info).
- Fixed dots dark/light mode (footer).
- Added UX lock Rate / Amount Variable / Rate Variable discriptions (offer_new_1).
2024-05-20_merge
gerlofvanek 1 year ago
parent 8f4b962285
commit af876fa166
9 changed files with 73 additions and 30 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 6
      basicswap/http_server.py
  2. 2
      basicswap/templates/error.html
  3. 8
      basicswap/templates/footer.html
  4. 2
      basicswap/templates/header.html
  5. 2
      basicswap/templates/index.html
  6. 2
      basicswap/templates/info.html
  7. 40
      basicswap/templates/offer_new_1.html
  8. 5
      basicswap/templates/unlock.html
  9. 36
      basicswap/templates/wallet.html

6
basicswap/http_server.py
Unescape View File

@ -131,7 +131,7 @@ class HttpHandler(BaseHTTPRequestHandler):
self.server.last_form_id[name] = form_id self.server.last_form_id[name] = form_id
return form_data return form_data
def render_template(self, template, args_dict, status_code=200): def render_template(self, template, args_dict, status_code=200, version=__version__):
swap_client = self.server.swap_client swap_client = self.server.swap_client
if swap_client.ws_server: if swap_client.ws_server:
args_dict['ws_url'] = swap_client.ws_server.url args_dict['ws_url'] = swap_client.ws_server.url
@ -175,6 +175,8 @@ class HttpHandler(BaseHTTPRequestHandler):
if self.server.msg_id_counter >= 0x7FFFFFFF: if self.server.msg_id_counter >= 0x7FFFFFFF:
self.server.msg_id_counter = 0 self.server.msg_id_counter = 0
args_dict['version'] = version
self.putHeaders(status_code, 'text/html') self.putHeaders(status_code, 'text/html')
return bytes(template.render( return bytes(template.render(
title=self.server.title, title=self.server.title,
@ -381,11 +383,11 @@ class HttpHandler(BaseHTTPRequestHandler):
template = env.get_template('index.html') template = env.get_template('index.html')
return self.render_template(template, { return self.render_template(template, {
'refresh': 30, 'refresh': 30,
'version': __version__,
'summary': summary, 'summary': summary,
'use_tor_proxy': swap_client.use_tor_proxy 'use_tor_proxy': swap_client.use_tor_proxy
}) })
def page_404(self, url_split): def page_404(self, url_split):
swap_client = self.server.swap_client swap_client = self.server.swap_client
summary = swap_client.getSummary() summary = swap_client.getSummary()

2
basicswap/templates/error.html
Unescape View File

@ -3,7 +3,7 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<link rel=icon sizes="32x32" type="image/png" href="/static/images/favicon-32.png"> <link rel=icon sizes="32x32" type="image/png" href="/static/images/favicon-32.png">
<title>{{ title }}</title> <title>(BSX) BasicSwap - v{{ version }}</title>
</head> </head>
<body> <body>
<h2>{{ title_str }}</h2> <h2>{{ title_str }}</h2>

8
basicswap/templates/footer.html
Unescape View File

@ -21,15 +21,15 @@
<div class="w-full md:w-1/2 mb-6 md:mb-0"> <div class="w-full md:w-1/2 mb-6 md:mb-0">
<div class="flex items-center"> <div class="flex items-center">
<div class="flex items-center"> <div class="flex items-center">
<p class="mr-1 text-sm text-gray-90 dark:text-white font-medium ">© 2023~</p> <p class="text-sm text-gray-90 dark:text-white font-medium">© 2023~ (BSX) BasicSwap</p> <span class="w-1 h-1 mx-1.5 bg-gray-500 dark:bg-white rounded-full"></span>
<p class="text-sm text-coolGray-400 dark:text-white font-medium">{{ title }}</p> <span class="w-1 h-1 mx-1.5 bg-gray-500 rounded-full"></span> <p class="text-sm text-coolGray-400 font-medium">BSX: v{{ version }}</p> <span class="w-1 h-1 mx-1.5 bg-gray-500 dark:bg-white rounded-full"></span>
<p class="text-sm text-coolGray-400 dark:text-white font-medium">GUI 2.0.2 </p> <span class="w-1 h-1 mx-1.5 bg-gray-500 rounded-full"></span> <p class="text-sm text-coolGray-400 font-medium">GUI: v2.0.2</p> <span class="w-1 h-1 mx-1.5 bg-gray-500 dark:bg-white rounded-full"></span>
<p class="mr-2 text-sm font-bold dark:text-white text-gray-90 ">Made with </p> <p class="mr-2 text-sm font-bold dark:text-white text-gray-90 ">Made with </p>
<svg xmlns="http://www.w3.org/2000/svg" height="20" width="20" viewBox="0 0 24 24"> <svg xmlns="http://www.w3.org/2000/svg" height="20" width="20" viewBox="0 0 24 24">
<g stroke-linecap="round" stroke-width="2" fill="none" stroke="#f80b0b" stroke-linejoin="round"> <g stroke-linecap="round" stroke-width="2" fill="none" stroke="#f80b0b" stroke-linejoin="round">
<path d="M21.243,3.757 c-2.343-2.343-6.142-2.343-8.485,0c-0.289,0.289-0.54,0.6-0.757,0.927c-0.217-0.327-0.469-0.639-0.757-0.927 c-2.343-2.343-6.142-2.343-8.485,0c-2.343,2.343-2.343,6.142,0,8.485L12,21.485l9.243-9.243C23.586,9.899,23.586,6.1,21.243,3.757z"></path> <path d="M21.243,3.757 c-2.343-2.343-6.142-2.343-8.485,0c-0.289,0.289-0.54,0.6-0.757,0.927c-0.217-0.327-0.469-0.639-0.757-0.927 c-2.343-2.343-6.142-2.343-8.485,0c-2.343,2.343-2.343,6.142,0,8.485L12,21.485l9.243-9.243C23.586,9.899,23.586,6.1,21.243,3.757z"></path>
</g> </g>
</svg> <span class="ml-2 text-sm font-bold dark:text-white text-gray-90 ">by TV and CRZ</span></div><!-- fix dots --> </svg> <span class="ml-2 text-sm font-bold dark:text-white text-gray-90 ">by TV and CRZ</span></div>
</div> </div>
</div> </div>
<div class="w-full md:w-1/2"> <div class="w-full md:w-1/2">

2
basicswap/templates/header.html
Unescape View File

@ -86,7 +86,7 @@
</script> </script>
<link rel=icon sizes="32x32" type="image/png" href="/static/images/favicon/favicon-32.png"> <link rel=icon sizes="32x32" type="image/png" href="/static/images/favicon/favicon-32.png">
<title>{{ title }}</title> <title>(BSX) BasicSwap - v{{ version }}</title>
</head> </head>
<body class="dark:bg-gray-700"> <body class="dark:bg-gray-700">
<section> <section>

2
basicswap/templates/index.html
Unescape View File

@ -3,7 +3,7 @@
<section class="relative py-24 overflow-hidden"> <section class="relative py-24 overflow-hidden">
<div class="container px-4 mx-auto mb-16 md:mb-0"> <div class="container px-4 mx-auto mb-16 md:mb-0">
<div class="md:w-1/2 pl-4"> <div class="md:w-1/2 pl-4">
<span class="inline-block py-1 px-3 mb-4 text-xs leading-5 bg-blue-500 text-white font-medium rounded-full shadow-sm">BasicSwap version: {{ version }}</span> <span class="inline-block py-1 px-3 mb-4 text-xs leading-5 bg-blue-500 text-white font-medium rounded-full shadow-sm">(BSX) BasicSwap v{{ version }}</span>
<h3 class="mb-6 text-4xl md:text-5xl leading-tight text-coolGray-900 font-bold tracking-tighter dark:text-white">Welcome to BasicSwap DEX</h3> <h3 class="mb-6 text-4xl md:text-5xl leading-tight text-coolGray-900 font-bold tracking-tighter dark:text-white">Welcome to BasicSwap DEX</h3>
<p class="mb-12 text-lg md:text-xl text-coolGray-500 dark:text-gray-300 font-medium">Swap cryptocurrencies in <span class="underline">total privacy</span> with no middlemen, fees, <br> or restrictions. </p> <p class="mb-12 text-lg md:text-xl text-coolGray-500 dark:text-gray-300 font-medium">Swap cryptocurrencies in <span class="underline">total privacy</span> with no middlemen, fees, <br> or restrictions. </p>
<div class="flex flex-wrap mb-10 text-center md:text-left"> <div class="flex flex-wrap mb-10 text-center md:text-left">

2
basicswap/templates/info.html
Unescape View File

@ -3,7 +3,7 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<link rel=icon sizes="32x32" type="image/png" href="/static/images/favicon-32.png"> <link rel=icon sizes="32x32" type="image/png" href="/static/images/favicon-32.png">
<title>{{ title }}</title> <title>(BSX) BasicSwap - v{{ version }}</title>
</head> </head>
<body> <body>
<h2>{{ title_str }}</h2> <h2>{{ title_str }}</h2>

40
basicswap/templates/offer_new_1.html
Unescape View File

@ -326,10 +326,17 @@
</div> </div>
<input class="pl-10 hover:border-blue-500 pl-10 bg-gray-50 text-gray-900 appearance-none pr-10 dark:bg-gray-500 dark:text-white border border-gray-300 dark:border-gray-400 dark:text-gray-50 dark:placeholder-white text-sm rounded-lg outline-none focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 focus:ring-0" type="text" id="rate" name="rate" value="{{ data.rate }}" onchange="set_rate('rate');"> <input class="pl-10 hover:border-blue-500 pl-10 bg-gray-50 text-gray-900 appearance-none pr-10 dark:bg-gray-500 dark:text-white border border-gray-300 dark:border-gray-400 dark:text-gray-50 dark:placeholder-white text-sm rounded-lg outline-none focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 focus:ring-0" type="text" id="rate" name="rate" value="{{ data.rate }}" onchange="set_rate('rate');">
</div> </div>
<div class="form-check form-check-inline mt-5">
<input class="form-check-input hover:border-blue-500 w-5 h-5 form-check-input text-blue-600 bg-gray-50 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-1 dark:bg-gray-500 dark:border-gray-400" type="checkbox" id="rate_lock" name="rate_lock" value="rl" checked=checked> <div class="flex form-check form-check-inline mt-5">
<label class="form-check-label ml-2 text-sm font-medium text-gray-800 dark:text-white" for="inlineCheckbox1">Lock Rate</label> <div class="flex items-center h-5">
</div> <input class="form-check-input hover:border-blue-500 w-5 h-5 form-check-input text-blue-600 bg-gray-50 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-1 dark:bg-gray-500 dark:border-gray-400" type="checkbox" id="rate_lock" name="rate_lock" value="rl" checked=checked>
</div>
<div class="ml-2 text-sm">
<label class="form-check-label text-sm font-medium text-gray-800 dark:text-white" for="inlineCheckbox1">Lock Rate</label>
<p id="helper-checkbox-text" class="text-xs font-normal text-gray-500 dark:text-gray-300">Automatically adjusts the <b>You Get</b> value based on the rate you’ve entered. Without it, the rate value is automatically adjusted based on the number of coins you put in <b>You Get.</b></p>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -343,14 +350,27 @@
<p class="text-sm text-coolGray-800 dark:text-white font-semibold">Options</p> <p class="text-sm text-coolGray-800 dark:text-white font-semibold">Options</p>
</div> </div>
<div class="w-full md:flex-1 p-3"> <div class="w-full md:flex-1 p-3">
<div class="form-check form-check-inline">
<input class="hover:border-blue-500 w-5 h-5 form-check-input text-blue-600 bg-gray-50 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-1 dark:bg-gray-500 dark:border-gray-400" type="checkbox" id="amt_var" name="amt_var" value="av" {% if data.amt_var==true %} checked="checked" {% endif %}> <div class="flex form-check form-check-inline">
<label class="form-check-label ml-2 text-sm font-medium text-gray-800 dark:text-white" for="inlineCheckbox2">Amount Variable</label> <div class="flex items-center h-5">
<input class="hover:border-blue-500 w-5 h-5 form-check-input text-blue-600 bg-gray-50 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-1 dark:bg-gray-500 dark:border-gray-400" type="checkbox" id="amt_var" name="amt_var" value="av" {% if data.amt_var==true %} checked="checked" {% endif %}>
</div> </div>
<div class="form-check form-check-inline mt-2"> <div class="ml-2 text-sm">
<input class="hover:border-blue-500 w-5 h-5 form-check-input text-blue-600 bg-gray-50 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-1 dark:bg-gray-500 dark:border-gray-400" type="checkbox" id="rate_var" name="rate_var" value="rv" {% if data.rate_var==true %} checked="checked" {% endif %}> <label class="form-check-label text-sm font-medium text-gray-800 dark:text-white" for="inlineCheckbox2">Amount Variable</label>
<label class="form-check-label ml-2 text-sm font-medium text-gray-800 dark:text-white" for="inlineCheckbox3">Rate Variable</label> <p id="helper-checkbox-text" class="text-xs font-normal text-gray-500 dark:text-gray-300">Allow bids with a different amount to the offer.</p>
</div> </div>
</div>
<div class="flex mt-2 form-check form-check-inline">
<div class="flex items-center h-5">
<input class="hover:border-blue-500 w-5 h-5 form-check-input text-blue-600 bg-gray-50 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-1 dark:bg-gray-500 dark:border-gray-400" type="checkbox" id="rate_var" name="rate_var" value="rv" {% if data.rate_var==true %} checked="checked" {% endif %}>
</div>
<div class="ml-2 text-sm">
<label class="form-check-label text-sm font-medium text-gray-800 dark:text-white" for="inlineCheckbox3">Rate Variable</label>
<p id="helper-checkbox-text" class="text-xs font-normal text-gray-500 dark:text-gray-300">Allow bids with a different rate to the offer.</p>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>

5
basicswap/templates/unlock.html
Unescape View File

@ -23,7 +23,7 @@
document.documentElement.classList.toggle('dark', isDarkMode); document.documentElement.classList.toggle('dark', isDarkMode);
</script> </script>
<link rel=icon sizes="32x32" type="image/png" href="/static/images/favicon/favicon-32.png"> <link rel=icon sizes="32x32" type="image/png" href="/static/images/favicon/favicon-32.png">
<title>{{ title }}</title> <title>(BSX) BasicSwap - v{{ version }}</title>
</head> </head>
<body class="dark:bg-gray-700"> <body class="dark:bg-gray-700">
<section class="py-24 md:py-32"> <section class="py-24 md:py-32">
@ -102,6 +102,9 @@
<span class="text-xs font-medium dark:text-white" contenteditable="false">Need help?</span> <span class="text-xs font-medium dark:text-white" contenteditable="false">Need help?</span>
<a class="inline-block text-xs font-medium text-blue-500 hover:text-blue-600 hover:underline" href="https://academy.particl.io/en/latest/faq/get_support.html" target="_blank" contenteditable="false">Help / Tutorials</a> <a class="inline-block text-xs font-medium text-blue-500 hover:text-blue-600 hover:underline" href="https://academy.particl.io/en/latest/faq/get_support.html" target="_blank" contenteditable="false">Help / Tutorials</a>
</p> </p>
<p class="text-center">
<span class="text-xs font-medium text-coolGray-500 dark:text-gray-500" contenteditable="false">{{ title }} - GUI 2.0.2</span>
</p>
<input type="hidden" name="formid" value="{{ form_id }}"> <input type="hidden" name="formid" value="{{ form_id }}">
</form> </form>
</div> </div>

36
basicswap/templates/wallet.html
Unescape View File

@ -39,7 +39,7 @@
<div class="w-full md:w-1/2 p-3"> <div class="w-full md:w-1/2 p-3">
<h2 class="text-4xl font-bold text-white tracking-tighter"> <h2 class="text-4xl font-bold text-white tracking-tighter">
<span class="inline-block align-middle"> <span class="inline-block align-middle">
<img class="mr-2" src="/static/images/coins/{{ w.name }}.png" alt="{{ w.name }}"> <img class="mr-2 h-16" src="/static/images/coins/{{ w.name }}.png" alt="{{ w.name }}">
</span>{{ w.name }} Wallet - <span id="total-usd-value"></span> </span>{{ w.name }} Wallet - <span id="total-usd-value"></span>
</h2> </h2>
<p class="font-normal text-coolGray-200 dark:text-white pl-2 pt-5">Manage your {{ w.ticker }} wallet. {% if refresh %} (Page Refresh: {{ refresh }} seconds) {% endif %}</p> <p class="font-normal text-coolGray-200 dark:text-white pl-2 pt-5">Manage your {{ w.ticker }} wallet. {% if refresh %} (Page Refresh: {{ refresh }} seconds) {% endif %}</p>
@ -206,15 +206,33 @@
</table> </table>
</div> </div>
</div> </div>
<div class="p-6 pt-10 bg-white bg-opacity-60 rounded-b-md"> </section>
<div class="w-full md:w-0/12">
<div class="flex flex-wrap justify-end -m-1.5">
<div class="w-full md:w-auto p-1.5 ml-2"> <section>
<input class="flex flex-wrap justify-center px-4 py-2.5 font-medium text-sm text-red-500 hover:text-red-600 border border-red-400 hover:border-red-500 bg-white rounded-md shadow-button focus:ring-0 focus:outline-none" type="submit" name="reseed_{{ w.cid }}" value="Reseed wallet" onclick="return confirmReseed();"> <div class="pl-6 pr-6 pt-0 pb-0 h-full overflow-hidden">
</div> <div class="pb-6 border-coolGray-100">
</div> <div class="flex flex-wrap items-center justify-between -m-2">
</div> <div class="w-full pt-2">
<div class="container mt-5 mx-auto">
<div class="pt-6 pb-6 bg-coolGray-100 dark:bg-gray-500 rounded-xl">
<div class="px-6">
<div class="flex flex-wrap justify-end">
<div class="w-full md:w-auto p-1.5">
<input class="flex flex-wrap justify-center w-full px-4 py-2.5 font-medium text-sm text-white hover:text-red border border-red-500 hover:border-red-500 hover:bg-red-600 bg-red-500 rounded-md shadow-button focus:ring-0 focus:outline-none" type="submit" name="reseed_{{ w.cid }}" value="Reseed wallet" onclick="return confirmReseed();">
</div> </div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
{% else %} {% else %}
</tr> </tr>
{% if w.cid == '1' %} {% if w.cid == '1' %}

Write Preview
Loading…
Cancel
Save