redo html hierarchy and add basic css
This commit is contained in:
		
							parent
							
								
									fcab3fb6c3
								
							
						
					
					
						commit
						2c19c2fd31
					
				
					 5 changed files with 86 additions and 12 deletions
				
			
		
							
								
								
									
										72
									
								
								static/style.css
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										72
									
								
								static/style.css
									
										
									
									
									
										Normal file
									
								
							|  | @ -0,0 +1,72 @@ | |||
| /* http://meyerweb.com/eric/tools/css/reset/ | ||||
|    v2.0 | 20110126 | ||||
|    License: none (public domain) | ||||
| */ | ||||
| 
 | ||||
| html, body, div, span, applet, object, iframe, | ||||
| h1, h2, h3, h4, h5, h6, p, blockquote, pre, | ||||
| a, abbr, acronym, address, big, cite, code, | ||||
| del, dfn, em, img, ins, kbd, q, s, samp, | ||||
| small, strike, strong, sub, sup, tt, var, | ||||
| b, u, i, center, | ||||
| dl, dt, dd, ol, ul, li, | ||||
| fieldset, form, label, legend, | ||||
| table, caption, tbody, tfoot, thead, tr, th, td, | ||||
| article, aside, canvas, details, embed, | ||||
| figure, figcaption, footer, header, hgroup, | ||||
| menu, nav, output, ruby, section, summary, | ||||
| time, mark, audio, video { | ||||
| 	margin: 0; | ||||
| 	padding: 0; | ||||
| 	border: 0; | ||||
| 	font-size: 100%; | ||||
| 	font: inherit; | ||||
| 	font-family: monospace, monospace; | ||||
| 	vertical-align: baseline; | ||||
| } | ||||
| /* HTML5 display-role reset for older browsers */ | ||||
| article, aside, details, figcaption, figure, | ||||
| footer, header, hgroup, menu, nav, section { | ||||
| 	display: block; | ||||
| } | ||||
| body { | ||||
| 	line-height: 1; | ||||
| } | ||||
| ol, ul { | ||||
| 	list-style: none; | ||||
| } | ||||
| blockquote, q { | ||||
| 	quotes: none; | ||||
| } | ||||
| blockquote:before, blockquote:after, | ||||
| q:before, q:after { | ||||
| 	content: ''; | ||||
| 	content: none; | ||||
| } | ||||
| table { | ||||
| 	border-collapse: collapse; | ||||
| 	border-spacing: 0; | ||||
| } | ||||
| 
 | ||||
| menu { | ||||
|     display: flex; | ||||
|     list-style: none; | ||||
|     width: 100%; | ||||
|     background-color: #333333; | ||||
|     color: #eeeeee; | ||||
| } | ||||
| menu li { | ||||
|     padding: 1em; | ||||
|     margin: 0; | ||||
|     border: 0.1em solid #9f9f9f; | ||||
| } | ||||
| menu li:hover { | ||||
|     background-color: #9f9f9f; | ||||
|     cursor: pointer; | ||||
| } | ||||
| 
 | ||||
| #content { | ||||
|     display: flex; | ||||
|     align-items: center; | ||||
|     justify-content: center; | ||||
| } | ||||
|  | @ -1,5 +1,3 @@ | |||
| {% extends 'index.html' %} | ||||
| 
 | ||||
| {% block content %} | ||||
| <ul> | ||||
| {% for torrent in torrents %} | ||||
|  |  | |||
|  | @ -5,18 +5,18 @@ | |||
|   <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||||
|   <title>Search and download torrents directly to mediacenter</title> | ||||
|   <script src="https://unpkg.com/htmx.org@2.0.0" integrity="sha384-wS5l5IKJBvK6sPTKa2WZ1js3d947pvWXbPJ1OmWfEuxLgeHcEbjUUA5i9V5ZkpCw" crossorigin="anonymous"></script> | ||||
|   <link href="{{ url_for('static', path='/style.css') }}" rel="stylesheet"> | ||||
| </head> | ||||
| <body> | ||||
|     <div id="content"> | ||||
|     <menu> | ||||
|         <li hx-get="/" hx-replace-url="/" hx-target="#content">Search</li> | ||||
|         <li hx-get="/search" hx-replace-url="/search" hx-target="#content">Search</li> | ||||
|         <li hx-get="/active" hx-replace-url="/active" hx-target="#content">Active downloads</li> | ||||
|     </menu> | ||||
|     <div id="content"> | ||||
|         {% block content %} | ||||
|         <form hx-get="/list" hx-replace-url="true" hx-target="#content"> | ||||
|             <input type=text name=query /> | ||||
|             <button type=submit>search</button> | ||||
|         </form> | ||||
|             {% if include_template %} | ||||
|                 {% include include_template %} | ||||
|             {% endif %} | ||||
|         {% endblock %} | ||||
|     </div> | ||||
| </body> | ||||
|  |  | |||
							
								
								
									
										6
									
								
								templates/search.html
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										6
									
								
								templates/search.html
									
										
									
									
									
										Normal file
									
								
							|  | @ -0,0 +1,6 @@ | |||
| {% block content %} | ||||
|     <form hx-get="/list" hx-replace-url="true" hx-target="#content"> | ||||
|         <input type=text name=query /> | ||||
|         <button type=submit>search</button> | ||||
|     </form> | ||||
| {% endblock %} | ||||
|  | @ -1,9 +1,7 @@ | |||
| {% extends 'index.html' %} | ||||
| 
 | ||||
| {% block content %} | ||||
| <ul> | ||||
| <ul class="torrents"> | ||||
| {% for torrent in torrents %} | ||||
| <li hx-get="/download?{{ torrent.magnetlink | safe }}" hx-target="#content" hx-replace-url="/active"> | ||||
| <li hx-get="/download?{{ torrent.magnetlink | safe }}" hx-target="#content" hx-replace-url="/active" hx-push-url="true"> | ||||
|     <span>{{ torrent.title }}</span> | ||||
|     <span>({{ torrent.seeds }})</span> | ||||
|     <span>({{ torrent.leeches }})</span> | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue