RanchiMall/ribc
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI improvements

Browse Source
This commit is contained in:
sairaj mote 2022-10-04 17:18:31 +05:30
parent 562bb8afcc
commit 19b560a15f
4 changed files with 43 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
css/main.css
View File

@ -80,7 +80,6 @@ body[data-theme=dark] ::-webkit-calendar-picker-indicator {
p,
strong {
font-size: 0.9rem;
line-height: 1.7;
color: rgba(var(--text-color), 0.9);
}
@ -771,7 +770,7 @@ ul {
}
#secondary_pages header {
padding: 1.5rem;
background-color: rgba(var(--foreground-color), 0.5);
background-color: rgba(var(--foreground-color), 0.3);
}
#secondary_pages .inner-page {
width: 100%;
@ -785,7 +784,7 @@ ul {
padding: 1rem;
grid-template-columns: minmax(0, 1fr);
height: 100%;
background-color: rgba(var(--foreground-color), 0.5);
background-color: rgba(var(--foreground-color), 0.3);
}
#sign_in,
@ -796,7 +795,7 @@ ul {
#sign_in section,
#sign_up section {
margin-top: -8rem;
width: min(24rem, 100%);
width: min(26rem, 100%);
}
#sign_in sm-form,
#sign_up sm-form {
@ -806,25 +805,24 @@ ul {
#sign_up .h2 {
margin-bottom: 0.5rem;
}
#sign_up .card {
margin: 1.5rem 0;
}
#sign_up h5 {
color: rgba(var(--text-color), 0.8);
.generated-keys-wrapper {
padding: 1rem;
background-color: rgba(var(--foreground-color), 1);
border-radius: 0.5rem;
}
#flo_id_warning {
padding-bottom: 1.5rem;
border-bottom: thin solid rgba(var(--text-color), 0.3);
}
#flo_id_warning .icon {
height: 4rem;
width: 4rem;
padding: 1rem;
height: 3rem;
width: 3rem;
padding: 0.8rem;
overflow: visible;
background-color: #ffc107;
border-radius: 3rem;
fill: rgba(0, 0, 0, 0.8);
margin-bottom: 1.5rem;
}
#main_page {

2
css/main.min.css vendored
View File

File diff suppressed because one or more lines are too long

31
css/main.scss
View File

@ -80,7 +80,6 @@ body[data-theme="dark"] {
p,
strong {
font-size: 0.9rem;
line-height: 1.7;
color: rgba(var(--text-color), 0.9);
}
@ -767,7 +766,7 @@ ul {
header {
padding: 1.5rem;
background-color: rgba(var(--foreground-color), 0.5);
background-color: rgba(var(--foreground-color), 0.3);
}
.inner-page {
@ -783,7 +782,7 @@ ul {
padding: 1rem;
grid-template-columns: minmax(0, 1fr);
height: 100%;
background-color: rgba(var(--foreground-color), 0.5);
background-color: rgba(var(--foreground-color), 0.3);
}
#sign_in,
@ -793,7 +792,7 @@ ul {
section {
margin-top: -8rem;
width: min(24rem, 100%);
width: min(26rem, 100%);
}
sm-form {
@ -805,28 +804,22 @@ ul {
.h2 {
margin-bottom: 0.5rem;
}
.card {
margin: 1.5rem 0;
}
h5 {
color: rgba(var(--text-color), 0.8);
}
}
.generated-keys-wrapper {
padding: 1rem;
background-color: rgba(var(--foreground-color), 1);
border-radius: 0.5rem;
}
#flo_id_warning {
padding-bottom: 1.5rem;
border-bottom: thin solid rgba(var(--text-color), 0.3);
.icon {
height: 4rem;
width: 4rem;
padding: 1rem;
height: 3rem;
width: 3rem;
padding: 0.8rem;
overflow: visible;
background-color: #ffc107;
border-radius: 3rem;
fill: rgba(0, 0, 0, 0.8);
margin-bottom: 1.5rem;
}
}

29
index.html
View File

@ -49,7 +49,7 @@
</script>
</head>
<body onload="onLoadStartUp()">
<body onload="onLoadStartUp()" class="hidden">
<sm-notifications id="notification_drawer"></sm-notifications>
<sm-popup id="confirmation_popup">
<h4 id="confirm_title"></h4>
@ -125,19 +125,25 @@
</article>
<article id="sign_up" class="inner-page hidden">
<section class="grid gap-1-5">
<div id="flo_id_warning" class="grid justify-center gap-0-5">
<div id="flo_id_warning" class="flex gap-1">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px"
fill="#000000">
<path d="M0 0h24v24H0z" fill="none" />
<path d="M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z" />
</svg>
<h3>Keep your keys safe!</h3>
<strong>Don't share with anyone. Once lost private key can't be
recovered.</strong>
</div>
<div class="grid gap-1-5">
<div class="grid gap-0-5">
<h5>FLO ID</h5>
<strong>
<h3>
Keep your keys safe!
</h3>
</strong>
<p>Don't share with anyone. Once lost private key can't be
recovered.</p>
</div>
</div>
<div class="grid gap-1-5 generated-keys-wrapper">
<div class="grid gap-0-5">
<h5>FLO address</h5>
<sm-copy id="generated_flo_address"></sm-copy>
</div>
<div class="grid gap-0-5">
@ -145,7 +151,7 @@
<sm-copy id="generated_private_key"></sm-copy>
</div>
</div>
<div class="flex gap-0-5 margin-top-1">
<div class="flex gap-0-5">
<button class="button" style="flex-shrink: 0;" onclick="downloadGeneratedCredentials()">
<svg class="icon margin-right-0-5" xmlns="http://www.w3.org/2000/svg"
enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px"
@ -161,7 +167,7 @@
Download</button>
<button id="sign_up_button" class="button button--primary w-100">Sign in with these</button>
</div>
<p>You can use these FLO credentials with other RanchiMall apps
<p class="margin-top-1">You can use these FLO credentials with other RanchiMall apps
too. </p>
</section>
</article>
@ -790,7 +796,8 @@
</header>
<sm-form>
<sm-input id="intern_name_field" placeholder="Name" required></sm-input>
<sm-input id="intern_flo_id_field" placeholder="FLO address" error-text="Wrong FLO ID" data-flo-id required>
<sm-input id="intern_flo_id_field" placeholder="FLO address" error-text="Invalid FLO address" data-flo-id
required>
</sm-input>
<sm-button variant="primary" onclick="addInternToList()" disabled>
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">