[gimp-web/gimp-web-static] Monkeying with front page layout stuff

[Pat David <patdavid src gnome org>]

commit 2bf84eb3b737c64794792c670644439a396a9712
Author: Pat David <patdavid gmail com>
Date:   Thu Aug 20 12:19:50 2015 -0500

    Monkeying with front page layout stuff

 content/images/frontpage/dot.jpg   |  Bin 0 -> 188026 bytes
 themes/newgimp/static/css/home.css |  169 ++++++++++++++++++++++++++++++++++++
 themes/newgimp/templates/home.html |    4 +-
 3 files changed, 171 insertions(+), 2 deletions(-)
---
diff --git a/content/images/frontpage/dot.jpg b/content/images/frontpage/dot.jpg
new file mode 100644
index 0000000..ba3531e
Binary files /dev/null and b/content/images/frontpage/dot.jpg differ
diff --git a/themes/newgimp/static/css/home.css b/themes/newgimp/static/css/home.css
new file mode 100644
index 0000000..d88a267
--- /dev/null
+++ b/themes/newgimp/static/css/home.css
@@ -0,0 +1,169 @@
+#banner {
+    min-height: 350px;
+    background-image: linear-gradient(rgba(44,52,80,0.5), rgba(44,62,80,0.5)), 
url('/theme/images/cotton.jpg');
+    background-position: 0;
+    background-size: cover;
+}
+
+#banner h1 {
+    font-size: 11rem;
+    font-family: "League Gothic", sans;
+    font-weight: 400;
+    margin-right: 1rem;
+}
+
+#banner .intro {
+    margin: 2rem 0;
+}
+
+#banner .intro img {
+    display: inline;
+    margin: 0;
+    height: 150px;
+    width: 200px;
+}
+
+#banner .intro a {
+    text-decoration: none;
+    color: white;
+}
+
+#banner .introInfo {
+    display: inline-block;
+    color: white;
+    font-family: Ostrich Sans Rounded, sans;
+    margin-top: -2rem;
+}
+
+.introInfo span {
+    display: table-row;
+}
+
+span#gFirst {
+    font-size: 4rem;
+    line-height: 0;
+    line-height: 1rem;
+    font-size: 4.5rem;
+    text-align: left;
+}
+
+span#gSecond {
+    font-size: 2.5rem;
+    line-height: 3rem;
+}
+
+span#gThird span {
+    display: inline;
+}
+
+#DLButton {
+    font-family: League Gothic, sans;
+    font-size: 1.5rem;
+    /* border: solid 2px white; */
+    background-color: #e74c3c;
+    padding: 0 0.7rem;
+    float: left;
+    color: white;
+}
+
+#ReleaseButton {
+    font-size: 1.5rem;
+    /* border: solid 1px white; */
+    background-color: #2c3e50;
+    padding:0 0.7rem;
+    float: right;
+    margin-left: 1rem;
+}
+
+#introduction{
+    text-align: left;
+    background-image: linear-gradient( rgba(255,255,255,0.85), rgba(255,255,255,0.85)), 
url('/theme/images/oldfrontsplash.jpg');
+    background-size: cover;
+    background-position: 100%;
+}
+
+#introduction h1,
+#introduction h2,
+#introduction h3,
+#introduction h4,
+#introduction h5,
+#introduction h6 {
+    max-width: 30rem;
+    margin: 0 auto;
+}
+
+#introduction div.column.two-thirds {
+    background-color: white;
+    padding: 1rem;
+    box-shadow: rgba(127,127,127,1) 2px 2px,
+                rgba(127,127,127,1) 3px 3px,
+                rgba(127,127,127,1) 4px 4px,
+                rgba(127,127,127,1) 5px 5px,
+                rgba(127,127,127,1) 6px 6px;
+}
+
+nav#menu li#gimp-home {
+    display: none;
+}
+
+#cap-photos {
+    background-color: #0e2426;
+    background-image: linear-gradient(
+                        rgba(0,0,0,0),
+                        rgba(0,0,0,0),
+                        rgba(0,0,0,0.9)),
+                        url('/images/frontpage/dot.jpg');
+    background-size: cover;
+    background-position: 20% 50%;
+    color: white;
+}
+
+#cap-photos .column.third {
+    height: 300px;
+}
+
+#cap-photos .column.two-thirds {
+    /* background-color: rgba(0, 0, 0, 0.33);
+     */
+}
+
+#cap-photos p {
+    text-align: left;
+    color: whitesmoke;
+}
+
+#banner h1 {
+    margin-right: 0;
+    margin-top: -2rem;
+    font-size: 10rem;
+}
+
+#banner .introInfo {
+    margin-top: -3rem;
+}
+
+span#gFirst {
+    text-align: center;
+}
+
+ media (min-width: 40rem) {
+    #banner h1 {
+        margin-right: 1rem;
+        margin-top: 0;
+        font-size: 11rem;
+    }
+
+    #cap-photos {
+        background-image: url('/images/frontpage/dot.jpg');
+    }
+
+    span#gFirst {
+        text-align: left;
+    }
+    #banner .introInfo {
+        margin-top: -3rem;
+    }
+}
+
+ media (min-width: 64rem) {
+}
diff --git a/themes/newgimp/templates/home.html b/themes/newgimp/templates/home.html
index 8e28cd5..89e812b 100644
--- a/themes/newgimp/templates/home.html
+++ b/themes/newgimp/templates/home.html
@@ -4,7 +4,7 @@
 
 {% block head %}
 {{ super() }}
-<link rel='stylesheet' type='text/css' href="{{ SITEURL }}/theme/css/index.css" />
+<link rel='stylesheet' type='text/css' href="{{ SITEURL }}/theme/css/home.css" />
 {% endblock head %}
 
 
@@ -20,7 +20,7 @@
                         {# <a href="{{ SITEURL }}/"><img src="{{ SITEURL }}/theme/images/wilber-big.png" 
alt="GIMP Wilber"/>{{ SITENAME }}</a> #}
                     </h1>
                     <div class='introInfo'>
-                        <span id='gFirst'>GNU IMAGE (EEK)</span>
+                        <span id='gFirst'>GNU IMAGE</span>
                         <span id='gSecond'>MANIPULATION PROGRAM</span>
                         <span id='gThird'>
                             <a href="/downloads/">