modif simplemobnav to look like a smartphone on big screen
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
<!-- screen action-->
|
||||
<div class="screenaction mt-5 sm:mx-auto sm:w-full sm:max-w-sm">
|
||||
<div class="screenaction mt-5 m-2 sm:mx-auto sm:w-full sm:max-w-sm">
|
||||
</div>
|
||||
<!-- feedback action-->
|
||||
<div class="my-5">
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<div class="mt-1">
|
||||
<label class="input validator mbt-1">
|
||||
<div class="mt-1 w-full">
|
||||
<label class="input validator mbt- w-full max-w-full">
|
||||
<svg class="h-[1em] opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
|
||||
<g
|
||||
stroke-linejoin="round"
|
||||
@@ -23,7 +23,7 @@
|
||||
<path d="M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6ZM12.735 14c.618 0 1.093-.561.872-1.139a6.002 6.002 0 0 0-11.215 0c-.22.578.254 1.139.872 1.139h9.47Z"></path>
|
||||
</g>
|
||||
</svg>
|
||||
<input id="inputaliasrecovery" type="text" placeholder="mail@site.com | alias" required />
|
||||
<input id="inputaliasrecovery" class="w-full max-w-full" type="text" placeholder="mail@site.com | alias" required />
|
||||
</label>
|
||||
<div class="validator-hint hidden">
|
||||
Enter a valid email or an alias (lowercase a-z and 0-9)
|
||||
|
||||
@@ -1,8 +1,9 @@
|
||||
<p data-wco="createid" class="text-center text-neutral-content">
|
||||
<div class="w-full">
|
||||
<p data-wco="createid" class="text-center text-neutral-content">
|
||||
{{{signintitle}}}
|
||||
</p>
|
||||
<div class="mt-2">
|
||||
<label class="input validator">
|
||||
<label class="input validator w-full">
|
||||
<svg class="h-[1em] opacity-90" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
|
||||
<g
|
||||
stroke-linejoin="round"
|
||||
@@ -15,7 +16,7 @@
|
||||
</g>
|
||||
</svg>
|
||||
<input
|
||||
class="signinalias"
|
||||
class="signinalias w-full"
|
||||
type="input"
|
||||
required
|
||||
placeholder="alias"
|
||||
@@ -26,44 +27,45 @@
|
||||
/>
|
||||
</label>
|
||||
<p class="validator-hint hidden"> {{{aliasinvalid}}}</p>
|
||||
</div>
|
||||
<div class="mt-2">
|
||||
<label class="input mt-1">
|
||||
<svg class="h-[1em] opacity-90" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
|
||||
<g
|
||||
stroke-linejoin="round"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
fill="black"
|
||||
stroke="black"
|
||||
>
|
||||
<path d="M11.5 1A3.5 3.5 0 0 0 8 4.5V7H2.5A1.5 1.5 0 0 0 1 8.5v5A1.5 1.5 0 0 0 2.5 15h7a1.5 1.5 0 0 0 1.5-1.5v-5A1.5 1.5 0 0 0 9.5 7V4.5a2 2 0 1 1 4 0v1.75a.75.75 0 0 0 1.5 0V4.5A3.5 3.5 0 0 0 11.5 1Z"></path>
|
||||
</g>
|
||||
</svg>
|
||||
<input type="text" class="signinpassphrase" placeholder="passphrase (option)" />
|
||||
</label>
|
||||
</div>
|
||||
<div class="mt-2">
|
||||
<textarea rows=5 class="mt-2 textarea signinprivatekey" placeholder="{{{privatekeyplaceholder}}}"></textarea>
|
||||
</div>
|
||||
<div class="flex m-6">
|
||||
<div class="w-14 flex-none">
|
||||
<input type="checkbox" checked="checked" class="checkbox signinrememberme" />
|
||||
</div>
|
||||
<div class="mt-2">
|
||||
<label class="input mt-1 w-full">
|
||||
<svg class="h-[1em] opacity-90" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
|
||||
<g
|
||||
stroke-linejoin="round"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
fill="black"
|
||||
stroke="black"
|
||||
>
|
||||
<path d="M11.5 1A3.5 3.5 0 0 0 8 4.5V7H2.5A1.5 1.5 0 0 0 1 8.5v5A1.5 1.5 0 0 0 2.5 15h7a1.5 1.5 0 0 0 1.5-1.5v-5A1.5 1.5 0 0 0 9.5 7V4.5a2 2 0 1 1 4 0v1.75a.75.75 0 0 0 1.5 0V4.5A3.5 3.5 0 0 0 11.5 1Z"></path>
|
||||
</g>
|
||||
</svg>
|
||||
<input type="text" class="signinpassphrase" placeholder="passphrase (option)" />
|
||||
</label>
|
||||
</div>
|
||||
<div class="flex-1">
|
||||
<p class="text-sm text-justify" >{{{remembermetext}}}</p>
|
||||
<div class="mt-2">
|
||||
<textarea rows=5 class="mt-2 textarea signinprivatekey w-full" placeholder="{{{privatekeyplaceholder}}}"></textarea>
|
||||
</div>
|
||||
<div class="flex m-6">
|
||||
<div class="w-14 flex-none">
|
||||
<input type="checkbox" checked="checked" class="checkbox signinrememberme" />
|
||||
</div>
|
||||
<div class="flex-1">
|
||||
<p class="text-sm text-justify" >{{{remembermetext}}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="m-4">
|
||||
<button
|
||||
class="btn btn-primary w-full justify-center hover:bg-secondary focus:outline focus:outline-primary"
|
||||
onclick="const loginid= document.getElementById('{{id}}');apx.apxauth.authentifyme(
|
||||
'{{id}}',
|
||||
loginid.querySelector('.signinalias').value,
|
||||
loginid.querySelector('.signinpassphrase').value,
|
||||
loginid.querySelector('.signinprivatekey').value,
|
||||
loginid.querySelector('.signinrememberme').checked
|
||||
)">
|
||||
{{{authentifyme}}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="m-4">
|
||||
<button
|
||||
class="btn btn-primary w-full justify-center hover:bg-secondary focus:outline focus:outline-primary"
|
||||
onclick="const loginid= document.getElementById('{{id}}');apx.apxauth.authentifyme(
|
||||
'{{id}}',
|
||||
loginid.querySelector('.signinalias').value,
|
||||
loginid.querySelector('.signinpassphrase').value,
|
||||
loginid.querySelector('.signinprivatekey').value,
|
||||
loginid.querySelector('.signinrememberme').checked
|
||||
)">
|
||||
{{{authentifyme}}}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -1,121 +1,122 @@
|
||||
<p data-wco="createid" class="text-center text-neutral-content">
|
||||
{{{signuptitle}}}
|
||||
</p>
|
||||
<div class="paramid">
|
||||
<div class="mt-2">
|
||||
<label class="input validator mbt-1">
|
||||
<svg class="h-[1em] opacity-90" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
|
||||
<g
|
||||
stroke-linejoin="round"
|
||||
<div class="w-full">
|
||||
<p data-wco="createid" class="text-center text-neutral-content">
|
||||
{{{signuptitle}}}
|
||||
</p>
|
||||
<div class="paramid space-y-3 w-full">
|
||||
<div class="mt-2">
|
||||
<label class="input validator mbt-1 w-full max-w-full">
|
||||
<svg class="h-[1em] opacity-90" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
|
||||
<g
|
||||
stroke-linejoin="round"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
fill="black"
|
||||
stroke="black"
|
||||
>
|
||||
<path d="M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6ZM12.735 14c.618 0 1.093-.561.872-1.139a6.002 6.002 0 0 0-11.215 0c-.22.578.254 1.139.872 1.139h9.47Z"></path>
|
||||
</g>
|
||||
</svg>
|
||||
<input
|
||||
class="signupalias w-full"
|
||||
type="input"
|
||||
required
|
||||
placeholder="alias"
|
||||
pattern="[a-z0-9\-]*"
|
||||
minlength="3"
|
||||
maxlength="30"
|
||||
title="{{{aliastitle}}}"
|
||||
/>
|
||||
</label>
|
||||
<div class="validator-hint hidden">
|
||||
<p>{{{aliasinvalid}}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-2">
|
||||
<label class="input validator mt-1 w-full max-w-full">
|
||||
<svg class="h-[1em] opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
|
||||
<g
|
||||
stroke-linejoin="round"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
fill="black"
|
||||
stroke="black"
|
||||
>
|
||||
<rect width="20" height="16" x="2" y="4" rx="2"></rect>
|
||||
<path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7"></path>
|
||||
</g>
|
||||
</svg>
|
||||
<input class="signupemailrecovery w-full" type="email" placeholder="mail@site.com" required />
|
||||
</label>
|
||||
<div class="validator-hint hidden">
|
||||
{{{emailinvalid}}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-2">
|
||||
<label class="input mt-1 w-full max-w-full">
|
||||
<svg class="h-[1em] opacity-90" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
|
||||
<g
|
||||
stroke-linejoin="round"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
fill="black"
|
||||
stroke="black"
|
||||
>
|
||||
<path d="M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6ZM12.735 14c.618 0 1.093-.561.872-1.139a6.002 6.002 0 0 0-11.215 0c-.22.578.254 1.139.872 1.139h9.47Z"></path>
|
||||
</g>
|
||||
</svg>
|
||||
<input
|
||||
class="signupalias"
|
||||
type="input"
|
||||
required
|
||||
placeholder="alias"
|
||||
pattern="[a-z0-9\-]*"
|
||||
minlength="3"
|
||||
maxlength="30"
|
||||
title="{{{aliastitle}}}"
|
||||
/>
|
||||
</label>
|
||||
<div class="validator-hint hidden">
|
||||
<p>{{{aliasinvalid}}}</p>
|
||||
>
|
||||
<path d="M11.5 1A3.5 3.5 0 0 0 8 4.5V7H2.5A1.5 1.5 0 0 0 1 8.5v5A1.5 1.5 0 0 0 2.5 15h7a1.5 1.5 0 0 0 1.5-1.5v-5A1.5 1.5 0 0 0 9.5 7V4.5a2 2 0 1 1 4 0v1.75a.75.75 0 0 0 1.5 0V4.5A3.5 3.5 0 0 0 11.5 1Z"></path>
|
||||
</g>
|
||||
</svg>
|
||||
<input type="text" class="signuppassphrase w-full" placeholder="passphrase (option)" />
|
||||
</label>
|
||||
</div>
|
||||
<div class="mt-5">
|
||||
<button
|
||||
class="btncreatekey btn btn-primary w-full justify-center hover:bg-secondary focus:outline focus:outline-primary"
|
||||
onclick="const authid=document.getElementById('{{id}}');console.log('{{id}}'); apx.apxauth.createIdentity(
|
||||
'{{id}}',
|
||||
authid.querySelector('.signupalias').value,
|
||||
authid.querySelector('.signupemailrecovery').value,
|
||||
authid.querySelector('.signuppassphrase').value
|
||||
)"
|
||||
>
|
||||
{{{createkey}}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="getmykeys hidden mt-1">
|
||||
<div class="flex m-6">
|
||||
<div class="w-14 flex-none">
|
||||
<input type="checkbox" checked="checked" class="signuptrustedcheck checkbox checkbox-secondary" />
|
||||
</div>
|
||||
<div class="flex-1">
|
||||
<p class="text-sm text-justify" >{{{trusttext}}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-2">
|
||||
<label class="input validator mt-1">
|
||||
<svg class="h-[1em] opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
|
||||
<g
|
||||
stroke-linejoin="round"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
fill="black"
|
||||
stroke="black"
|
||||
>
|
||||
<rect width="20" height="16" x="2" y="4" rx="2"></rect>
|
||||
<path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7"></path>
|
||||
</g>
|
||||
</svg>
|
||||
<input class="signupemailrecovery" type="email" placeholder="mail@site.com" required />
|
||||
</label>
|
||||
<div class="validator-hint hidden">
|
||||
{{{emailinvalid}}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-2">
|
||||
<label class="input mt-1">
|
||||
<svg class="h-[1em] opacity-90" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
|
||||
<g
|
||||
stroke-linejoin="round"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
fill="black"
|
||||
stroke="black"
|
||||
>
|
||||
<path d="M11.5 1A3.5 3.5 0 0 0 8 4.5V7H2.5A1.5 1.5 0 0 0 1 8.5v5A1.5 1.5 0 0 0 2.5 15h7a1.5 1.5 0 0 0 1.5-1.5v-5A1.5 1.5 0 0 0 9.5 7V4.5a2 2 0 1 1 4 0v1.75a.75.75 0 0 0 1.5 0V4.5A3.5 3.5 0 0 0 11.5 1Z"></path>
|
||||
</g>
|
||||
</svg>
|
||||
<input type="text" class="signuppassphrase" placeholder="passphrase (option)" />
|
||||
</label>
|
||||
</div>
|
||||
<div class="mt-5">
|
||||
<div class="downloadkeys text-center mt-1">
|
||||
<button
|
||||
class="btncreatekey btn btn-primary w-full justify-center hover:bg-secondary focus:outline focus:outline-primary"
|
||||
onclick="const authid=document.getElementById('{{id}}');console.log('{{id}}'); apx.apxauth.createIdentity(
|
||||
'{{id}}',
|
||||
authid.querySelector('.signupalias').value,
|
||||
authid.querySelector('.signupemailrecovery').value,
|
||||
authid.querySelector('.signuppassphrase').value
|
||||
)"
|
||||
class="signuppublickey btn btn-outline btn-accent text-white shadow-sm"
|
||||
>
|
||||
{{{createkey}}}
|
||||
{{{downloadPuK}}}
|
||||
</button>
|
||||
<button
|
||||
class="signupprivatekey btn btn-outline btn-accent text-white shadow-sm"
|
||||
>
|
||||
{{{downloadPrK}}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="mt-2">
|
||||
<button
|
||||
class="btncreateidentity btn btn-primary w-full justify-center hover:bg-secondary focus:outline focus:outline-primary"
|
||||
onclick="const authid=document.getElementById('{{id}}');apx.apxauth.registerIdentity(
|
||||
'{{id}}',
|
||||
authid.querySelector('.signuptrustedcheck').checked
|
||||
)"
|
||||
>{{{saveidentity}}}
|
||||
</button>
|
||||
<button
|
||||
class="signupbtnreload hidden btn btn-primary w-full justify-center hover:bg-secondary focus:outline focus:outline-primary"
|
||||
onclick="location.reload(true)"
|
||||
>
|
||||
{{{nextpage}}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="getmykeys hidden mt-1">
|
||||
<div class="flex m-6">
|
||||
<div class="w-14 flex-none">
|
||||
<input type="checkbox" checked="checked" class="signuptrustedcheck checkbox checkbox-secondary" />
|
||||
</div>
|
||||
<div class="flex-1">
|
||||
<p class="text-sm text-justify" >{{{trusttext}}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="downloadkeys text-center mt-1">
|
||||
<button
|
||||
class="signuppublickey btn btn-outline btn-accent text-white shadow-sm"
|
||||
>
|
||||
{{{downloadPuK}}}
|
||||
</button>
|
||||
<button
|
||||
class="signupprivatekey btn btn-outline btn-accent text-white shadow-sm"
|
||||
>
|
||||
{{{downloadPrK}}}
|
||||
</button>
|
||||
</div>
|
||||
<div class="mt-2">
|
||||
<button
|
||||
class="btncreateidentity btn btn-primary w-full justify-center hover:bg-secondary focus:outline focus:outline-primary"
|
||||
onclick="const authid=document.getElementById('{{id}}');apx.apxauth.registerIdentity(
|
||||
'{{id}}',
|
||||
authid.querySelector('.signuptrustedcheck').checked
|
||||
)"
|
||||
>{{{saveidentity}}}
|
||||
</button>
|
||||
<button
|
||||
class="signupbtnreload hidden btn btn-primary w-full justify-center hover:bg-secondary focus:outline focus:outline-primary"
|
||||
onclick="location.reload(true)"
|
||||
>
|
||||
{{{nextpage}}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
<div class="py-1">
|
||||
<div class="py-1 sm:w-full sm:max-w-sm mx-auto">
|
||||
<img
|
||||
class="mx-auto w-auto block dark:hidden"
|
||||
data-wco="logo"
|
||||
@@ -25,5 +25,5 @@
|
||||
<span class="loading loading-spinner loading-lg text-secondary"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div id="{{contentid}}" wco-name="{{contentwconame}}" wco-link="{{contentscreen}}" class="mt-5 sm:mx-auto sm:w-full sm:max-w-sm"></div>
|
||||
<div class="navlink"></div>
|
||||
<div id="{{contentid}}" wco-name="{{contentwconame}}" wco-link="{{contentscreen}}" class="flex flex-col overflow-y-auto flex justify-center"></div>
|
||||
<div class="navlink flex justify-around border-t bg-base-200 p-2"></div>
|
||||
29
wco/simplemobnav/mainold.mustache
Normal file
29
wco/simplemobnav/mainold.mustache
Normal file
@@ -0,0 +1,29 @@
|
||||
<div class="py-1">
|
||||
<img
|
||||
class="mx-auto w-auto block dark:hidden"
|
||||
data-wco="logo"
|
||||
src="{{logobglight.src}}"
|
||||
alt="{{logobglight.alt}}"
|
||||
src="{{logobgdark.src}}"
|
||||
alt="{{logobgdark.alt}}"
|
||||
/>
|
||||
<img
|
||||
class="mx-auto w-auto hidden dark:block"
|
||||
data-wco="logo"
|
||||
src="{{logobgdark.src}}"
|
||||
alt="{{logobgdark.alt}}"
|
||||
/>
|
||||
<h2
|
||||
class="mt-10 text-center text-2xl font-bold leading-9 tracking-tight"
|
||||
data-wco="claim"
|
||||
>
|
||||
{{claim.textContent}}
|
||||
</h2>
|
||||
</div>
|
||||
<div id="loading" class="flex min-h-full flex-col justify-center">
|
||||
<div class="sm:mx-auto sm:w-full sm:max-w-sm py-4 text-center">
|
||||
<span class="loading loading-spinner loading-lg text-secondary"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div id="{{contentid}}" wco-name="{{contentwconame}}" wco-link="{{contentscreen}}" class="mt-5 sm:mx-auto sm:w-full sm:max-w-sm"></div>
|
||||
<div class="navlink"></div>
|
||||
@@ -1,11 +1,8 @@
|
||||
<div class="flex justify-center gap-2 p-4">
|
||||
{{#links}}
|
||||
<button class="btn {{classnavbutton}} flex-col gap-1" onclick="apx.simplemobnav.action('{{id}}','{{link}}','{{action}}','{{wconame}}');">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-16 h-16 box-content">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="{{d}}" />
|
||||
</svg>
|
||||
<span class="text-sm">{{{shortlabel}}}</span>
|
||||
</button>
|
||||
<button class="{{classnavbutton}} btn btn-ghost btn-sm flex flex-col items-center" onclick="apx.simplemobnav.action('{{id}}','{{link}}','{{action}}','{{wconame}}');">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="{{d}}"/></svg>
|
||||
<span class="text-xs">{{{shortlabel}}}</span>
|
||||
</button>
|
||||
{{/links}}
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
11
wco/simplemobnav/navbuttonhold.mustache
Normal file
11
wco/simplemobnav/navbuttonhold.mustache
Normal file
@@ -0,0 +1,11 @@
|
||||
<div class="flex justify-center gap-2 p-4">
|
||||
{{#links}}
|
||||
<button class="btn {{classnavbutton}} flex-col gap-1" onclick="apx.simplemobnav.action('{{id}}','{{link}}','{{action}}','{{wconame}}');">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-16 h-16 box-content">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="{{d}}" />
|
||||
</svg>
|
||||
<span class="text-sm">{{{shortlabel}}}</span>
|
||||
</button>
|
||||
{{/links}}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user