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