[gimp-web/static-html5] some basic sprites

[Jakub Steiner <jimmac src gnome org>]

commit 09e980377bc002bac36ccad0998a74315c24c6a7
Author: Jakub Steiner <jimmac novell com>
Date:   Sun Jun 20 21:55:35 2010 +0200

    some basic sprites

 css/gimp.css      |   41 ++++++++++++++++++++++++++++++++++++++---
 css/gimp.sass     |   40 ++++++++++++++++++++++++++++++++++++++--
 img/bigicons.png  |  Bin 0 -> 10739 bytes
 img/empty.png     |  Bin 0 -> 85 bytes
 img/platforms.png |  Bin 0 -> 7143 bytes
 index.html        |   12 +++++++++++-
 6 files changed, 87 insertions(+), 6 deletions(-)
---
diff --git a/css/gimp.css b/css/gimp.css
index b99dcf3..414f5d6 100644
--- a/css/gimp.css
+++ b/css/gimp.css
@@ -2,14 +2,15 @@
 @import url(grid.css) all;
 body {
   font-family: "Droid Sans", sans-serif;
-  font-size: 13px;
+  font-size: 11pt;
   background: #374e70 url(/img/frbg.png) repeat-x center top;
-  color: white;
+  color: #babdb6;
   margin: 0;
   padding: 0; }
 
 h1, h2, h3, h4, h5 {
-  font-family: "RaveIn Condensed", "Avenir Condensed", Avenir, Prelude, sans-serif; }
+  font-family: "RaveIn Condensed", "Avenir Condensed", Avenir, Prelude, sans-serif;
+  color: white; }
 
 h1 {
   font-size: 150%; }
@@ -77,5 +78,39 @@ a {
     font-size: 80%;
     color: #888a85; }
 
+#linux, #osx, #windows {
+  background-image: url(/img/platforms.png);
+  background-repeat: no-repeat;
+  width: 55px;
+  height: 55px; }
+
+#linux {
+  background-position: center top; }
+
+#osx {
+  background-position: right top; }
+
+.floatleft {
+  display: block;
+  float: left;
+  margin: 6px; }
+
+.floatright {
+  display: block;
+  float: right;
+  margin: 6px; }
+
+.bigicon {
+  width: 65px;
+  height: 65px;
+  background-image: url(/img/bigicons.png);
+  background-repeat: no-repeat; }
+
+#colorwheel {
+  background-position: 0 0; }
+
+#gegl {
+  background-position: -65px 0; }
+
 #content {
   min-height: 400px; }
diff --git a/css/gimp.sass b/css/gimp.sass
index d6e3874..91f8672 100644
--- a/css/gimp.sass
+++ b/css/gimp.sass
@@ -2,7 +2,7 @@
 @import url(grid.css) all
 
 
-$bodyfg: #fff
+$bodyfg: #babdb6
 $bodybg: #374e70
 $select: #f57900
 $text: 'Droid Sans', sans-serif  
@@ -27,7 +27,7 @@ $headline: 'RaveIn Condensed', 'Avenir Condensed', Avenir, Prelude, sans-serif
   
 body
   font-family: $text
-  font-size: 13px
+  font-size: 11pt
   background: $bodybg url(/img/frbg.png) repeat-x center top
   color: $bodyfg
   margin: 0
@@ -35,6 +35,7 @@ body
 
 h1,h2,h3,h4,h5
   font-family: $headline
+  color: #fff
 
 h1
   font-size: 150%
@@ -95,6 +96,41 @@ a
     p
       font-size: 80%
       color: #888a85
+
+#linux, #osx, #windows
+  background-image: url(/img/platforms.png)
+  background-repeat: no-repeat
+  width: 55px
+  height: 55px
+  
+#linux
+  background-position: center top
+
+#osx
+  background-position: right top  
+
+.floatleft
+  display: block
+  float: left
+  margin: 6px
+
+.floatright
+  display: block
+  float: right
+  margin: 6px
+
+.bigicon
+  width: 65px
+  height: 65px
+  background-image: url(/img/bigicons.png)
+  background-repeat: no-repeat
+
+#colorwheel
+  background-position: 0 0
+
+#gegl
+  background-position: -65px 0
+
 #content
   min-height: 400px
 
diff --git a/img/bigicons.png b/img/bigicons.png
new file mode 100644
index 0000000..f196e00
Binary files /dev/null and b/img/bigicons.png differ
diff --git a/img/empty.png b/img/empty.png
new file mode 100644
index 0000000..272827e
Binary files /dev/null and b/img/empty.png differ
diff --git a/img/platforms.png b/img/platforms.png
new file mode 100644
index 0000000..9077605
Binary files /dev/null and b/img/platforms.png differ
diff --git a/index.html b/index.html
index 05f7907..137bbe8 100644
--- a/index.html
+++ b/index.html
@@ -15,15 +15,25 @@
   </div>
 </div>
 <!-- triplet -->
-<div class="container-12">
+<div class="container-12 clearfix">
   <div class="grid-4">
     <h3>Multi Platform</h3>
+    <p>GIMP is available on all major operating system.</p>
+    <img id="windows" alt="" src="/img/empty.png">
+    <img id="linux" alt="" src="/img/empty.png">
+    <img id="osx" alt="" src="/img/empty.png">
   </div>
   <div class="grid-4">
     <h3>32bit per Channel</h3>
+    <img alt="" src="/img/empty.png" class="floatleft bigicon" id="colorwheel">
+    <p>GIMP 2.8 is based on GEGL, a graph based image processing framework.</p>
+    <p>This allows to use GEGL operations blah blah blah.</p>
   </div>
   <div class="grid-4">
     <h3>Non-Destructive Editing</h3>
+    <img alt="" src="/img/empty.png" class="floatleft bigicon" id="gegl">
+    <p>GIMP 2.8 is based on GEGL, a graph based image processing framework.</p>
+    <p>This allows to use GEGL operations blah blah blah.</p>    
   </div>
 </div>