boyan_k/reValuate
boyan_k/reValuate
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Templates basic formatting

Browse Source
This commit is contained in:
Velichko Karakostov 2021-08-28 00:41:10 +03:00
parent a1e8c902e2
commit 88d8de76ec
No known key found for this signature in database
GPG Key ID: D4463EC61D69232E
8 changed files with 99 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
reValuate/templates/base.html
View File

@ -1,9 +1,8 @@
<!DOCTYPE html> <!DOCTYPE html>
{% load static %}
{% load qr_code %}
<html>
<head> <head>
{% load static %}
{% load qr_code %}
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>{% block title %}reValuate{% endblock %}</title> <title>{% block title %}reValuate{% endblock %}</title>
@ -11,32 +10,30 @@
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="{% static 'home/css/style.css' %}"> <link rel="stylesheet" href="{% static 'home/css/style.css' %}">
<link rel="shortcut icon" type="image/png" href="{% static 'home/img/logo.png' %}"/> <link rel="shortcut icon" type="image/png" href="{% static 'home/img/logo.png' %}"/>
{% block optionalParams %}{% endblock %}
{% block optionalParams %} {% endblock %}
</head> </head>
<body> <body>
{% block aboveNav %} {% endblock %} {% block aboveNav %}{% endblock %}
<header id="navbar"> <header id="navbar">
<a class="logo" href="/"><img src="{% static 'home/img/logo.png' %}" style="max-height: 100px;" alt="logo"></a> <a class="logo" href="/"><img src="{% static 'home/img/logo.png' %}" style="max-height: 100px;" alt="logo"></a>
<nav> <nav>
<ul class="nav__links"> <ul class="nav__links">
<li><a href="{% url 'leaderboard' %}"><u>Класация</u></a></li> <li><a href="{% url 'leaderboard' %}"><u>Класация</u></a></li>
<li><a href="#"><u>За нас</u></a></li> <li><a href="#"><u>За нас</u></a></li>
{% if user.is_authenticated %} {% if user.is_authenticated %}
<li><a href="{% url 'Image' %}"><u>Качи</u></a></li> <li><a href="{% url 'Image' %}"><u>Качи</u></a></li>
<li><a href="{% url 'Media' %}"><u>Прогрес</u></a></li> <li><a href="{% url 'Media' %}"><u>Прогрес</u></a></li>
{% endif %} {% endif %}
{% if isProcessor %} {% if isProcessor %}
<li><a href="{% url 'admin' %}"><u>Админ</u></a></li> <li><a href="{% url 'admin' %}"><u>Админ</u></a></li>
{% endif %} {% endif %}
{% if isCashier %} {% if isCashier %}
<li><a href="{% url 'cashier' %}"><u>Качи</u></a></li> <li><a href="{% url 'cashier' %}"><u>Качи</u></a></li>
{% endif %} {% endif %}
</ul> </ul>
</nav> </nav>
{% if user.is_authenticated %} {% if user.is_authenticated %}
@ -44,7 +41,7 @@
{% else %} {% else %}
<a class="cta" href="{% url 'login' %}">Влез!</a> <a class="cta" href="{% url 'login' %}">Влез!</a>
{% endif %} {% endif %}
<p class="menu cta">Меню</p> <p class="menu cta">Меню</p>
</header> </header>
<div id="container"> <div id="container">
@ -54,7 +51,7 @@
<a href="{% url 'leaderboard' %}">Класация</a> <a href="{% url 'leaderboard' %}">Класация</a>
<a href="#">За нас</a> <a href="#">За нас</a>
{% if user.is_authenticated %} {% if user.is_authenticated %}
<a href="{% url 'logout' %}">Излез!</a> <a href="{% url 'logout' %}">Излез!</a>
{% else %} {% else %}
<a href="{% url 'login' %}">Влез!</a> <a href="{% url 'login' %}">Влез!</a>
{% endif %} {% endif %}
@ -64,13 +61,13 @@
{% if user.is_authenticated %} {% if user.is_authenticated %}
<a href="{% url 'Image' %}">Качи</a> <a href="{% url 'Image' %}">Качи</a>
<a href="{% url 'Media' %}">Прогрес</a> <a href="{% url 'Media' %}">Прогрес</a>
{% endif %} {% endif %}
</div> </div>
<script type="text/javascript" src="{% static 'home/js/mobile.js' %}"></script> <script type="text/javascript" src="{% static 'home/js/mobile.js' %}"></script>
</div> </div>
{% block content %} {% block content %}
{% endblock %} {% endblock %}
</div> </div>
</body> </body>
</html> </html>

