[gimp-web/header-image] Add extra css for non-js users to still see background img
- From: Pat David <patdavid src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gimp-web/header-image] Add extra css for non-js users to still see background img
- Date: Mon, 16 Jan 2017 19:13:05 +0000 (UTC)
commit 3636f23ac06bf679dcff4a1cb3ae94dc7d3dd593
Author: Pat David <patdavid gmail com>
Date: Mon Jan 16 13:11:37 2017 -0600
Add extra css for non-js users to still see background img
This just adds a new stylesheet (called at the end of the page
content) to include the default header image. This way non-js
users will still see a background image, but js users will get
a random header image as expected.
themes/newgimp/static/css/home-header.css | 3 +++
themes/newgimp/static/css/home.css | 1 +
themes/newgimp/templates/home.html | 3 ++-
3 files changed, 6 insertions(+), 1 deletions(-)
---
diff --git a/themes/newgimp/static/css/home-header.css b/themes/newgimp/static/css/home-header.css
new file mode 100644
index 0000000..4f09b87
--- /dev/null
+++ b/themes/newgimp/static/css/home-header.css
@@ -0,0 +1,3 @@
+#banner {
+ background-image: linear-gradient(rgba(44,52,80,0.5), rgba(44,62,80,0.5)),
url('/theme/images/Niagara_Rainbow.jpg');
+}
diff --git a/themes/newgimp/static/css/home.css b/themes/newgimp/static/css/home.css
index 2b746b7..a287465 100644
--- a/themes/newgimp/static/css/home.css
+++ b/themes/newgimp/static/css/home.css
@@ -15,6 +15,7 @@ p {
#banner {
min-height: 350px;
background-image: linear-gradient(rgba(44,52,80,0.5), rgba(44,62,80,0.5));
+ /*background-image: linear-gradient(rgba(44,52,80,0.5), rgba(44,62,80,0.5)),
url('/theme/images/Niagara_Rainbow.jpg'); */
background-position: 0;
background-size: cover;
transition: opacity 0.5s ease;
diff --git a/themes/newgimp/templates/home.html b/themes/newgimp/templates/home.html
index e2cafde..5fbfacb 100644
--- a/themes/newgimp/templates/home.html
+++ b/themes/newgimp/templates/home.html
@@ -274,7 +274,8 @@
</section>
-
+ <link rel='stylesheet' type='text/css' href="/theme/css/home-header.css" />
<!-- <script async src='/images/headers.json'></script> -->
<script async src='/js/rotateHeaderImg.js'></script>
+
{% endblock content %}
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]