Skip to content
Browse files

Header 1/2content and 3/4 panelists 30% of the site

  • Loading branch information...
1 parent a78f926 commit 66369cb823aa4a7e74ea37bdea15a1301bc91a6b @kuryaki committed Dec 17, 2012
View
16 contents/css/5grid/init.js
@@ -751,4 +751,18 @@
_5grid.readyCheck();
});
-})();
+})();
+
+$(document).ready(function() {
+
+ $('#nav').onePageNav({
+ begin: function() {
+ console.log('start');
+ },
+ end: function() {
+ console.log('stop');
+ },
+ scrollOffset: 30
+ });
+
+});
View
210 contents/css/5grid/jquery.nav.js
@@ -0,0 +1,210 @@
+/*
+ * jQuery One Page Nav Plugin
+ * http://github.com/davist11/jQuery-One-Page-Nav
+ *
+ * Copyright (c) 2010 Trevor Davis (http://trevordavis.net)
+ * Dual licensed under the MIT and GPL licenses.
+ * Uses the same license as jQuery, see:
+ * http://jquery.org/license
+ *
+ * @version 2.0
+ *
+ * Example usage:
+ * $('#nav').onePageNav({
+ * currentClass: 'current',
+ * changeHash: false,
+ * scrollSpeed: 750
+ * });
+ */
+
+;(function($, window, document, undefined){
+
+ // our plugin constructor
+ var OnePageNav = function(elem, options){
+ this.elem = elem;
+ this.$elem = $(elem);
+ this.options = options;
+ this.metadata = this.$elem.data('plugin-options');
+ this.$nav = this.$elem.find('a');
+ this.$win = $(window);
+ this.sections = {};
+ this.didScroll = false;
+ this.$doc = $(document);
+ this.docHeight = this.$doc.height();
+ };
+
+ // the plugin prototype
+ OnePageNav.prototype = {
+ defaults: {
+ currentClass: 'current',
+ changeHash: false,
+ easing: 'swing',
+ filter: '',
+ scrollSpeed: 750,
+ scrollOffset: 0,
+ scrollThreshold: 0.5,
+ begin: false,
+ end: false
+ },
+
+ init: function() {
+ var self = this;
+
+ // Introduce defaults that can be extended either
+ // globally or using an object literal.
+ self.config = $.extend({}, self.defaults, self.options, self.metadata);
+
+ //Filter any links out of the nav
+ if(self.config.filter !== '') {
+ self.$nav = self.$nav.filter(self.config.filter);
+ }
+
+ //Handle clicks on the nav
+ self.$nav.on('click.onePageNav', $.proxy(self.handleClick, self));
+
+ //Get the section positions
+ self.getPositions();
+
+ //Handle scroll changes
+ self.bindInterval();
+
+ //Update the positions on resize too
+ self.$win.on('resize.onePageNav', $.proxy(self.getPositions, self));
+
+ return this;
+ },
+
+ adjustNav: function(self, $parent) {
+ self.$elem.find('.' + self.config.currentClass).removeClass(self.config.currentClass);
+ $parent.addClass(self.config.currentClass);
+ },
+
+ bindInterval: function() {
+ var self = this;
+ var docHeight;
+
+ self.$win.on('scroll.onePageNav', function() {
+ self.didScroll = true;
+ });
+
+ self.t = setInterval(function() {
+ docHeight = self.$doc.height();
+
+ //If it was scrolled
+ if(self.didScroll) {
+ self.didScroll = false;
+ self.scrollChange();
+ }
+
+ //If the document height changes
+ if(docHeight !== self.docHeight) {
+ self.docHeight = docHeight;
+ self.getPositions();
+ }
+ }, 250);
+ },
+
+ getHash: function($link) {
+ return $link.attr('href').split('#')[1];
+ },
+
+ getPositions: function() {
+ var self = this;
+ var linkHref;
+ var topPos;
+
+ self.$nav.each(function() {
+ linkHref = self.getHash($(this));
+ topPos = $('#' + linkHref).offset().top;
+
+ self.sections[linkHref] = Math.round(topPos) - self.config.scrollOffset;
+ });
+ },
+
+ getSection: function(windowPos) {
+ var returnValue = null;
+ var windowHeight = Math.round(this.$win.height() * this.config.scrollThreshold);
+
+ for(var section in this.sections) {
+ if((this.sections[section] - windowHeight) < windowPos) {
+ returnValue = section;
+ }
+ }
+
+ return returnValue;
+ },
+
+ handleClick: function(e) {
+ var self = this;
+ var $link = $(e.currentTarget);
+ var $parent = $link.parent();
+ var newLoc = '#' + self.getHash($link);
+
+ if(!$parent.hasClass(self.config.currentClass)) {
+ //Start callback
+ if(self.config.begin) {
+ self.config.begin();
+ }
+
+ //Change the highlighted nav item
+ self.adjustNav(self, $parent);
+
+ //Removing the auto-adjust on scroll
+ self.unbindInterval();
+
+ //Scroll to the correct position
+ $.scrollTo(newLoc, self.config.scrollSpeed, {
+ axis: 'y',
+ easing: self.config.easing,
+ offset: {
+ top: -self.config.scrollOffset
+ },
+ onAfter: function() {
+ //Do we need to change the hash?
+ if(self.config.changeHash) {
+ window.location.hash = newLoc;
+ }
+
+ //Add the auto-adjust on scroll back in
+ self.bindInterval();
+
+ //End callback
+ if(self.config.end) {
+ self.config.end();
+ }
+ }
+ });
+ }
+
+ e.preventDefault();
+ },
+
+ scrollChange: function() {
+ var windowTop = this.$win.scrollTop();
+ var position = this.getSection(windowTop);
+ var $parent;
+
+ //If the position is set
+ if(position !== null) {
+ $parent = this.$elem.find('a[href$="#' + position + '"]').parent();
+
+ //Change the highlighted nav item
+ this.adjustNav(this, $parent);
+ }
+ },
+
+ unbindInterval: function() {
+ clearInterval(this.t);
+ this.$win.unbind('scroll.onePageNav');
+ }
+ };
+
+ OnePageNav.defaults = OnePageNav.prototype.defaults;
+
+ $.fn.onePageNav = function(options) {
+ return this.each(function() {
+ new OnePageNav(this, options).init();
+ });
+ };
+
+})( jQuery, window , document );
View
11 contents/css/5grid/jquery.scrollTo.js
@@ -0,0 +1,11 @@
+/**
+ * jQuery.ScrollTo - Easy element scrolling using jQuery.
+ * Copyright (c) 2007-2009 Ariel Flesler - aflesler(at)gmail(dot)com | http://flesler.blogspot.com
+ * Dual licensed under MIT and GPL.
+ * Date: 5/25/2009
+ * @author Ariel Flesler
+ * @version 1.4.2
+ *
+ * http://flesler.blogspot.com/2007/10/jqueryscrollto.html
+ */
+;(function(d){var k=d.scrollTo=function(a,i,e){d(window).scrollTo(a,i,e)};k.defaults={axis:'xy',duration:parseFloat(d.fn.jquery)>=1.3?0:1};k.window=function(a){return d(window)._scrollable()};d.fn._scrollable=function(){return this.map(function(){var a=this,i=!a.nodeName||d.inArray(a.nodeName.toLowerCase(),['iframe','#document','html','body'])!=-1;if(!i)return a;var e=(a.contentWindow||a).document||a.ownerDocument||a;return d.browser.safari||e.compatMode=='BackCompat'?e.body:e.documentElement})};d.fn.scrollTo=function(n,j,b){if(typeof j=='object'){b=j;j=0}if(typeof b=='function')b={onAfter:b};if(n=='max')n=9e9;b=d.extend({},k.defaults,b);j=j||b.speed||b.duration;b.queue=b.queue&&b.axis.length>1;if(b.queue)j/=2;b.offset=p(b.offset);b.over=p(b.over);return this._scrollable().each(function(){var q=this,r=d(q),f=n,s,g={},u=r.is('html,body');switch(typeof f){case'number':case'string':if(/^([+-]=)?\d+(\.\d+)?(px|%)?$/.test(f)){f=p(f);break}f=d(f,this);case'object':if(f.is||f.style)s=(f=d(f)).offset()}d.each(b.axis.split(''),function(a,i){var e=i=='x'?'Left':'Top',h=e.toLowerCase(),c='scroll'+e,l=q[c],m=k.max(q,i);if(s){g[c]=s[h]+(u?0:l-r.offset()[h]);if(b.margin){g[c]-=parseInt(f.css('margin'+e))||0;g[c]-=parseInt(f.css('border'+e+'Width'))||0}g[c]+=b.offset[h]||0;if(b.over[h])g[c]+=f[i=='x'?'width':'height']()*b.over[h]}else{var o=f[h];g[c]=o.slice&&o.slice(-1)=='%'?parseFloat(o)/100*m:o}if(/^\d+$/.test(g[c]))g[c]=g[c]<=0?0:Math.min(g[c],m);if(!a&&b.queue){if(l!=g[c])t(b.onAfterFirst);delete g[c]}});t(b.onAfter);function t(a){r.animate(g,j,b.easing,a&&function(){a.call(this,n,b)})}}).end()};k.max=function(a,i){var e=i=='x'?'Width':'Height',h='scroll'+e;if(!d(a).is('html,body'))return a[h]-d(a)[e.toLowerCase()]();var c='client'+e,l=a.ownerDocument.documentElement,m=a.ownerDocument.body;return Math.max(l[h],m[h])-Math.min(l[c],m[c])};function p(a){return typeof a=='object'?a:{top:a,left:a}}})(jQuery);
View
4 contents/css/style-desktop.css
@@ -215,3 +215,7 @@ section:last-child
{
color: #8d9ca3;
}
+
+ .sharethis {
+ float: right;
+ }
View
4 contents/css/style-mobile.css
@@ -298,4 +298,8 @@ body, input, textarea, select
.mobileUI-site-nav-link:last-child {
border-bottom: 0;
+ }
+
+ .sharethis {
+ float: right;
}
View
BIN contents/images/Jonathan-Tarud.jpg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN contents/images/Rafael-Garcia.jpg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN contents/images/Yuji-Kiriki.jpg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN contents/images/banner.jpg
Deleted file not rendered
View
BIN contents/images/pic06.jpg
Deleted file not rendered
View
BIN contents/images/pic07.jpg
Deleted file not rendered
View
BIN contents/images/pic08.jpg
Deleted file not rendered
View
BIN contents/images/talent.jpg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
50 templates/features.jade
@@ -0,0 +1,50 @@
+// Features
+div#features-wrapper
+ div#features
+ div.5grid-layout
+ div.row
+ div.3u
+ section
+ a.bordered-feature-image(href='#')
+ img(src='images/pic01.jpg', alt='')
+ h2 Colombia y el emprendimiento digital
+ :markdown
+ El Ministerio de Tecnologías de la Información y las Comunicaciones
+ (Mintic) impulsa una cultura de emprendimiento virtual, a través de
+ su programa Vive Digital. El desarrollo de software y aplicaciones
+ para teléfonos inteligentes, juegos de video, publicidad y animaciones
+ digitales, hacen parte de los focos de interés de este organismo.
+ [Fuente: El espectador](http://bit.ly/R2sJSv)
+
+ div.3u
+ section
+ a.bordered-feature-image(href='#')
+ img(src='images/pic02.jpg', alt='')
+ h2 Desarrolladores de software
+ :markdown
+ This is a **Halcyonic** a free template that can
+ include [links](http://www.google.com)
+ so this kick _ass_ [badly](http://david.roncancio.me)
+
+ div.3u
+ section
+ a.bordered-feature-image(href='#')
+ img(src='images/pic03.jpg', alt='')
+ h2 Continua Demanda
+ :markdown
+ Los desarrolladores recien graduados en ciudades como Boston, NY o San Francisco
+ tienen salarios que empiezan desde los $75,000 dolares al año, y aquellos con mas experiencia
+ estan ganando alrededor de $140,000 dolares en el mismo periodo, y los salarios en esta industria
+ siguen aumentando en ese pais, casi en un 15 porciento en el año pasado
+ [Fuente: Boston Globe](http://b.globe.com/12wmyIR)
+
+
+ div.3u
+ section
+ a.bordered-feature-image(href='#')
+ img(src='images/pic04.jpg', alt='')
+ h2 Welcome to Halcyonic
+ :markdown
+ This is a **Halcyonic** a free template that can
+ include [links](http://www.google.com)
+ so this kick _ass_ [badly](http://david.roncancio.me)
View
47 templates/footer.jade
@@ -0,0 +1,47 @@
+// Footer
+div#footer-wrapper
+ footer#footer.5grid-layout
+ div.row
+ div.8u
+ section
+ h2 Links to important stuff
+ div.5grid
+ div.row
+ div.3u
+ ul.link-list.last-child
+ li
+ a(href='#') some url
+ li
+ a(href='#') some url
+ li
+ a(href='#') some url
+ li
+ a(href='#') some url
+ div.3u
+ ul.link-list.last-child
+ li
+ a(href='#') some url
+ li
+ a(href='#') some url
+ li
+ a(href='#') some url
+ li
+ a(href='#') some url
+ div.3u
+ ul.link-list.last-child
+ li
+ a(href='#') some url
+ li
+ a(href='#') some url
+ li
+ a(href='#') some url
+ li
+ a(href='#') some url
+ div.4u
+ section
+ h2 an informative text
+ :markdown
+ Duis neque nisi, dapibus sed mattis quis, rutrum accumsan sed. Suspendisse eu
+ varius nibh. Suspendisse vitae magna eget odio amet mollis. Duis neque nisi,
+ dapibus sed mattis quis, sed rutrum accumsan sed. Suspendisse eu varius nibh
+ lorem ipsum amet dolor sit amet lorem ipsum consequat gravida justo mollis.
View
98 templates/index.jade
@@ -1,24 +1,80 @@
extends layout
block content
- include author
- //- underscore helps us filter and sort our articles
- - var articles = _.chain(contents.articles._.directories).map(function(item) {
- - // map articles to index pages of subdirectories of 'articles'
- - return item.index
- - }).compact().sortBy(function(item) { // compact removes any directories w/o an index
- - // sort them by date
- - return -item.date
- - }).first(5).value() // and finally take the first 5
- each article in articles
- article.post
- header
- h2
- a(href=article.url)= article.title
- p
- mixin author(article.metadata.author)
- section.content!= article.intro
- if article.hasMore
- p.read-more
- a(href=article.url) read more
- a(href='archive.html')#archive Visit the archives!
+
+ include features
+
+ // Content
+ div#content-wrapper
+ div#content
+ div.5grid-layout
+ div.row
+ div.3u
+ section
+ div.quote-list
+ img(src='/images/Jonathan-Tarud.jpg', alt='Jonathan Tarud')
+ :markdown
+ # [Jonathan Tarud](http://twitter.com/dangertz)
+ CEO, Region Américas, Lenddo
+ There should also be a way to have a longer description
+
+ div.3u
+ section
+ div.quote-list
+ img(src='/images/Yuji-Kiriki.jpg', alt='Yuji Kiriki')
+ :markdown
+ # [Yuji Kiriki](http://twitter.com/dangertz)
+ CEO, Region Américas, Lenddo
+ There should also be a way to have a longer description
+
+ div.3u
+ section
+ div.quote-list
+ img(src='/images/Rafael-Garcia.jpg', alt='Rafael Garcia')
+ :markdown
+ # [Rafael Garcia](http://twitter.com/dangertz)
+ CEO, Region Américas, Lenddo
+ There should also be a way to have a longer description
+
+ div.3u
+ section
+ div.quote-list
+ img(src='/images/Missing_Panelist.jpg', alt='Jonathan Tarud')
+ :markdown
+ # [Missing](http://twitter.com/dangertz) (Moredador)
+ Missing Description
+
+ div.row
+ div.4u
+ section
+ header
+ h2 Organizadores
+ h3 Logistica
+ a.feature-image(href='#')
+ img(src='/images/pic05.jpg', alt='')
+ :markdown
+ [Dan Gertsacov](http://twitter.com/dangertz), CEO, Region Américas, Lenddo -
+ There should also be a way to have a longer description
+
+ div.4u
+ section
+ header
+ h2 Who are We
+ h3 Some awesome group
+ ul.check-list
+ li first
+ li second
+ li third
+ li fourth
+
+ div.4u
+ section
+ header
+ h2 Moderador
+ a.feature-image(href='#')
+ img(src='/images/pic05.jpg', alt='')
+ :markdown
+ [Dan Gertsacov](http://twitter.com/dangertz), CEO, Region Américas, Lenddo
+
+
+ include footer
View
173 templates/layout.jade
@@ -15,8 +15,6 @@ html(lang='en')
link(rel='stylesheet', href='/css/5grid/core-noscript.css')
link(rel='stylesheet', href='/css/style.css')
link(rel='stylesheet', href='/css/style-desktop.css')
- script(src='css/5grid/jquery.js')
- script(src='css/5grid/init.js?use=mobile,desktop,1000px&amp;mobileUI=1&amp;mobileUI.theme=none&amp;mobileUI.titleBarHeight=55&amp;mobileUI.openerWidth=75&amp;mobileUI.openerText=&lt;')
link(rel='alternate', href=locals.url+'/feed.xml', type='application/rss+xml', title=locals.description)
body
@@ -26,159 +24,40 @@ html(lang='en')
div.row
div.12u
h1
- a.mobileUI-site-name(href='#') Talento Digital
- nav.mobileUI-site-nav
- a(href='#') Home
- a(href='#') Blog
- a(href='#') About us
+ a.mobileUI-site-name(href='#') Primer Foro de Talento Digital
+ nav#nav.mobileUI-site-nav
+ a(href='#features-wrapper') Acerca de
+ a(href='#') Inscripci&oacute;n
+ a(href='#') Apoyado por
+ div.sharethis
+ span.st_email_hcount(displayText='Email')
+ span.st_facebook_hcount(displayText='Facebook')
+ span.st_twitter_hcount(displayText='Tweet')
+ span.st_linkedin_hcount(displayText='LinkedIn')
div#banner
div.5grid-layout
div.row
div.6u
- p We do something really useful, important, and unique. Learn all about it here ..
- a.button-big(href='#') Go on, click me!
+ :markdown
+ En la era de la informaci&oacute;n y la tecnolog&iacute;a son nuevas las habilidades
+ que se requieren, esta el pa&iacute;s preparado para una nueva la nueva era digital?
+
+ a.button-big(href='#') Inscribete!
div.6u
a.bordered-feature-image(href='#')
- img(src='images/banner.jpg', alt='')
-
- // Features
- div#features-wrapper
- div#features
- div.5grid-layout
- div.row
- div.3u
- section
- a.bordered-feature-image(href='#')
- img(src='images/pic01.jpg', alt='')
- h2 Welcome to Halcyonic
- :markdown
- This is a **Halcyonic** a free template that can
- include [links](http://www.google.com)
- so this kick _ass_ [badly](http://david.roncancio.me)
-
- div.3u
- section
- a.bordered-feature-image(href='#')
- img(src='images/pic02.jpg', alt='')
- h2 Welcome to Halcyonic
- :markdown
- This is a **Halcyonic** a free template that can
- include [links](http://www.google.com)
- so this kick _ass_ [badly](http://david.roncancio.me)
-
- div.3u
- section
- a.bordered-feature-image(href='#')
- img(src='images/pic03.jpg', alt='')
- h2 Welcome to Halcyonic
- :markdown
- This is a **Halcyonic** a free template that can
- include [links](http://www.google.com)
- so this kick _ass_ [badly](http://david.roncancio.me)
-
- div.3u
- section
- a.bordered-feature-image(href='#')
- img(src='images/pic04.jpg', alt='')
- h2 Welcome to Halcyonic
- :markdown
- This is a **Halcyonic** a free template that can
- include [links](http://www.google.com)
- so this kick _ass_ [badly](http://david.roncancio.me)
+ img(src='images/talent.jpg', alt='')
- // Content
- div#content-wrapper
- div#content
- div.5grid-layout
- div.row
- div.4u
- section
- header
- h2 Who are We
- h3 Some awesome group
- a.feature-image(href='#')
- img(src='/images/pic05.jpg', alt='')
- :markdown
- This is some parragraf, lorem ipsum
-
- div.4u
- section
- header
- h2 Who are We
- h3 Some awesome group
- ul.check-list
- li first
- li second
- li third
- li fourth
-
- div.4u
- section
- header
- h2 Who are We
- h3 Some awesome group
- ul.quote-list
- li
- img(src='/images/pic06.jpg', alt='')
- p "His name!!"
- span and some infor
- li
- img(src='/images/pic07.jpg', alt='')
- p "His name!!"
- span and some infor
- li
- img(src='/images/pic08.jpg', alt='')
- p "His name!!"
- span and some infor
-
- // Footer
- div#footer-wrapper
- footer#footer.5grid-layout
- div.row
- div.8u
- section
- h2 Links to important stuff
- div.5grid
- div.row
- div.3u
- ul.link-list.last-child
- li
- a(href='#') some url
- li
- a(href='#') some url
- li
- a(href='#') some url
- li
- a(href='#') some url
- div.3u
- ul.link-list.last-child
- li
- a(href='#') some url
- li
- a(href='#') some url
- li
- a(href='#') some url
- li
- a(href='#') some url
- div.3u
- ul.link-list.last-child
- li
- a(href='#') some url
- li
- a(href='#') some url
- li
- a(href='#') some url
- li
- a(href='#') some url
- div.4u
- section
- h2 an informative text
- :markdown
- Duis neque nisi, dapibus sed mattis quis, rutrum accumsan sed. Suspendisse eu
- varius nibh. Suspendisse vitae magna eget odio amet mollis. Duis neque nisi,
- dapibus sed mattis quis, sed rutrum accumsan sed. Suspendisse eu varius nibh
- lorem ipsum amet dolor sit amet lorem ipsum consequat gravida justo mollis.
+ block content
+ script(src='css/5grid/jquery.js')
+ script(src='css/5grid/jquery.scrollTo.js')
+ script(src='css/5grid/jquery.nav.js')
+ script(src='css/5grid/init.js?use=mobile,desktop,1000px&amp;mobileUI=1&amp;mobileUI.theme=none&amp;mobileUI.titleBarHeight=55&amp;mobileUI.openerWidth=75&amp;mobileUI.openerText=&lt;')
+ script(type='text/javascript')
+ var switchTo5x=true;
+ script(src='http://w.sharethis.com/button/buttons.js')
+ script(type='text/javascript')
+ stLight.options({publisher: "cb9b1ed5-92b7-4d0d-87ac-07112bc77a27"});
// Copyright
div#copyright
&copy; Untitled. All rights reserved. | Design:

0 comments on commit 66369cb

Please sign in to comment.
Something went wrong with that request. Please try again.