Commits

Andres Vargas committed cd46f74

adding facebook

Comments (0)

Files changed (10)

media/css/520/fbml-static/520-grid-bgrnd.gif

Added
New image

media/css/520/fbml-static/grid.html

+<link rel="stylesheet" type="text/css" href="style.css" />
+
+
+<h1>520 Grid System</h1>
+<h2>12 columns @26px each, 16px gutter</h2>
+
+<div class="container clearfix">
+
+	<div class="grid12 first">
+		grid12
+	</div>
+
+	<div class="grid1 first">
+		grid1
+	</div>
+	<div class="grid11">
+		grid11
+	</div>
+
+	<div class="grid2 first">
+		grid2
+	</div>
+	<div class="grid10">
+
+		grid10
+	</div>
+
+	<div class="grid3 first">
+		grid3
+	</div>
+	<div class="grid9">
+		grid9
+	</div>
+
+	<div class="grid4 first">
+
+		grid4
+	</div>
+	<div class="grid8">
+		grid8
+	</div>
+
+	<div class="grid5 first">
+		grid5
+	</div>
+	<div class="grid7">
+		grid7
+	</div>
+
+	<div class="grid6 first">
+		grid6
+	</div>
+	<div class="grid6">
+		grid6
+	</div>
+
+	<div class="grid3 first">
+		grid3
+	</div>
+
+	<div class="grid3">
+		grid3
+	</div>
+	<div class="grid1">
+		grid1
+	</div>
+	<div class="grid5">
+		grid5
+	</div>
+
+	<div class="grid1 first">
+
+		grid1
+	</div>
+	<div class="grid5">
+		grid5
+	</div>
+	<div class="grid3">
+		grid3
+	</div>
+	<div class="grid3">
+		grid3
+	</div>
+
+	<div class="grid3 first">
+		3
+	</div>
+	<div class="grid9">
+		<div class="grid3 first">3</div>
+		<div class="grid3">3</div>
+		<div class="grid3">3</div>
+
+		<div class="grid5 first">5</div>
+		<div class="grid2">2</div>
+		<div class="grid2">2</div>
+	</div>
+
+	<div class="grid8 first">
+		<div class="grid3 first">3</div>
+
+		<div class="grid3">3</div>
+		<div class="grid2">2</div>
+		<div class="grid1 first">1</div>
+		<div class="grid1">1</div>
+		<div class="grid6">6</div>
+	</div>
+
+	<div class="grid4">
+		4
+	</div>
+	
+</div>
+<p>Visit <a href="http://www.facebook.com/520GridSystem">520 Grid System's page</a> on Facebook!</p>
+
+

media/css/520/fbml-static/style.css

+/* 
+RESET CSS
+http://meyerweb.com/eric/tools/css/reset/
+v1.0 | 20080212 
+*/
+
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, font, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td {
+	margin: 0;
+	padding: 0;
+	border: 0;
+	outline: 0;
+	font-size: 100%;
+	vertical-align: baseline;
+	background: transparent;
+}
+body {line-height: 1;}
+ol, ul {list-style: none;}
+blockquote, q {quotes: none;}
+blockquote:before, blockquote:after,
+q:before, q:after {
+	content: '';
+	content: none;
+}
+/* remember to define focus styles! */
+:focus {
+	outline: 0;
+}
+/* remember to highlight inserts somehow! */
+ins {text-decoration: none;}
+del {text-decoration: line-through;}
+/* tables still need 'cellspacing="0"' in the markup */
+table {
+	border-collapse: collapse;
+	border-spacing: 0;
+}
+
+/* 
+520 GRID SYSTEM
+in glory of http://960.gs
+based on http://www.webdesignerwall.com/tutorials/the-simpler-css-grid/
+*/
+body {
+	text-align: center;
+	margin: 0px auto;
+}
+.container {
+	font: 12px/140% Arial, Helvetica, sans-serif;
+	text-align: center;
+	width: 488px;
+	margin: 0 auto;
+	 padding: 0 14px;
+	 padding-left: 0px;
+}
+.grid1, .grid2, .grid3, .grid4, .grid5, .grid6, .grid7, .grid8, .grid9, .grid10, .grid11, .grid12 {
+	float: left;
+	display: inline;
+	margin-left: 16px;
+}
+.grid1 { width: 26px; }
+.grid2 { width: 68px; }
+.grid3 { width: 110px; }
+.grid4 { width: 152px; }
+.grid5 { width: 194px; }
+.grid6 { width: 236px; }
+.grid7 { width: 278px; }
+.grid8 { width: 320px; }
+.grid9 { width: 362px; }
+.grid10 { width: 404px; }
+.grid11 { width: 446px; }
+.grid12 { width: 488px; }
+.first {
+	margin-left: 0px;
+	clear: left;
+}
+/* clearfix */
+.clearfix:after {
+	visibility: hidden;
+	display: block;
+	font-size: 0;
+	content: " ";
+	clear: both;
+	height: 0;
+}
+* html .clearfix {
+	zoom: 1;
+} /* IE6 */
+*:first-child+html .clearfix {
+	zoom: 1;
+} /* IE7 */
+
+
+
+

