nahakubuilder/flask_url_shortener
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Made the home page more responsive

Browse Source
This commit is contained in:
xemeds
2020-07-19 16:51:54 +00:00
parent 16f562441d
commit 0cddb3e4a6
3 changed files with 48 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tiny0/static/style.css
+38 -35
View File
@@ -1,49 +1,52 @@
body { * {
margin: 0; margin: 0;
padding: 0; padding: 0;
font-family: sans-serif; font-family: sans-serif;
background: #121212;
} }
.form { body {
background: #2c2c2c; background: #121212;
border-radius: 15px;
padding: 7% 0; }
position: absolute;
width: 85%; .container {
top: 30%; background-color: #2c2c2c;
left: 50%; border-radius: 8px;
transform: translate(-50%,-50%); padding: 30px 0px;
text-align: center; box-shadow: 0px 10px 20px #000000;
width: 80vw;
height: auto;
margin: 10% auto 0 auto;
}
.inputs {
display: flex;
justify-content: center;
} }
.url { .url {
background: #121212; background: #121212;
border: 2px solid #bb86fc; border: 2px solid #bb86fc;
border-radius: 5px; color: #ffffff;
padding: 2% 2%; width: 60%;
width: 50%; padding: 10px 10px;
margin-left: 2%; margin-left: 3%;
color: #ffffff;
} }
.url:focus { .url:focus {
border-color: #7b59a5; border-color: #7b59a5;
} }
.submit { .submit {
background: #bb86fc; background: #bb86fc;
border: 2px solid #bb86fc; border: 2px solid #bb86fc;
border-radius: 5px; border-radius: 3px;
padding: 1% 1%; color: #000000;
display: inline-block; display: inline-block;
margin: 1% 1% 0px 1%; margin: 0 3% 0 1%;
color: #000000;
font-weight: bold;
font-size: 120%;
} }
.submit:hover { .submit:hover {
background: #7b59a5; background: #7b59a5;
border-color: #7b59a5; border-color: #7b59a5;
} }
tiny0/templates/index.html
+9 -5
View File
@@ -1,9 +1,13 @@
{% extends "layout.html" %} {% extends "layout.html" %}
{% block body %} {% block body %}
<form method="POST" action="" class="form"> <div class="container">
{{ form.hidden_tag() }} <form method="POST" action="">
{{ form.url(placeholder="Enter the URL here", class="url") }} {{ form.hidden_tag() }}
{{ form.submit(class="submit") }} <div class="inputs">
</form> {{ form.url(placeholder="Enter the URL here", class="url") }}
{{ form.submit(class="submit") }}
</div>
</form>
</div>
{% endblock %} {% endblock %}
tiny0/templates/layout.html
+1
View File
@@ -2,6 +2,7 @@
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link href="/static/style.css" rel="stylesheet" type="text/css"/> <link href="/static/style.css" rel="stylesheet" type="text/css"/>