From 03a155c17bff22070dbe202c77eebf3738c33caa Mon Sep 17 00:00:00 2001
From: rubenwardy <rw@rubenwardy.com>
Date: Fri, 21 Dec 2018 16:06:52 +0000
Subject: [PATCH] Improve package page style further

---
 app/scss/main.scss               |  6 ++++++
 app/templates/packages/view.html | 11 +++++++----
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/app/scss/main.scss b/app/scss/main.scss
index d5836c0d..4f9e1ef3 100644
--- a/app/scss/main.scss
+++ b/app/scss/main.scss
@@ -11,3 +11,9 @@
 .nav-link > img {
 	max-height: 1em;
 }
+
+.jumbotron {
+    background-size: cover;
+    background-repeat: no-repeat;
+    background-position: center;
+}
diff --git a/app/templates/packages/view.html b/app/templates/packages/view.html
index bedbe82a..f2496281 100644
--- a/app/templates/packages/view.html
+++ b/app/templates/packages/view.html
@@ -1,3 +1,5 @@
+{% set query=package.name %}
+
 {% extends "base.html" %}
 
 {% block title %}
@@ -80,7 +82,7 @@
 		{% endif %}
 	{% endif %}
 
-	<header class="jumbotron mb-0">
+	<header class="jumbotron mb-0" style="background-image: url('{{ package.getMainScreenshotURL() }}')">
 		<div class="container">
 			<h1 class="display-3">{{ package.title }} by {{ package.author.display_name }}</h1>
 
@@ -91,7 +93,7 @@
 	</header>
 
 	<main class="container">
-		<div class="row mt-1 mb-4 ">
+		<div class="row mt-1 mb-4">
 			<div class="col">
 				{% if package.getDownloadRelease() %}
 					<a class="btn btn-success" href="{{ package.getDownloadURL() }}" class="btn_green">Download</a>
@@ -119,7 +121,7 @@
 			</div>
 		</div>
 
-		<aside class="float-right" style="width: 18rem;">
+		<aside class="float-right ml-4" style="width: 18rem;">
 			<div class="card">
 				<div class="card-header">
 					Details
@@ -150,7 +152,8 @@
 						<tr>
 							<td>Provides</td>
 							<td>{% for meta in package.provides %}
-								<a href="{{ url_for('meta_package_page', name=meta.name) }}">{{ meta.name }}</a>
+								<a class="badge badge-primary"
+								 href="{{ url_for('meta_package_page', name=meta.name) }}">{{ meta.name }}</a>
 								{%- if not loop.last %}
 								,
 								{% endif %}