added blockchain link
This commit is contained in:
parent
aa2d12bf87
commit
bfce38d868
13
css/main.css
13
css/main.css
@ -88,12 +88,9 @@ button {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.observe-empty-state:empty {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.observe-empty-state:empty,
|
||||
.observe-empty-state:not(:empty) ~ .empty-state {
|
||||
display: none;
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#loader {
|
||||
@ -183,9 +180,9 @@ button {
|
||||
padding: 0.4rem 0.8rem;
|
||||
text-decoration: none;
|
||||
border-radius: 3rem;
|
||||
margin-left: auto;
|
||||
font-weight: 500;
|
||||
color: var(--accent-color);
|
||||
font-size: 0.9rem;
|
||||
gap: 0.3rem;
|
||||
}
|
||||
.button--primary {
|
||||
@ -201,6 +198,10 @@ button {
|
||||
filter: saturate(0);
|
||||
}
|
||||
|
||||
a.button {
|
||||
background-color: rgba(189, 20, 46, 0.062745098);
|
||||
}
|
||||
|
||||
.cert-card {
|
||||
display: grid;
|
||||
gap: 0.6rem;
|
||||
|
||||
2
css/main.min.css
vendored
2
css/main.min.css
vendored
@ -1 +1 @@
|
||||
*{padding:0;margin:0;box-sizing:border-box;font-family:"Roboto slab",serif}:root{font-size:clamp(1rem,1.2vmax,1.2rem)}html,body{height:100%}body{--accent-color: rgb(219, 32, 45);--secondary-color: #ffac2e;--text-color: 34, 34, 34;--foreground-color: 252, 253, 255;--background-color: 241, 243, 248;--danger-color: rgb(255, 75, 75);--green: rgb(91, 33, 255);--yellow: rgb(220, 165, 0);color:rgba(var(--text-color), 1);background-color:rgba(var(--background-color), 1)}body[data-theme=dark]{--accent-color: #92a2ff;--secondary-color: #d60739;--text-color: 200, 200, 200;--foreground-color: 27, 28, 29;--background-color: 21, 22, 22;--danger-color: rgb(255, 106, 106);--green: #00e676;--yellow: rgb(255, 213, 5)}body[data-theme=dark] ::-webkit-calendar-picker-indicator{filter:invert(1)}button{padding:1rem;font-size:inherit;background-color:var(--accent-color);border:none;border-radius:.3rem;color:#fff;font-weight:500;cursor:pointer}.capitalize{text-transform:capitalize}.flex{display:flex}.flex-wrap{flex-wrap:wrap}.gap-0-5{gap:.5rem}.align-items-center{align-items:center}.space-between{justify-content:space-between}.wrap-around{overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;-webkit-hyphens:auto;hyphens:auto}.margin-left-auto{margin-left:auto}.observe-empty-state:empty{display:none}.observe-empty-state:not(:empty)~.empty-state{display:none}#loader{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;gap:1rem}#home>*{width:min(100%,56rem);margin:0 auto}#home header{display:grid;width:100%;background:linear-gradient(#e32e4a, #bd142e);padding-bottom:3rem;margin-bottom:-2rem}#home .rm-logo{margin-top:10vmax;height:2rem;justify-self:center;background-color:rgba(0,0,0,.2);height:4rem;width:4rem;padding:1rem;border-radius:5rem;fill:rgba(var(--foreground-color), 1)}#home h1{padding:1rem;font-size:max(1.8rem,3vw);text-align:center;color:rgba(var(--foreground-color), 1)}@-webkit-keyframes gradient{0%{background-position:0% 50%}100%{background-position:100% 50%}}@keyframes gradient{0%{background-position:0% 50%}100%{background-position:100% 50%}}#cert_sec{padding:1.5rem;font-family:"intern"}#search_certificates{position:-webkit-sticky;position:sticky;top:1rem;width:min(24rem,100% - 2rem);margin:0 auto;--border-radius: 0.5rem;border-radius:.5rem;--padding: 1rem 1.2rem;--background: rgba(var(--foreground-color), 1);box-shadow:0 .5rem 1.5rem rgba(0,0,0,.1);border:solid thin rgba(var(--text-color), 0.2)}#issued_cert_list{display:grid;gap:1rem;padding:1rem;padding-bottom:4rem;margin-top:1rem}.button{display:flex;align-items:center;padding:.4rem .8rem;text-decoration:none;border-radius:3rem;margin-left:auto;font-weight:500;color:var(--accent-color);gap:.3rem}.button--primary{background-color:var(--accent-color);color:#fff}.button--primary .icon{fill:#fff}.button:disabled{opacity:.5;cursor:not-allowed;filter:saturate(0)}.cert-card{display:grid;gap:.6rem;padding:max(1rem,1.5vw);background-color:rgba(var(--foreground-color), 1);border-radius:.5rem}.cert-card h4{font-size:1.2rem}.cert-card time{font-size:.9rem;color:rgba(var(--text-color), 0.8)}.cert-card p{font-size:.9rem;color:rgba(var(--text-color), 0.9)}.cert-card .tag{padding:.3rem .5rem;border-radius:.3rem;font-size:.9rem;font-weight:500;color:rgba(var(--text-color), 0.9);background-color:rgba(var(--text-color), 0.06);margin-right:auto}.cert-card .tag::first-letter{text-transform:uppercase}@media(max-width: 768px){.cert-card{margin:0 -1rem;gap:1rem}}.hidden{display:none !important}
|
||||
*{padding:0;margin:0;box-sizing:border-box;font-family:"Roboto slab",serif}:root{font-size:clamp(1rem,1.2vmax,1.2rem)}html,body{height:100%}body{--accent-color: rgb(219, 32, 45);--secondary-color: #ffac2e;--text-color: 34, 34, 34;--foreground-color: 252, 253, 255;--background-color: 241, 243, 248;--danger-color: rgb(255, 75, 75);--green: rgb(91, 33, 255);--yellow: rgb(220, 165, 0);color:rgba(var(--text-color), 1);background-color:rgba(var(--background-color), 1)}body[data-theme=dark]{--accent-color: #92a2ff;--secondary-color: #d60739;--text-color: 200, 200, 200;--foreground-color: 27, 28, 29;--background-color: 21, 22, 22;--danger-color: rgb(255, 106, 106);--green: #00e676;--yellow: rgb(255, 213, 5)}body[data-theme=dark] ::-webkit-calendar-picker-indicator{filter:invert(1)}button{padding:1rem;font-size:inherit;background-color:var(--accent-color);border:none;border-radius:.3rem;color:#fff;font-weight:500;cursor:pointer}.capitalize{text-transform:capitalize}.flex{display:flex}.flex-wrap{flex-wrap:wrap}.gap-0-5{gap:.5rem}.align-items-center{align-items:center}.space-between{justify-content:space-between}.wrap-around{overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;-webkit-hyphens:auto;hyphens:auto}.margin-left-auto{margin-left:auto}.observe-empty-state:empty,.observe-empty-state:not(:empty)~.empty-state{display:none !important}#loader{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;gap:1rem}#home>*{width:min(100%,56rem);margin:0 auto}#home header{display:grid;width:100%;background:linear-gradient(#e32e4a, #bd142e);padding-bottom:3rem;margin-bottom:-2rem}#home .rm-logo{margin-top:10vmax;height:2rem;justify-self:center;background-color:rgba(0,0,0,.2);height:4rem;width:4rem;padding:1rem;border-radius:5rem;fill:rgba(var(--foreground-color), 1)}#home h1{padding:1rem;font-size:max(1.8rem,3vw);text-align:center;color:rgba(var(--foreground-color), 1)}@-webkit-keyframes gradient{0%{background-position:0% 50%}100%{background-position:100% 50%}}@keyframes gradient{0%{background-position:0% 50%}100%{background-position:100% 50%}}#cert_sec{padding:1.5rem;font-family:"intern"}#search_certificates{position:-webkit-sticky;position:sticky;top:1rem;width:min(24rem,100% - 2rem);margin:0 auto;--border-radius: 0.5rem;border-radius:.5rem;--padding: 1rem 1.2rem;--background: rgba(var(--foreground-color), 1);box-shadow:0 .5rem 1.5rem rgba(0,0,0,.1);border:solid thin rgba(var(--text-color), 0.2)}#issued_cert_list{display:grid;gap:1rem;padding:1rem;padding-bottom:4rem;margin-top:1rem}.button{display:flex;align-items:center;padding:.4rem .8rem;text-decoration:none;border-radius:3rem;font-weight:500;color:var(--accent-color);font-size:.9rem;gap:.3rem}.button--primary{background-color:var(--accent-color);color:#fff}.button--primary .icon{fill:#fff}.button:disabled{opacity:.5;cursor:not-allowed;filter:saturate(0)}a.button{background-color:rgba(189,20,46,.062745098)}.cert-card{display:grid;gap:.6rem;padding:max(1rem,1.5vw);background-color:rgba(var(--foreground-color), 1);border-radius:.5rem}.cert-card h4{font-size:1.2rem}.cert-card time{font-size:.9rem;color:rgba(var(--text-color), 0.8)}.cert-card p{font-size:.9rem;color:rgba(var(--text-color), 0.9)}.cert-card .tag{padding:.3rem .5rem;border-radius:.3rem;font-size:.9rem;font-weight:500;color:rgba(var(--text-color), 0.9);background-color:rgba(var(--text-color), 0.06);margin-right:auto}.cert-card .tag::first-letter{text-transform:uppercase}@media(max-width: 768px){.cert-card{margin:0 -1rem;gap:1rem}}.hidden{display:none !important}
|
||||
@ -79,13 +79,11 @@ button {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.observe-empty-state:empty {
|
||||
display: none;
|
||||
.observe-empty-state:empty,
|
||||
.observe-empty-state:not(:empty) ~ .empty-state {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.observe-empty-state:not(:empty) ~ .empty-state {
|
||||
display: none;
|
||||
}
|
||||
#loader {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@ -161,9 +159,9 @@ button {
|
||||
padding: 0.4rem 0.8rem;
|
||||
text-decoration: none;
|
||||
border-radius: 3rem;
|
||||
margin-left: auto;
|
||||
font-weight: 500;
|
||||
color: var(--accent-color);
|
||||
font-size: 0.9rem;
|
||||
gap: 0.3rem;
|
||||
&--primary {
|
||||
background-color: var(--accent-color);
|
||||
@ -178,6 +176,9 @@ button {
|
||||
filter: saturate(0);
|
||||
}
|
||||
}
|
||||
a.button {
|
||||
background-color: #bd142e10;
|
||||
}
|
||||
.cert-card {
|
||||
display: grid;
|
||||
gap: 0.6rem;
|
||||
|
||||
13
index.html
13
index.html
@ -33,7 +33,7 @@
|
||||
<body>
|
||||
<section id="loader" class="page">
|
||||
<sm-spinner></sm-spinner>
|
||||
<p>Getting certificates</p>
|
||||
<p>Getting certificates from FLO blockchain</p>
|
||||
</section>
|
||||
<section id="home" class="page hidden">
|
||||
<header>
|
||||
@ -54,8 +54,8 @@
|
||||
</svg>
|
||||
</sm-input>
|
||||
<ul id="issued_cert_list" class="observe-empty-state"></ul>
|
||||
<div class="empty-state">
|
||||
<h2>No related certificates issued yet</h2>
|
||||
<div class="empty-state" style="text-align:center; padding: 3rem 1.5rem">
|
||||
<p>No related certificates issued yet</p>
|
||||
</div>
|
||||
</section>
|
||||
<script>
|
||||
@ -275,11 +275,11 @@
|
||||
</div>
|
||||
<h4 class="capitalize">${name.toLowerCase()}</h4>
|
||||
<p class="wrap-around">${floId}</p>
|
||||
<div class="flex align-items-center gap-0-5 margin-left-auto">
|
||||
<a href=${verificationLink} target="_blank" class="button">Verify</a>
|
||||
<div class="flex align-items-center gap-0-5">
|
||||
<a href=${`https://flosight.duckdns.org/tx/${txid}`} target="_blank" class="button">View on blockchain</a>
|
||||
<a href=${verificationLink} target="_blank" class="button margin-left-auto">Verify</a>
|
||||
<button class="download-button button button--primary" data-txid=${txid}>
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><rect fill="none" height="24" width="24"/></g><g><path d="M18,15v3H6v-3H4v3c0,1.1,0.9,2,2,2h12c1.1,0,2-0.9,2-2v-3H18z M17,11l-1.41-1.41L13,12.17V4h-2v8.17L8.41,9.59L7,11l5,5 L17,11z"/></g></svg>
|
||||
Download
|
||||
</button>
|
||||
</div>
|
||||
</li>
|
||||
@ -374,7 +374,6 @@
|
||||
function readTx() {
|
||||
return new Promise((resolve, reject) => {
|
||||
floBlockchainAPI.readAllTxs('FFCpiaZi31TpbYw5q5VNk8qJMeDiTLgsrE').then(res => {
|
||||
// res.unshift({ floData: 'CERTIFICATE OF INTERNSHIP|FPFeL5PXzW9bGosUjQYCxTHSMHidnygvvd|Sairaj mote|worked as an intern on projects for RanchiMall from 11th September 2020 to 2nd February 2021: Twitter Marketing and Peer-to-Peer Content Collaboration on FLO Blockchain. She contributed mostly to Twitter marketing and also collaborated with other content writers on writing articles for RanchiMall Times. She performed well under the guidance of the RIBC team of RanchiMall.', time: Date.now() })
|
||||
for (tx of res) {
|
||||
const { vin, vout, time, floData, txid } = tx
|
||||
if (!vin.some(i => i.addr === floGlobals.RM_CertificateIssuer_id)) continue;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user