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