From 5cf992a73f3a12f53c524a434c5f8625a75bc58b Mon Sep 17 00:00:00 2001
From: John Bintz <john@coswellproductions.com>
Date: Wed, 10 Jun 2009 16:53:33 -0400
Subject: [PATCH] split out css to separate file

---
 classes/DailyImageWidget.php |  8 +++++---
 hubblesite-styles.css        | 28 ++++++++++++++++++++++++++++
 2 files changed, 33 insertions(+), 3 deletions(-)
 create mode 100644 hubblesite-styles.css

diff --git a/classes/DailyImageWidget.php b/classes/DailyImageWidget.php
index 61fca74..e663e49 100644
--- a/classes/DailyImageWidget.php
+++ b/classes/DailyImageWidget.php
@@ -109,6 +109,8 @@ class DailyImageWidget {
       $options = $this->get_display_options();
       
       echo '<div id="hubblesite-daily-image">';
+        echo '<p id="hubblesite-daily-image-header">HubbleSite Daily Image</p>';
+        
         if (in_array("image", $options)) {
           echo '<a href="' . $this->data['gallery_url'] . '" title="' . $this->data['title'] . '">';
             echo '<img src="' . $this->data['image_url'] . '" alt="' . $this->data['title'] . '" />';
@@ -135,9 +137,9 @@ class DailyImageWidget {
       echo '</div>';
       
       if (in_array("styles", $options)) {
-        echo '<style type="text/css">';
-          echo "div#hubblesite-daily-image { text-align: center }";
-        echo '</style>';
+        echo "<style type=\"text/css\">";
+          include(dirname(__FILE__) . '/../hubblesite-styles.css');
+        echo "</style>";
       }
     }
   }
diff --git a/hubblesite-styles.css b/hubblesite-styles.css
new file mode 100644
index 0000000..0613709
--- /dev/null
+++ b/hubblesite-styles.css
@@ -0,0 +1,28 @@
+div#hubblesite-daily-image {
+  text-align: center;
+  border: 1px solid #67201D;
+  background-color: #F0EEDD;
+  padding: 10px;
+}
+
+div#hubblesite-daily-image a:hover {
+  color: #00d2d3
+}
+
+div#hubblesite-daily-image img {
+  margin: 5px 0;
+  border: 1px solid #67201D;
+} 
+
+div#hubblesite-daily-image a:hover img {
+  border-color: #00d2d3
+}
+
+p#hubblesite-daily-image-header {
+  text-align: center;
+  font-size: 12px;
+  font-weight: bold;
+  color: #666;
+  margin: 0;
+  padding: 0;
+}";