Improved the overall responsiveness and the styling of the pages

This commit is contained in:
xemeds
2020-08-20 09:43:52 +03:00
parent 59cbba9d03
commit 3613fe57ec
6 changed files with 50 additions and 51 deletions
+31 -30
View File
@@ -33,37 +33,33 @@ body {
}
.desc {
font-size: 25px;
font-weight: bold;
color: #ffffff;
}
.container {
position: absolute;
left: 0;
right: 0;
.url-form {
z-index: 100;
background-color: #2c2c2c;
border-radius: 8px;
padding: 30px 0px;
padding: 30px;
box-shadow: 0px 10px 20px #000000;
width: 80vw;
height: 100px;
margin: 35vh auto 0 auto;
margin: 35vh 10vw 0 10vw;
}
.inputs {
display: flex;
justify-content: center;
height: 50px;
margin-top: 25px;
.input-list {
width: 100%;
list-style: none;
text-align: center;
}
.url {
width: 80%;
padding: 10px;
background: #121212;
border: 2px solid #bb86fc;
color: #ffffff;
width: 60%;
padding: 10px 10px;
margin-bottom: 2vh;
}
.url:focus {
@@ -71,15 +67,13 @@ body {
}
.button {
width: 100px;
background: #bb86fc;
border: 2px solid #bb86fc;
border-radius: 3px;
padding: 10px;
color: #000000;
font-weight: bold;
display: inline-block;
padding: 0 1vw 0 1vw;
margin-left: 1vw;
width: auto;
}
.button:hover {
@@ -90,18 +84,15 @@ body {
.url-error-message {
color: #ffffff;
text-align: center;
font-size: 100%;
margin: 2vh 0 0 0;
margin: -1vh 0 2vh 0;
}
.error-message {
position: absolute;
left: 0;
right: 0;
color: #ffffff;
text-align: center;
margin: 40vh auto 0 auto;
font-size: 30px;
color: #ffffff;
font-size: 50px;
font-weight: bold;
margin: 35vh auto 0 auto;
}
.donation {
@@ -115,11 +106,21 @@ body {
margin: 30vh auto 0 auto;
}
.donation h1 {
.donation-title {
font-size: 40px;
font-weight: bold;
margin-bottom: 2vh;
}
.donation h4 {
.donation-patreon {
font-size: 30px;
font-weight: bold;
margin-bottom: 5vh;
}
.donation-bitcoin {
font-size: 16px;
font-weight: bold;
margin-bottom: 4vh;
}
+4 -4
View File
@@ -2,9 +2,9 @@
{% block body %}
<ul class="donation">
<li><h1>Bitcoin Address</h1></li>
<li><h4>1Mg55rPVuQ2P8zKsCcLdsmgqH24uLXfLbR</h4></li>
<li><h1>Patreon</h1></li>
<li><a href="https://www.patreon.com/xemeds" target="_blank"><h3>patreon.com/xemeds</h3></a></li>
<li><p class="donation-title">Patreon</p></li>
<li><a href="https://www.patreon.com/xemeds" target="_blank"><p class="donation-patreon">patreon.com/xemeds</p></a></li>
<li><p class="donation-title">Bitcoin</p></li>
<li><p class="donation-bitcoin">1Mg55rPVuQ2P8zKsCcLdsmgqH24uLXfLbR</p></li>
</ul>
{% endblock %}
+2 -2
View File
@@ -2,7 +2,7 @@
{% block body %}
<ul class="error-message">
<li><h1>{{ error_code }}</h1></li>
<li><h1>{{ error_message }}</h1></li>
<li><p>{{ error_code }}</p></li>
<li><p>{{ error_message }}</p></li>
</ul>
{% endblock %}
+7 -9
View File
@@ -1,18 +1,16 @@
{% extends "layout.html" %}
{% block body %}
<div class="container">
<form method="POST" action="">
{{ form.hidden_tag() }}
<div class="inputs">
{{ form.url(placeholder="Enter the URL here", autofocus=true, class="url") }}
{{ form.submit(class="button") }}
</div>
<form method="POST" action="" class="url-form">
{{ form.hidden_tag() }}
<ul class='input-list'>
{% if form.url.errors %}
{% for error in form.url.errors %}
<p class="url-error-message">{{ error }}</p>
{% endfor %}
{% endif %}
</form>
</div>
<li>{{ form.url(placeholder="Enter the URL here", autofocus=true, class="url") }}</li>
<li>{{ form.submit(class="button") }}</li>
</ul>
</form>
{% endblock %}
+1 -1
View File
@@ -18,7 +18,7 @@
<body onload="typeTitle()">
<div class="headers">
<a class="title" id="title" href="{{ url_for('index') }}"></a>
<h1 id="desc" class="desc"></h1>
<p id="desc" class="desc"></p>
</div>
{% else %}
<body>
+5 -5
View File
@@ -1,10 +1,10 @@
{% extends "layout.html" %}
{% block body %}
<div class="container">
<div class="inputs">
<input type="text" value="{{ url }}" id="url" class="url" readonly>
<button onclick="copyURL()" class="button">Copy</button>
</div>
<div class="url-form">
<ul class='input-list'>
<li><input type="text" value="{{ url }}" id="url" class="url" readonly></li>
<li><button onclick="copyURL()" class="button">Copy</button></li>
</ul>
</div>
{% endblock %}