some style improvements
authorAndreas Unterkircher <unki@netshadow.at>
Thu, 7 Jun 2007 07:09:52 +0000 (07:09 +0000)
committerAndreas Unterkircher <unki@netshadow.at>
Thu, 7 Jun 2007 07:09:52 +0000 (07:09 +0000)
git-svn-id: file:///var/lib/svn/phpfspot/trunk@32 fa6a889d-dae6-447d-9e79-4ba9a3039384

phpfspot_cfg.php
stylesheet.css
templates/index.tpl
templates/photo_index.tpl
templates/tags.tpl

index 955a6ffda25a54d38067e25a7a48cdf7057e34b0..1be6325b8e6a7bf92a76985e0e0b1498e192fbda 100644 (file)
@@ -8,7 +8,7 @@ class PHPFSPOT_CFG {
 
    var $web_path = "/phpfspot";
 
-   var $thumb_width = "200";
+   var $thumb_width = "150";
    
    var $photo_width = "800";
 
index 33d20dafb015dafff0feccf5ac7e638c780e7111..02f69a4ca33a2c9ed0b7f5a097bbd9d2490ce24e 100644 (file)
 body {\r
-   background-color: rgb(255,255,255);\r
-   color: rgb(26,151,15);\r
-   font-family: Arial, Helvetica, sans-serif;\r
-   font-style: normal;\r
-   border-style: none;\r
-   border-color: rgb(15,15,15);\r
+   background-color:       #000000;\r
+   color:                  rgb(26,151,15);\r
+   font-family:            Arial, Helvetica, sans-serif;\r
+   font-style:             normal;\r
+   border:                 solid 1px #ffffff;\r
+   border-color:           rgb(15,15,15);\r
+   padding:                10px;\r
 }\r
 \r
-#content {\r
-   padding-top: 20px;\r
-   margin-left: 25%; width: auto;\r
+#frame {\r
+   padding:                10px;\r
+   background-color:       #ffffff;\r
 }\r
 \r
-#tags {\r
-   font-size: 14px;\r
-   padding-top: 20px;\r
-   width: 150px; \r
-   position: relative; \r
-   top: 0; \r
-   left: 0; \r
-   float: left;\r
+table, tr, td {\r
+   border-collapse:        collapse;\r
+   padding:                0px;\r
+   empty-cells:            show;\r
+   vertical-align:         top;\r
 }\r
 \r
-#logo {\r
-   font-weight: bolder;\r
+td.tags {\r
+   font-size:              14px;\r
+   width:                  150px;\r
+   padding:                2px;\r
+   padding-top:            10px;\r
+   border-top:             solid 1px #000000;\r
+   border-right:           solid 1px #000000;\r
+}\r
+\r
+td.available_tags,td.selected_tags {\r
+   border-bottom:          solid 1px #000000;\r
+   padding-top:            10px;\r
+   padding-bottom:         10px;\r
+   padding-right:          10px;\r
+}\r
+\r
+td.logo {\r
+   font-weight:            bolder;\r
+   height:                 40px;\r
+   border-bottom:          solid 1px #000000;\r
+}\r
+\r
+td.content {\r
+   border-top:             solid 1px #000000;\r
+}\r
+\r
+td.menu {\r
+   padding-top:            5px;\r
+   padding-bottom:         5px;\r
+}\r
+\r
+td.index_header {\r
+   background-color:       #eeeeee;\r
+   padding:                10px;\r
+   vertical-align:         middle;\r
 }\r
 \r
 img {\r
-   border-style: none;\r
+   border:                none;\r
+}\r
+\r
+img.thumb {\r
+}\r
+\r
+a {\r
+   font-size:              14px;\r
+   color:                  #008200;\r
+   text-decoration:        none;\r
+}\r
+\r
+a:visited, a:active {\r
+   color:                  #00ff00;\r
+} \r
+a:hover {\r
+   color:                  #00aa44;\r
+}\r
+\r
+#matrix {\r
+   padding:                10px;\r
+}\r
+\r
+td.thumb {\r
+   padding:                1px;\r
+   text-align:             center;\r
+}\r
+\r
+#outter {\r
+   padding:                10px;\r
+   background-color:       #eeeeee;\r
+}\r
+\r
+#inner {\r
+   padding:                7px;\r
+   -moz-border-radius:     1em;\r
+   border-radius:          1em;\r
+   border:                 dashed 1px #888888;\r
+\r
 }\r
