kycnot.me/templates/service.html
2021-09-04 23:14:50 +02:00

304 lines
7.5 KiB
HTML

{% extends "base.html" %} {% block content %}
<div class="title-container">
<h1 class="title is-2">
<a href="{{service['url']}}" target="_blank">
{{service['name']}} <i class="fas fa-external-link-alt"></i>
</a>
</h2>
</div>
<div class="section header-section">
<figure class="image is-128x128">
<img
class="is-rounded"
src="../static/img/{{service['name'] | replace(' ', '') | lower}}.jpeg"
/>
</figure>
</div>
<div class="section short-description-section">
<div class="short-description">{{service['short-description']}}</div>
</div>
{%if tpinfo['score'] != False %}
<div class="section trustpilot">
<div class="trustpilot-stats">
<h3 style="margin: 1px;" class="title is-5"> <a href="{{tpinfo['link']}}" target="_blank">Trustpilot</a> Stats </h3>
<i class="fas fa-star"></i> {{tpinfo['score']}} <i class="fas fa-grip-lines-vertical"></i> {{tpinfo['count']}} Reviews
</div>
</div>
{%endif%}
<div class="section quick-info-panel">
<article class="panel is-info">
<p class="panel-heading">Quick Info</p>
<a class="panel-block">
<span class="panel-icon">
<i class="fab fa-bitcoin" aria-hidden="true"></i>
</span>
{% if service['btc'] %} BTC available {% else %}
<p style="color: rgb(209, 170, 42)">BTC not available</p>
{%endif%}
</a>
<a class="panel-block">
<span class="panel-icon">
<i class="fab fa-monero" aria-hidden="true"></i>
</span>
{% if service['xmr'] %} XMR available {% else %}
<p style="color: rgb(209, 170, 42)">XMR not available</p>
{%endif%}
</a>
<a class="panel-block">
{% if service['lnn'] %}
<span class="panel-icon">
<i class="fas fa-bolt" style="color: rgb(68, 68, 226);"></i>
</span>
Lightning network is available
{% else %}
<span class="panel-icon">
<i class="fas fa-bolt"></i>
</span>
<p style="color: rgb(209, 170, 42)">Lightning network is not available</p>
{%endif%}
</a>
<a class="panel-block">
<span class="panel-icon">
<i class="fas fa-mask"></i>
</span>
{% if not service['registration'] %} No account needed {% else %}
<p style="color: rgb(209, 170, 42)">Registration needed</p>
{%endif%}
</a>
{% if service['tor'] %}
<a href="{{service['tor-url']}}" class="panel-block">
<span class="panel-icon">
<i class="fas fa-bullseye"></i>
</span>
Tor available
</a>
{%endif%}
</article>
</div>
<div class="section long-description-section">
<article class="message long-description">
<div class="message-header">
<p>Description</p>
</div>
<div class="message-body">{{service['long-description']}}</div>
</article>
</div>
<section class="detailed-info-section">
<article class="message long-description">
{% if service['verified'] == True %}
<div class="message-header green">
<p><i class="fas fa-user-check"></i> Verified</p>
</div>
{%else%}
<div class="message-header yellow">
<p><i class="fas fa-user-times"></i> Not verified</p>
</div>
{%endif%}
<div class="message-body">
{% if service['verified'] %} This is a trusted service. It has been
tested by KYCNOT.ME or it has a long-time good reputation. {%else%} This
service has not been tested by KYCNOT.ME or does not have it doesn't have
a long or old enough good-review history. {%endif%}
</div>
</article>
<article class="message long-description">
{% if service['may-kyc'] %}
<div class="message-header yellow">
<p><i class="fas fa-theater-masks"></i> May KYC</p>
</div>
{%else%}
<div class="message-header green">
<p><i class="fas fa-user-ninja"></i> No KYC</p>
</div>
{%endif%}
<div class="message-body">
{% if service['may-kyc'] %} This service may request a KYC verification
if it finds your movements suspicious. {%else%} The service ToS do not
mention requiring KYC verifications at all. {%endif%}
</div>
</article>
<article class="message long-description">
{% if service['open-source'] %}
<div class="message-header green">
<p><i class="fas fa-code"></i> Open Source</p>
</div>
{%else%}
<div class="message-header yellow">
<p><i class="fas fa-box"></i> Not Open Source</p>
</div>
{%endif%}
<div class="message-body">
{% if service['open-source'] %} This service code is available for study.
{%else%} This service's code is not available. {%endif%}
</div>
</article>
{% if service['refunds'] %}
<article class="message long-description">
{% if service['refunds'] %}
<div class="message-header green">
<p><i class="fas fa-hand-holding-usd"></i> Refunds without KYC</p>
</div>
{%else%}
<div class="message-header yellow">
<p><i class="fas fa-times"></i> No Refunds</p>
</div>
{%endif%}
<div class="message-body">
{% if service['refunds'] %} You can get a refund without KYC.
{%else%} You can't get refunds or refunds need KYC. {%endif%}
</div>
</article>
{%endif%}
</section>
{% if service['tor-url'] %}
<div style="margin: 25px;" class="title-container">
<h5 style="padding: 9px; border: 1px solid #9d52e9; border-radius: 5px; width: 10rem;" class="subtitle is-5">
<a href="{{service['tor-url']}}"> <i class="fas fa-bullseye"></i> TOR ONION AVAILABLE </a>
</h5>
</div>
{% endif %}
{% if service['tos-url'] %}
<div style="padding-top: 20px; padding-bottom: 30px;" class="title-container">
<h3 class="title is-4">
<a href="{{service['tos-url']}}">
<i style="font-size: large;" class="far fa-file-alt"></i> Read service Terms and Conditions
<i class="fas fa-external-link-alt"></i
></a>
</h3>
</div>
{% endif %}
<style>
.trustpilot{
display: flex;
flex-direction: column;
align-items: center;
margin: 1px;
padding: 8px;
}
.trustpilot-stats{
border: 1px teal solid;
border-radius: 5px;
padding: 10px;
}
.title-container {
display: flex;
justify-content: center;
}
.title {
margin-bottom: 10px;
}
.detailed-info-section {
display: flex;
flex-direction: column;
align-items: center;
}
.message-header {
font-size: large;
}
.yellow {
background-color: rgb(182, 127, 8) !important;
}
.green {
background-color: rgb(7, 136, 0) !important;
}
.red {
background-color: rgb(182, 8, 8) !important;
}
.card-header-title {
border-radius: 5px;
}
.header-section {
display: flex;
justify-content: center;
align-items: center;
margin-top: 3px;
padding-top: 3px;
margin-bottom: 3px;
padding-bottom: 3px;
}
.long-description-section {
text-align: justify;
display: flex;
justify-content: center;
padding-top: 2px;
}
.long-description {
width: 80vw;
max-width: 860px;
margin: 10px;
}
.short-description-section {
text-align: justify;
display: flex;
justify-content: center;
padding-top: 10px;
padding-bottom: 3px;
}
.short-description {
border-bottom: lightgrey solid 1px;
max-width: 60vw;
}
.score {
margin: 3vh;
max-width: 15vh;
max-height: 8vh;
text-align: center;
}
.quick-info-panel {
display: flex;
justify-content: center;
}
.panel-block {
text-align: center;
}
.panel {
width: 80vh;
}
.panel-icon {
font-size: x-large;
}
.fa-external-link-alt {
font-size: small;
}
.fa-file-alt {
font-size: xx-large;
}
</style>
{% endblock %}