media/css/520/html/520-grid-bgrnd.gif

Added
New image

media/css/520/html/grid.html

+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+<title>520 Grid System</title>
+<link rel="stylesheet" type="text/css" href="style.css" />
+</head>
+
+<body>
+
+<h1>520 Grid System</h1>
+<h2>12 columns @26px each, 16px gutter</h2>
+
+<div class="container clearfix">
+
+	<div class="grid12 first">
+		grid12
+	</div>
+
+	<div class="grid1 first">
+		grid1
+	</div>
+	<div class="grid11">
+		grid11
+	</div>
+
+	<div class="grid2 first">
+		grid2
+	</div>
+	<div class="grid10">
+
+		grid10
+	</div>
+
+	<div class="grid3 first">
+		grid3
+	</div>
+	<div class="grid9">
+		grid9
+	</div>
+
+	<div class="grid4 first">
+
+		grid4
+	</div>
+	<div class="grid8">
+		grid8
+	</div>
+
+	<div class="grid5 first">
+		grid5
+	</div>
+	<div class="grid7">
+		grid7
+	</div>
+
+	<div class="grid6 first">
+		grid6
+	</div>
+	<div class="grid6">
+		grid6
+	</div>
+
+	<div class="grid3 first">
+		grid3
+	</div>
+
+	<div class="grid3">
+		grid3
+	</div>
+	<div class="grid1">
+		grid1
+	</div>
+	<div class="grid5">
+		grid5
+	</div>
+
+	<div class="grid1 first">
+
+		grid1
+	</div>
+	<div class="grid5">
+		grid5
+	</div>
+	<div class="grid3">
+		grid3
+	</div>
+	<div class="grid3">
+		grid3
+	</div>
+
+	<div class="grid3 first">
+		3
+	</div>
+	<div class="grid9">
+		<div class="grid3 first">3</div>
+		<div class="grid3">3</div>
+		<div class="grid3">3</div>
+
+		<div class="grid5 first">5</div>
+		<div class="grid2">2</div>
+		<div class="grid2">2</div>
+	</div>
+
+	<div class="grid8 first">
+		<div class="grid3 first">3</div>
+
+		<div class="grid3">3</div>
+		<div class="grid2">2</div>
+		<div class="grid1 first">1</div>
+		<div class="grid1">1</div>
+		<div class="grid6">6</div>
+	</div>
+
+	<div class="grid4">
+		4
+	</div>
+	
+</div>
+<p>Visit <a href="http://www.facebook.com/pages/520GridSystem">520 Grid System's page</a> on Facebook!</p>
+</body>
+</html>
+

media/css/520/html/style.css

+/* 
+RESET CSS
+http://meyerweb.com/eric/tools/css/reset/
+v1.0 | 20080212 
+*/
+
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, font, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td {
+	margin: 0;
+	padding: 0;
+	border: 0;
+	outline: 0;
+	font-size: 100%;
+	vertical-align: baseline;
+	background: transparent;
+}
+body {line-height: 1;}
+ol, ul {list-style: none;}
+blockquote, q {quotes: none;}
+blockquote:before, blockquote:after,
+q:before, q:after {
+	content: '';
+	content: none;
+}
+/* remember to define focus styles! */
+:focus {
+	outline: 0;
+}
+/* remember to highlight inserts somehow! */
+ins {text-decoration: none;}
+del {text-decoration: line-through;}
+/* tables still need 'cellspacing="0"' in the markup */
+table {
+	border-collapse: collapse;
+	border-spacing: 0;
+}
+
+/* 
+520 GRID SYSTEM
+in glory of http://960.gs
+based on http://www.webdesignerwall.com/tutorials/the-simpler-css-grid/
+*/
+body {
+	text-align: center;
+	margin: 0px auto;
+}
+.container {
+	font: 12px/140% Arial, Helvetica, sans-serif;
+	text-align: center;
+	width: 488px;
+	margin: 0 auto;
+  padding: 0 16px;
+}
+.grid1, .grid2, .grid3, .grid4, .grid5, .grid6, .grid7, .grid8, .grid9, .grid10, .grid11, .grid12 {
+	float: left;
+	display: inline;
+	margin-left: 16px;
+}
+.grid1 { width: 26px; }
+.grid2 { width: 68px; }
+.grid3 { width: 110px; }
+.grid4 { width: 152px; }
+.grid5 { width: 194px; }
+.grid6 { width: 236px; }
+.grid7 { width: 278px; }
+.grid8 { width: 320px; }
+.grid9 { width: 362px; }
+.grid10 { width: 404px; }
+.grid11 { width: 446px; }
+.grid12 { width: 488px; }
+.first {
+	margin-left: 0px;
+	clear: left;
+}
+/* clearfix */
+.clearfix:after {
+	visibility: hidden;
+	display: block;
+	font-size: 0;
+	content: " ";
+	clear: both;
+	height: 0;
+}
+* html .clearfix {
+	zoom: 1;
+} /* IE6 */
+*:first-child+html .clearfix {
+	zoom: 1;
+} /* IE7 */
+
+
+
+/* CUSTOM STYLES */
+
+body {
+  padding: 3em 0;
+  background: #67a54b;
+  border-top: 5px solid #3b5999;
+  border-bottom: 5px solid #3b5999;
+	font: 12px/140% Arial, Helvetica, sans-serif;
+	color: #333333;
+}
+
+.container {
+	background: #fff url(520-grid-bgrnd.gif) repeat-y;
+}
+.grid1, .grid2, .grid3, .grid4, .grid5, .grid6, .grid7, .grid8, .grid9, .grid10, .grid11, .grid12 {
+	margin-top: 5px;
+	margin-bottom: 5px;
+	padding-top: 5px;
+	padding-bottom: 5px;
+	border: solid 1px #67a54b;
+	border-width: 1px 0;
+}
+
+h1 {
+	font-size: 25px;
+	color: #f5f5f5;
+	margin-bottom: 20px;
+}
+h2 {
+	font-size: 23px;
+	color: #f5f5f5;
+	margin-bottom: 20px;
+}
+p {
+	color: #f5f5f5;
+	padding-top: 5px;
+	padding-bottom: 5px;
+}
+a {
+  color: #f5f5f5;
+  text-decoration: underlined;
+}