index 38af5841bebdff533c4c69fb70f2e03d0354b553..bec381b4acbdb6844ab10e80213e815b07fea253 100644 (file)
@@ -1,11 +1,31 @@
 {include file="header.tpl"}
  <body onload="refreshAvailableTags(); refreshSelectedTags();">
-  <div id="logo">{$page_title}</div>
-  <div id="tags">
-   {include file="tags.tpl"}
-  </div>
-  <div id="content">
-   {include file="welcome.tpl"}
+  <div id="frame">
+  <table>
+   <tr>
+    <td class="logo" colspan="2">
+     {$page_title}
+    </td>
+   </tr>
+   <tr>
+    <td colspan="2" class="menu">
+     <a href="javascript:showPhotoIndex();">Photo Index</a>
+     <a href="javascript:Tags('reset', 0);">Reset Tags</a>
+    </td>
+   </tr>
+   <tr>
+    <td class="tags">
+     <div id="tags">
+      {include file="tags.tpl"}
+     </div>
+    </td>
+    <td class="content">
+     <div id="content">
+      {include file="welcome.tpl"}
+     </div>
+    </td>
+   </tr>
+  </table>
   </div>
  </body>
 {include file="footer.tpl"}
index 97c9fb84bb93717030919c245ea72dc343a19b5a..3172547d6794287c884747c147453e3e7ef187e6 100644 (file)
@@ -1,22 +1,41 @@
 <!-- Image Matrix -->
 <table>
  <tr>
-  <td colspan="{$columns}">
-   {$count} images have been found for the selected tags
+  <td class="index_header">
+   <b>Photo Index</b><br />
+   {if $count == 1}
+      {$count} image has been found for the selected tags
+   {else}
+      {$count} images have been found for the selected tags
+   {/if}
   </td>
  </tr>
-{section name="row" loop=$rows step=1}
  <tr>
- {section name="col" loop=$columns step=1}
   <td>
-   {if $images[row][col] }
-   <a href="javascript:showImage({$images[row][col]});">
-    <img src="phpfspot_img.php?idx={$images[row][col]}&amp;width={$width}" />
-   </a>
-   {/if}
+   <div id="matrix">
+   <table>
+   {section name="row" loop=$rows step=1}
+    <tr>
+    {section name="col" loop=$columns step=1}
+     <td class="thumb">
+      {if $images[row][col] }
+      <div id="outter">
+      <div id="inner">
+       <a href="javascript:showImage({$images[row][col]});">
+        <img class="thumb" src="phpfspot_img.php?idx={$images[row][col]}&amp;width={$width}" />
+       </a>
+      </div>
+      </div>
+      {else}
+       &nbsp;
+      {/if}
+     </td>
+    {/section}
+    </tr>
+   {/section} 
+   </table>
+   </div>
   </td>
- {/section}
  </tr>
-{/section} 
 </table>
 <!-- /Image Matrix -->
index 2a6a7a88f1b6914475780364b56a1a2b6dd46b99..084c1ea42cc3f2b04170548c63d5488232be5a1f 100644 (file)
@@ -1,31 +1,25 @@
 <table>
  <tr>
   <td>
-   The following tags are available:
+   Available Tags:
   </td>
  </tr>
  <tr>
-  <td>
-   <div id='available_tags'></div>
+  <td class="available_tags">
+   <div id="available_tags"></div>
   </td>
  </tr>
  <tr>
   <td>
-   The following tags have been selected:
+   Selected Tags:
   </td>
  </tr>
  <tr>
-  <td>
-   <div id='selected_tags'></div>
+  <td class="selected_tags">
+   <div id="selected_tags"></div>
   </td>
  </tr>
  <tr>
   <td>&nbsp;</td>
  </tr>
- <tr>
-  <td>
-   <a href="javascript:showPhotoIndex();">Photo Index</a>
-   <a href="javascript:Tags('reset', 0);">Reset Tags</a>
-  </td>
- </tr>
 </table>