UI no longer looks like shit
This commit is contained in:
parent
e77154f68b
commit
f24699f564
|
@ -1,4 +1,4 @@
|
||||||
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300);
|
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,700);
|
||||||
|
|
||||||
/* Being lazy 101 */
|
/* Being lazy 101 */
|
||||||
* {
|
* {
|
||||||
|
@ -8,39 +8,52 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
font-family: "Lato", sans-serif;
|
font-family: "Open Sans", "Lato", sans-serif;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
background-color: #2d2d2d;
|
background-color: #2d2d2d;
|
||||||
}
|
}
|
||||||
|
|
||||||
.header {
|
|
||||||
width: 100%;
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.header h1 {
|
|
||||||
font-size: 36pt;
|
|
||||||
font-weight: 300;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.header .inner {
|
|
||||||
width: 100%;
|
|
||||||
max-width: 920px;
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.page {
|
.page {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
max-width: 920px;
|
max-width: 920px;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
margin-right: auto;
|
margin-right: auto;
|
||||||
|
margin-top: 50vh;
|
||||||
|
transform: translateY(-50%)
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 34pt;
|
||||||
|
font-weight: 300;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.links {
|
||||||
|
font-size: 0;
|
||||||
|
margin-top: 20px;
|
||||||
|
text-align: center;
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.links li {
|
||||||
|
font-size: 12pt;
|
||||||
|
display: inline-block;
|
||||||
|
padding: 5px;
|
||||||
|
width: 25%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.links li a {
|
||||||
|
color: inherit;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.links li a:hover {
|
||||||
|
text-decoration: underline;
|
||||||
}
|
}
|
||||||
|
|
||||||
.uploadForm {
|
.uploadForm {
|
||||||
margin-top: 80px;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
|
@ -7,13 +7,6 @@
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="header">
|
|
||||||
<div class="inner">
|
|
||||||
<h1>
|
|
||||||
{{ page.title }}
|
|
||||||
</h1>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="page">
|
<div class="page">
|
||||||
{% block body %}{% endblock %}
|
{% block body %}{% endblock %}
|
||||||
</div>
|
</div>
|
|
@ -1,14 +1,31 @@
|
||||||
{% extends "layout.html" %}
|
{% extends "shell.html" %}
|
||||||
{% block body %}
|
{% block body %}
|
||||||
|
<h1 class="title">
|
||||||
|
QuadFile
|
||||||
|
</h1>
|
||||||
<form action="" id="form" name="fileForm" method="post" enctype="multipart/form-data" class="uploadForm">
|
<form action="" id="form" name="fileForm" method="post" enctype="multipart/form-data" class="uploadForm">
|
||||||
<div class="uploadButton">
|
<div class="uploadButton">
|
||||||
<p>
|
<p>
|
||||||
Select a file
|
Click to select a file
|
||||||
</p>
|
</p>
|
||||||
<input id="file" type="file" name="file">
|
<input id="file" type="file" name="file">
|
||||||
</div>
|
</div>
|
||||||
<input type="hidden" name="source" value="web">
|
<input type="hidden" name="source" value="web">
|
||||||
</form>
|
</form>
|
||||||
|
<ul class="links">
|
||||||
|
<li>
|
||||||
|
<a href="/about">About</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="/faq">F.A.Q</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="/sharex">ShareX</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="/terms">Terms</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
<script>
|
<script>
|
||||||
document.getElementById("file").onchange = function() {
|
document.getElementById("file").onchange = function() {
|
||||||
document.getElementById("form").submit();
|
document.getElementById("form").submit();
|
||||||
|
|
Loading…
Reference in New Issue