From 08c20d5d0c90e132a4d41d5298fce6dafd375949 Mon Sep 17 00:00:00 2001
From: Yuriy Volkov <jnvolkov@gmail.com>
Date: Sun, 18 Apr 2010 13:11:18 +0300
Subject: [PATCH] move styling into the separate css file

---
 appoyo/app/views/layouts/fbpage.fbml.erb | 76 +++++++++++++-------------------
 appoyo/public/stylesheets/fbpage.css     | 58 ++++++++++++++++++++++++
 2 files changed, 89 insertions(+), 45 deletions(-)
 create mode 100644 appoyo/public/stylesheets/fbpage.css

diff --git a/appoyo/app/views/layouts/fbpage.fbml.erb b/appoyo/app/views/layouts/fbpage.fbml.erb
index 65213cc..65c703d 100644
--- a/appoyo/app/views/layouts/fbpage.fbml.erb
+++ b/appoyo/app/views/layouts/fbpage.fbml.erb
@@ -1,60 +1,46 @@
-<% if "start" != @current_action && "gallery" != @current_action %>
-  <div style="width:100%;text-align:right; padding: 0px;">
-    <fb:bookmark /></fb:bookmark />
-  </div>
-<% end%>
+<fb:fbml version="1.1">
+  <%= stylesheet_link_tag "fbpage" %>
 
-<style type="text/css"> 
-#demo-container{padding:95px 15px 0 15px; margin: 0 0 20px 0; background-image: url('<%=Current_site %>images/appoyo_bg.jpg');}
- 
-ul#simple-menu{list-style-type:none;width:100%;position:relative;height:27px;font-family:"Trebuchet MS",Arial,sans-serif;font-size:13px;font-weight:bold;margin:0;padding:11px 0 0 0;}
-ul#simple-menu li{display:block;float:left;margin:0 0 0 4px;height:27px;}
-ul#simple-menu li.left{margin:0;}
-ul#simple-menu li a{display:block;float:left;color:#fff;background:#a7aeb0;line-height:27px;text-decoration:none;padding:0 17px 0 18px;height:27px;}
-ul#simple-menu li a.right{padding-right:19px;}
-ul#simple-menu li a:hover{background:#2E4560;}
-ul#simple-menu li a.current{color:#2E4560;background:#fff;}
-ul#simple-menu li a.current:hover{color:#2E4560;background:#fff;}
-.css1 { font-size: 1.0em; }
-.css2 { font-size: 1.2em; }
-.css3 { font-size: 1.4em; }
-.css4 { font-size: 1.6em; }
-</style> 
+  <% if "start" != @current_action && "gallery" != @current_action %>
+    <div style="width:100%;text-align:right; padding: 0px;">
+      <fb:bookmark /></fb:bookmark />
+    </div>
+  <% end%>
 
-<div id="demo-container"> 
-<ul id="simple-menu"> 
-<li><a href="start" title="Home"  <%=tabs_styling("start",@current_action)%>><%=t :start_menu%></a></li> 
-<li><a href="business" title="Home" <%=tabs_styling("business",@current_action)%>><%=t :business_menu%></a></li> 
-<li><a href="privat" title="Home" <%=tabs_styling("privat",@current_action)%>><%=t :private_menu%></a></li> 
-<li><a href="my" title="Home" <% if params[:id]==nil && @current_action == "my"%><%= tabs_styling("my",@current_action)%><% end%>> <%=t :my_galleries_menu%></a></li> 
-<li><a href="members" title="Home" <%= tabs_styling("members",@current_action)%>> <%=t :members_menu%></a></li> 
-<li><a href="help" title="Home" <%=tabs_styling("help",@current_action)%>><%=t :help_menu%></a></li>
-</ul> 
-</div> 
+  <div id="demo-container">
+    <ul id="simple-menu">
+    <li><a href="start" title="Home"  <%=tabs_styling("start",@current_action)%>><%=t :start_menu%></a></li>
+    <li><a href="business" title="Home" <%=tabs_styling("business",@current_action)%>><%=t :business_menu%></a></li>
+    <li><a href="privat" title="Home" <%=tabs_styling("privat",@current_action)%>><%=t :private_menu%></a></li>
+    <li><a href="my" title="Home" <% if params[:id]==nil && @current_action == "my"%><%= tabs_styling("my",@current_action)%><% end%>> <%=t :my_galleries_menu%></a></li>
+    <li><a href="members" title="Home" <%= tabs_styling("members",@current_action)%>> <%=t :members_menu%></a></li>
+    <li><a href="help" title="Home" <%=tabs_styling("help",@current_action)%>><%=t :help_menu%></a></li>
+    </ul>
+  </div>
 
-<%= yield  %>
+  <%= yield  %>
 
   <script type="text/javascript">
-      FB.init("<%= Facebooker::Session.api_key %>", "<%=Current_site%>xd_receiver.htm");
+    FB.init("<%= Facebooker::Session.api_key %>", "<%=Current_site%>xd_receiver.htm");
   </script>