19
reValuate/templates/getBalance.html
View File

@ -1,7 +1,7 @@
<!-- templates/home.html -->
{% extends 'base.html' %} {% extends 'base.html' %}
{% block title %}Home{% endblock %} {% block title %}Home{% endblock %}
{% block optionalParams%} {% block optionalParams%}
<style> <style>
.checkmark__circle { .checkmark__circle {
@ -13,7 +13,7 @@
fill: none; fill: none;
animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards; animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
} }
.checkmark { .checkmark {
width: 56px; width: 56px;
height: 56px; height: 56px;
@ -26,14 +26,14 @@
box-shadow: inset 0px 0px 0px #7ac142; box-shadow: inset 0px 0px 0px #7ac142;
animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both; animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
} }
.checkmark__check { .checkmark__check {
transform-origin: 50% 50%; transform-origin: 50% 50%;
stroke-dasharray: 48; stroke-dasharray: 48;
stroke-dashoffset: 48; stroke-dashoffset: 48;
animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards; animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
} }
@keyframes stroke { @keyframes stroke {
100% { 100% {
stroke-dashoffset: 0; stroke-dashoffset: 0;
@ -56,17 +56,18 @@
</style> </style>
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<div class="centered" style="text-align: center;"> <div class="centered" style="text-align: center;">
{% if user.is_authenticated %} {% if user.is_authenticated %}
{% if userBalance %} {% if userBalance %}
<h1 style="color:#7ac142;">Транзакцията е записана успешно!</h1> <h1 style="color:#7ac142;">Транзакцията е записана успешно!</h1>
Кликни <a style="color:#7ac142;"href="/remove_balance/">тук</a>, ако искаш да запишеш нова! Кликни <a style="color:#7ac142;"href="/remove_balance/">тук</a>, ако искаш да запишеш нова!
<svg class="checkmark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52 52"> <svg class="checkmark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52 52">
<circle class="checkmark__circle" cx="26" cy="26" r="25" fill="none"/> <circle class="checkmark__circle" cx="26" cy="26" r="25" fill="none"/>
<path class="checkmark__check" fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8"/> <path class="checkmark__check" fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8"/>
</svg> </svg>
{% endif %} {% endif %}
<div> <div>
{{ qr_code }} {{ qr_code }}

9
reValuate/templates/home.html
View File

@ -1,4 +1,8 @@
{% extends 'base.html' %} {% extends 'base.html' %}
{% load qr_code %}
{% load static %}
{% block optionalParams %} {% block optionalParams %}
<style> <style>
html{ html{
@ -11,8 +15,7 @@
} }
</style> </style>
{% endblock %} {% endblock %}
{% load qr_code %}
{% load static %}
{% block content %} {% block content %}
<div id="page-wrap"> <div id="page-wrap">
<h1 class="heading">reValuate</h1> <h1 class="heading">reValuate</h1>
@ -63,4 +66,4 @@
</div> </div>
<footer>Frontend, backend and planning:<br> <a class="footer" href="https://yamozha.xyz">Boyan</a></footer> <footer>Frontend, backend and planning:<br> <a class="footer" href="https://yamozha.xyz">Boyan</a></footer>
{% endblock %} {% endblock %}

17
reValuate/templates/leaderboard.html
View File

@ -1,17 +1,18 @@
{% extends 'base.html' %} {% extends 'base.html' %}
{% block title %}Класация{% endblock %} {% block title %}Класация{% endblock %}
{% block optionalParams %} {% block optionalParams %}
<style> <style>
html{ html{
background: linear-gradient(180deg, rgba(70,147,48,1) 33%, rgba(109,126,107,1) 100%) no-repeat center center fixed; background: linear-gradient(180deg, rgba(70,147,48,1) 33%, rgba(109,126,107,1) 100%) no-repeat center center fixed;
-webkit-background-size: cover; -webkit-background-size: cover;
-moz-background-size: cover; -moz-background-size: cover;
-o-background-size: cover; -o-background-size: cover;
background-size: cover; background-size: cover;
font-family: Arial, Helvetica, sans-serif; font-family: Arial, Helvetica, sans-serif;
} }
.content{ .content{
position: absolute; position: absolute;
@ -74,4 +75,4 @@ ul{
{% endfor %} {% endfor %}
</div> </div>
</div> </div>
{% endblock %} {% endblock %}

16
reValuate/templates/registration/login.html
View File

@ -3,15 +3,15 @@
{% block title %}Login{% endblock %} {% block title %}Login{% endblock %}
{% block optionalParams %} {% block optionalParams %}
<style> <style>
html{ html{
background: linear-gradient(180deg, rgba(70,147,48,1) 33%, rgba(109,126,107,1) 100%) no-repeat center center fixed; background: linear-gradient(180deg, rgba(70,147,48,1) 33%, rgba(109,126,107,1) 100%) no-repeat center center fixed;
-webkit-background-size: cover; -webkit-background-size: cover;
-moz-background-size: cover; -moz-background-size: cover;
-o-background-size: cover; -o-background-size: cover;
background-size: cover; background-size: cover;
font-family: Arial, Helvetica, sans-serif; font-family: Arial, Helvetica, sans-serif;
} }
.buttons{ .buttons{
background-color: #469330; background-color: #469330;
border: none; border: none;

16
reValuate/templates/registration/signup.html
View File

@ -5,17 +5,17 @@
<style> <style>
html{ html{
background: linear-gradient(180deg, rgba(70,147,48,1) 33%, rgba(109,126,107,1) 100%) no-repeat center center fixed; background: linear-gradient(180deg, rgba(70,147,48,1) 33%, rgba(109,126,107,1) 100%) no-repeat center center fixed;
-webkit-background-size: cover; -webkit-background-size: cover;
-moz-background-size: cover; -moz-background-size: cover;
-o-background-size: cover; -o-background-size: cover;
background-size: cover; background-size: cover;
font-family: Arial, Helvetica, sans-serif; font-family: Arial, Helvetica, sans-serif;
} }
#page-wrap{ #page-wrap{
padding: 20vh; padding: 20vh;
} }
</style> </style>
{% endblock %} {% endblock %}
{% block content %} {% block content %}

26
reValuate/templates/showAllImage.html
View File

@ -1,6 +1,8 @@
{% extends 'base.html' %} {% extends 'base.html' %}
{% load static %} {% load static %}
{% block title %} My Images {% endblock %} {% block title %} My Images {% endblock %}
{% block optionalParams %} {% block optionalParams %}
<link rel="stylesheet" href="{% static 'home/css/gallery.css' %}"> <link rel="stylesheet" href="{% static 'home/css/gallery.css' %}">
<style> <style>
@ -28,21 +30,21 @@
<div class="transparent-box"> <div class="transparent-box">
<div class="caption"> <div class="caption">
{% if i.reason %} {% if i.reason %}
<p> ❌ Видеото ти е маркирана като невалидно.</p> <p> ❌ Видеото ти е маркирана като невалидно.</p>
<p class="opacity-low">Ако мислиш че има грешка ни изпратете <a href="mailto:boyan+revaluate@bobokara.com">имейл.</a></p> <p class="opacity-low">Ако мислиш че има грешка ни изпратете <a href="mailto:boyan+revaluate@bobokara.com">имейл.</a></p>
{% elif i.tokenized %} {% elif i.tokenized %}
<p > ✅ Видеото ти е валидно!</p> <p > ✅ Видеото ти е валидно!</p>
<p class="opacity-low">Провери баланса си!</p> <p class="opacity-low">Провери баланса си!</p>
{% else %} {% else %}
<p> ⏳ Видеото ти очаква обработка!</p> <p> ⏳ Видеото ти очаква обработка!</p>
{% endif %} {% endif %}
</div> </div>
</div> </div>
</div> </div>
{% else %} {% else %}
<div class="gallery-image popup"> <div class="gallery-image popup">
<div class="img-box"> <div class="img-box">
@ -50,20 +52,20 @@
<div class="transparent-box"> <div class="transparent-box">
<div class="caption"> <div class="caption">
{% if i.reason %} {% if i.reason %}
<p> ❌ Снимката ти е маркирана като невалидна.</p> <p> ❌ Снимката ти е маркирана като невалидна.</p>
<p class="opacity-low">Ако мислиш че има грешка ни изпратете <a href="mailto:boyan+revaluate@bobokara.com">имейл.</a></p> <p class="opacity-low">Ако мислиш че има грешка ни изпратете <a href="mailto:boyan+revaluate@bobokara.com">имейл.</a></p>
{% elif i.tokenized %} {% elif i.tokenized %}
<p > ✅ Снимката ти е валидна!</p> <p > ✅ Снимката ти е валидна!</p>
<p class="opacity-low">Провери баланса си!</p> <p class="opacity-low">Провери баланса си!</p>
{% else %} {% else %}
<p> ⏳ Снимката ти очаква обработка!</p> <p> ⏳ Снимката ти очаква обработка!</p>
{% endif %} {% endif %}
</div> </div>
</div> </div>
</div> </div>
<!-- <!--
<p style="text-shadow: 0 0 2px #28a745; float: left;">{{forloop.counter}}/{{img_number}} <p style="text-shadow: 0 0 2px #28a745; float: right;">{{i.date}}</p></p> --> <p style="text-shadow: 0 0 2px #28a745; float: left;">{{forloop.counter}}/{{img_number}} <p style="text-shadow: 0 0 2px #28a745; float: right;">{{i.date}}</p></p> -->
<!-- <br><br> <!-- <br><br>
--> -->

60
reValuate/templates/uploadImage.html
View File

@ -12,7 +12,7 @@
fill: none; fill: none;
animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards; animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
} }
.checkmark { .checkmark {
width: 56px; width: 56px;
height: 56px; height: 56px;
@ -25,14 +25,14 @@
box-shadow: inset 0px 0px 0px #7ac142; box-shadow: inset 0px 0px 0px #7ac142;
animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both; animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
} }
.checkmark__check { .checkmark__check {
transform-origin: 50% 50%; transform-origin: 50% 50%;
stroke-dasharray: 48; stroke-dasharray: 48;
stroke-dashoffset: 48; stroke-dashoffset: 48;
animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards; animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
} }
@keyframes stroke { @keyframes stroke {
100% { 100% {
stroke-dashoffset: 0; stroke-dashoffset: 0;
@ -70,35 +70,35 @@
} }
.closebtn:hover { .closebtn:hover {
color: black; color: black;
} }
.buttons{ .buttons{
margin-top: 10%; margin-top: 10%;
background-color: #469330; background-color: #469330;
border: none; border: none;
color: white; color: white;
padding: 15px 32px; padding: 15px 32px;
text-align: center; text-align: center;
text-decoration: none; text-decoration: none;
display: inline-block; display: inline-block;
font-size: 16px; font-size: 16px;
margin: 4px 2px; margin: 4px 2px;
cursor: pointer; cursor: pointer;
} }
html{ html{
background: linear-gradient(180deg, rgba(70,147,48,1) 33%, rgba(109,126,107,1) 100%) no-repeat center center fixed; background: linear-gradient(180deg, rgba(70,147,48,1) 33%, rgba(109,126,107,1) 100%) no-repeat center center fixed;
-webkit-background-size: cover; -webkit-background-size: cover;
-moz-background-size: cover; -moz-background-size: cover;
-o-background-size: cover; -o-background-size: cover;
background-size: cover; background-size: cover;
font-family: Arial, Helvetica, sans-serif; font-family: Arial, Helvetica, sans-serif;
} }
#page-wrap{ #page-wrap{
padding: 20vh; padding: 20vh;
} }
</style> </style>
@ -121,7 +121,7 @@
<circle class="checkmark__circle" cx="26" cy="26" r="25" fill="none"/> <circle class="checkmark__circle" cx="26" cy="26" r="25" fill="none"/>
<path class="checkmark__check" fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8"/> <path class="checkmark__check" fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8"/>
</svg> </svg>
{% else %} {% else %}
<form method="post" enctype="multipart/form-data"> <form method="post" enctype="multipart/form-data">
{% csrf_token %} {% csrf_token %}
<label for="image" style="font-size: 32px;">Качи снимка! </label><br><br><br> <label for="image" style="font-size: 32px;">Качи снимка! </label><br><br><br>
@ -131,7 +131,7 @@
</form> </form>
<br><br> <br><br>
{% endif %} {% endif %}
{% else %} {% else %}
<p>You are not logged in</p> <p>You are not logged in</p>
<a href="{% url 'login' %}">Log In</a> <a href="{% url 'login' %}">Log In</a>