templates/facebook.html

+<link rel="stylesheet" type="text/css" href="{{MEDIA_URL}}css/520/fbml-static/style.css" />
+<div class="container clearfix">
+	{%for p in products%}
+	{% with p.product as product %}
+	<div class="main-producto grid6 {% cycle "first" "" %}">
+		<div class="img"> 
+			<a target="_blank" href="{{product.get_absolute_url}}">
+				<img   src="{{product.get_image.url_200x200}}" title="{{product.name}}">
+			</a>
+		</div>
+		<div class="name">
+
+			<a href="{{product.get_absolute_url}}" target="_blank">
+				{{product.get_name}}
+			</a>
+		</div>
+	</div>
+	{% endwith %}
+	{% endfor %}
+</div>

templates/lfs/base.html

                         </form>
                     </div>
 
-		    <div class="span-10 prepend-1 append-1" style="padding-top:40px;">
-			    {{ shop.description|safe }}
+		    <div class="span-10 prepend-1 append-1" style="padding-top:40px; text-align:center;">
+			    <h1 style="color:blue;">The Last Breath Before Dive</h1>
+			    <a href="http://www.facebook.com/pages/AlphaSub/181824571866329">
+			    <img src="http://d2dnrmagaqciul.cloudfront.net/wp-content/uploads/2009/06/facebook_32.png">
+			    </a>
+			    <a href="http://twitter.com/alphasub_mexico">
+					<img src="http://d2dnrmagaqciul.cloudfront.net/wp-content/uploads/2009/06/twitter_32.png">
+			    </a>
 		    </div>
                     <div class="span-4">
                        {% lfs_cart_portlet %}
                         <a href="{{ action.link }}">{{ action.title }}</a>
                         {% if not forloop.last %}|{% endif %}
                     {% endfor %}
+
                 {% endblock %}
             </div>
         </div>
             <div class="container">
                 {% block colophon %}
 		<p> M&eacute;rida Yucat&aacute;n, Mexico</p>
+
+		<iframe src="http://www.facebook.com/plugins/like.php?href=www.alphasub.net&amp;send=true&amp;layout=standard&amp;width=450&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font&amp;height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:80px;" allowTransparency="true"></iframe>
                 {% endblock %}
             </div>
         </div>
 
     # Uncomment the next line to enable the admin:
      (r'^admin/', include(admin.site.urls)),
-    (r'^$','views.index'),
+    (r'^facebook/$','views.index'),
     (r'', include('lfs.core.urls')),
+
     (r'^manage/', include('lfs.manage.urls')),
     (r'^reviews/', include('reviews.urls')),
     (r'^paypal/ipn/', include('paypal.standard.ipn.urls')),
 def index(request):
     shop = get_default_shop()
     feature_products = FeaturedProduct.objects.filter(active = True)
-    return render_to_response("lfs/shop/shop.html", RequestContext(request,
+    return render_to_response("facebook.html", RequestContext(request,
         {'shop':shop,'products':feature_products}
         )
     )