- 
+
       <div style="float:left;border: 1px solid rgb(212, 212, 212); width: 99.8%; height: 74px; background-color: rgb(204, 255, 204);margin: 20px 0px 0 0;">
         <a  href="http://appoyo.com/<%=@bottom_language%>/login.html" style="text-decoration: none;" target="_blank">
           <div style="margin: 5px 0px 5px 2px; float: left; width: 520px; height: 65px; background-image: url(<%=Main_site_url%>images/podval_1.jpg);">
             <div style="padding: 22px 10px 0px 10px; float: left; font-size: 15px;">
-              <%=t :do_u_wanna_3d%> 
+              <%=t :do_u_wanna_3d%>
             </div>
-            <div style="margin: 10px; padding: 0px; float: right; width: 215px; height: 44px; background-image: url(<%=Main_site_url%>images/podval_2.png);">      
-              <div style="padding: 13px 10px 10px 10px; font-size: 15px; text-align: center;color: white;"> 
+            <div style="margin: 10px; padding: 0px; float: right; width: 215px; height: 44px; background-image: url(<%=Main_site_url%>images/podval_2.png);">
+              <div style="padding: 13px 10px 10px 10px; font-size: 15px; text-align: center;color: white;">
                 <%=t :make_it_for_free%>
-              </div>      
+              </div>
             </div>
           </div>
         </a>
         <a href="http://appoyo.com/services/free/userrooms/threeboxes/demo.php" style="text-decoration: none;" target="_blank">
           <div style="margin: 5px 4px 0px 0px; float: right; font-size: 15px; width: 207px; height: 65px; background-image: url(<%=Main_site_url%>images/podval_3.png);">
             <div style="padding: 23px 10px 10px 20px; color: white;">
-              <%=t :demo_entrance%>   
+              <%=t :demo_entrance%>
             </div>
           </div>
         </a>
@@ -62,27 +48,27 @@ ul#simple-menu li a.current:hover{color:#2E4560;background:#fff;}
   <div style="padding: 10px; float: left; width: 100%; height: 2px;">&nbsp;
     <hr style="width: 100%; color: rgb(212, 212, 212);">
   </div>
-  <div style="float: left;margin: 10px 0px 0px;"> 
+  <div style="float: left;margin: 10px 0px 0px;">
     <a href="http://appoyo.com">
       <img src="<%=Current_site%>images/appoyo_simple.jpg" target="_blank"> 
     </a>
   </div> 
   <div style="float: right; margin: 10px 0 0 0;">
     <a href="http://www.facebook.com/apps/application.php?id=129898117048" target="_blank">
-     <%=t :become_a_fan%> 
+     <%=t :become_a_fan%>
     </a>
-     | 
+     |
     <a href="http://twitter.com/appoyo" target="_blank">
      <%=t :follow_us%>
     </a>
-     | 
+     |
     <a href="http://appoyo.com/terms.html" target="_blank">
      <%=t :terms%>
     </a>
-     | 
+     |
     <a href="#">
      <%=t :privacy%>
     </a>
   </div>
 
-
+</fb:fbml>
diff --git a/appoyo/public/stylesheets/fbpage.css b/appoyo/public/stylesheets/fbpage.css
new file mode 100644
index 0000000..c98425c
--- /dev/null
+++ b/appoyo/public/stylesheets/fbpage.css
@@ -0,0 +1,58 @@
+/*fbpage layout style*/
+#demo-container {
+    padding:95px 15px 0 15px; 
+    margin: 0 0 20px 0; 
+    background-image: url('images/appoyo_bg.jpg');
+}
+
+ul#simple-menu {
+    list-style-type:none;
+    width:100%;
+    position:relative;
+    height:27px;
+    font-family:"Trebuchet MS",Arial,sans-serif;
+    font-size:13px;
+    font-weight:bold;
+    margin:0;
+    padding:11px 0 0 0;
+}
+
+ul#simple-menu li{
+    display:block;
+    float:left;
+    margin:0 0 0 4px;
+    height:27px;
+}
+
+ul#simple-menu li.left {
+    margin:0;
+}
+ul#simple-menu li a {
+    display:block;
+    float:left;
+    color:#fff;
+    background:#a7aeb0;
+    line-height:27px;
+    text-decoration:none;
+    padding:0 17px 0 18px;
+    height:27px;
+}
+ul#simple-menu li a.right {
+    padding-right:19px;
+}
+ul#simple-menu li a:hover {
+    background:#2E4560;
+}
+ul#simple-menu li a.current {
+    color:#2E4560;background:#fff;
+}
+ul#simple-menu li a.current:hover {
+    color:#2E4560;background:#fff;
+}
+
+/*tag cloud style*/
+.css1 { font-size: 1.0em; }
+.css2 { font-size: 1.2em; }
+.css3 { font-size: 1.4em; }
+.css4 { font-size: 1.6em; }
+
-- 
2.11.4.GIT