Add GitHub Sponsors announcement

2 files changed, 27 insertions, 6 deletions

diff --git a/www/header.asciidoc b/www/header.asciidoc
index 258271ae6..2f8ed6a1e 100644
--- a/www/header.asciidoc
+++ b/www/header.asciidoc
@@ -16,5 +16,21 @@
 	<a href="https://www.github.com/qutebrowser/qutebrowser">GitHub</a>
 	<a href="https://github.com/qutebrowser/qutebrowser/releases">Releases</a>
 	<a href="https://blog.qutebrowser.org/">Blog</a>
+	<a href="https://github.com/sponsors/The-Compiler/" id="announcement-button">❤ Donate</a>
+</div>
+<div id="announcement">
+<p>
+<b>qutebrowser's primary maintainer, The-Compiler, is currently working
+part-time on qutebrowser, funded by donations.</b></p>
+<p>To sustain this for a long
+time, your help is needed! See the
+<a href="https://github.com/sponsors/The-Compiler/">GitHub Sponsors page</a> for more
+information. Depending on your sign-up date and how long you keep a certain
+level, you can get qutebrowser t-shirts, stickers and more!
+</p>
+<p>
+Thanks to the GitHub Sponsors Matching Fund, all donations done via GitHub
+Sponsors (up to a $5000 total) will be doubled until October 2020.
+</p>
 </div>
 +++
diff --git a/www/qute.css b/www/qute.css
index 9fa8dbebc..578fecbbd 100644
--- a/www/qute.css
+++ b/www/qute.css
@@ -28,7 +28,7 @@ p {
 	padding: 20px 20px;
 	overflow: auto;
 	color: #888;
-	
+
 	-webkit-user-select: none;
 	-moz-user-select: none;
 	-ms-user-select: none;
@@ -64,12 +64,17 @@ p {
     margin-bottom: 10px;
 }
 
+#menu > #announcement-button {
+    color: #000000;
+    background-color: #a6dfff;
+}
+
 #menu {
 	padding: 0px 20px;
 	background-color: #555555;
 	color: #CCC;
 	overflow: auto;
-	
+
 	-webkit-user-select: none;
 	-moz-user-select: none;
 	-ms-user-select: none;
@@ -121,7 +126,7 @@ h1, h2, h3, h4, h5, h6 {
 
 .ulist {
 	padding-left: 20px;
-	margin-top: 10px; 
+	margin-top: 10px;
 }
 
 #footer {
@@ -203,11 +208,11 @@ table td {
 		height: auto;
 		float: none;
 	}
-	
+
 	#headline .text {
 		display: none;
 	}
-	
+
 	#menu {
 		padding: 0px 0px;
 		background-color: #555555;
@@ -215,7 +220,7 @@ table td {
 		overflow: hidden;
 		width: 100%;
 	}
-	
+
 	#menu a {
 		color: #CCC;
 		text-decoration: none;