Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Colours (yes, @abitgone, it's bloody orange), comments and code tweaks.

  • Loading branch information...
commit a0caf91f904c3572467af86e0d6cc6ff6c5568ff 1 parent 2b7289e
@phuu phuu authored
View
2  _multipack/multipack.php
@@ -162,7 +162,7 @@ private function get_event_by_meetup($meetup) {
* of use in the view
* @param $count number of events retrieved
*/
- private function get_events($count = 3) {
+ private function get_events($count = 2) {
$cached = Cache::cached('events');
View
2  _multipack/view/coming_soon.php
@@ -5,7 +5,7 @@
<?php $this->view_component('nav'); ?>
<div class="presents branding">
<h1>Coming Soon...</h1>
- <h2>The Multipack's series of topical events, put on every few months</h2>
+ <h2>The Multipack's series of topical events, put on every 3 months</h2>
</div>
</header>
</section>
View
2  _multipack/view/footer.php
@@ -39,7 +39,7 @@
<p class="copyright">&copy; 2012 The Multipack</p>
<p class="feed icon-rss"><a href="/blog/feed/" rel="alternate" type="application/atom+xml">Grab our feed</a></p>
<p class="license">
- <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/InteractiveResource" property="dct:title" rel="dct:type">The Multipack website</span> is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-nc/3.0/">Creative Commons License</a> and is open-sourced on <a href="//github.com/phuu/multipack" title="Multipack on Github">Github</a>.
+ <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/InteractiveResource" property="dct:title" rel="dct:type">The Multipack website</span> is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-nc/3.0/">Creative Commons License</a> and is open-sourced on <a href="//github.com/multipack/website" title="Multipack on Github">Github</a>.
</p>
</section>
</footer>
View
2  _multipack/view/presents.php
@@ -3,7 +3,7 @@
<?php $this->view_component('nav'); ?>
<div class="presents branding">
<h1>Multipack Presents</h1>
- <h2>The Multipack's series of topical events, put on every few months</h2>
+ <h2>The Multipack's series of topical events, put on every 3 months</h2>
</div>
</header>
<article role="about">
View
12 css/less/colour.less
@@ -16,7 +16,7 @@
@dark-green: saturate(darken(@base-green, 30%), 10%);
@grey-green: desaturate(darken(@base-green, 10%), 30%);
-@base-pink: spin(@base-blue, 120);
+@base-pink: spin(@base-blue, 180);
@dark-pink: saturate(darken(@base-pink, 30%), 10%);
@grey-pink: desaturate(darken(@base-pink, 10%), 30%);
@@ -29,8 +29,8 @@
@bg: white;
@color: @dark-grey;
-@link: @color;
-@link-hover: darken(@color, 10%);
+@link: darken(@color, 10%);
+@link-hover: @color;
@section-bg: @light-grey;
@section-alternate: @grey-green;
@@ -60,9 +60,9 @@
@leampack-alternate: @dark-blue;
@leampack-fade: @grey-blue;
@leampack-highlight: white;
-@leampack-link: @dark-blue;
+@leampack-link: darken(@dark-blue, 5%);
@leampack-link-bg: darken(@leampack-bg, 5%);
-@leampack-link-bg-hover: darken(@leampack-bg, 10%);
+@leampack-link-bg-hover: darken(@leampack-bg, 8%);
// @staffspack-bg: @blue-grey;
// @staffspack-color: @color;
@@ -362,7 +362,7 @@ nav {
// }
.presents a:hover {
text-decoration: line-through;
- // border-color: @presents-bg;
+ border-color: @presents-bg;
background-color: @section-nav-link-bg;
}
}
View
32 css/style.css
@@ -86,9 +86,9 @@ footer .footer{font-size:0.667em;}
.icon-rss:before{content:'r';}
.icon-top:before{content:'u';}
body{background:#ffffff;color:#444444;-webkit-font-smoothing:antialiased;}
-a,a:visited{-webkit-transition:all .1s linear;transition:all .1s linear;color:#444444;}
-a:hover,a:active{color:#2b2b2b;border-bottom:0.088em solid #2b2b2b;}
-p a{border-bottom:0.088em dotted #444444;}
+a,a:visited{-webkit-transition:all .1s linear;transition:all .1s linear;color:#2b2b2b;}
+a:hover,a:active{color:#444444;border-bottom:0.088em solid #444444;}
+p a{border-bottom:0.088em dotted #2b2b2b;}
::-moz-selection{color:white;background:#a5ca4e;}
::selection{color:white;background:#a5ca4e;}
header nav a,header nav a:visited{background:#e9e9e9;outline:none;border-left:0.444em solid #f3f3f3;}
@@ -113,24 +113,24 @@ header nav a:hover,header nav a:active{border-bottom:none;background:#dfdfdf;}
.leampack.event h2,.leampack.tweet footer{color:#f3f3f3;}
.leampack.event .date,.leampack.event .location,.leampack.event .synopsis{color:#11536f;}
.leampack.event .type{color:#ffffff;}
-.leampack.event a,.leampack.event a:visited{color:#11536f;border-color:#11536f;}
-.leampack.event nav a,.leampack.tweet a{color:#11536f;background-color:#2ea0d1;}
-.leampack.event nav a:hover,.leampack.tweet a:hover{background-color:#2990bc;border-bottom:none;}
-.leampack.tweet:before{color:#11536f;}
-.presents.event,.presents.tweet{background-color:#d643aa;color:#f3f3f3;}
-.presents.branding{color:#d643aa;}.presents.branding h2{color:#9a4c82;}
+.leampack.event a,.leampack.event a:visited{color:#0d4259;border-color:#0d4259;}
+.leampack.event nav a,.leampack.tweet a{color:#0d4259;background-color:#2ea0d1;}
+.leampack.event nav a:hover,.leampack.tweet a:hover{background-color:#2b97c5;border-bottom:none;}
+.leampack.tweet:before{color:#0d4259;}
+.presents.event,.presents.tweet{background-color:#d66f43;color:#f3f3f3;}
+.presents.branding{color:#d66f43;}.presents.branding h2{color:#9a634c;}
.presents.event h2,.presents.tweet footer{color:#f3f3f3;}
-.presents.event .date,.presents.event .location,.presents.event .synopsis{color:#6f1153;}
+.presents.event .date,.presents.event .location,.presents.event .synopsis{color:#6f2d11;}
.presents.event .type{color:#ffffff;}
-.presents.event a,.presents.event a:visited{color:#9a4c82;border-color:#9a4c82;}
-.presents.event nav a,.presents.tweet a{color:#9a4c82;background-color:#d84bad;}
-.presents.event nav a:hover,.presents.tweet a:hover{background-color:#da58b3;border-bottom:none;}
-.presents.tweet:before{color:#9a4c82;}
+.presents.event a,.presents.event a:visited{color:#9a634c;border-color:#9a634c;}
+.presents.event nav a,.presents.tweet a{color:#9a634c;background-color:#d8754b;}
+.presents.event nav a:hover,.presents.tweet a:hover{background-color:#da7f58;border-bottom:none;}
+.presents.tweet:before{color:#9a634c;}
section{border-top:.1875em solid white;background:#f3f3f3;}section[role=color]{box-shadow:0 -4px 6px -4px rgba(0, 0, 0, 0.2);}
section h2{color:#7e8e57;}
nav .multipack a:hover{border-color:#a5ca4e;}
nav .leampack a:hover{border-color:#43aad6;}
-nav .presents a:hover{text-decoration:line-through;background-color:#e9e9e9;}
+nav .presents a:hover{text-decoration:line-through;border-color:#d66f43;background-color:#e9e9e9;}
.photos li{background:#e9e9e9;}.photos li a:hover{background:#cacaca;}
.photos li img{box-shadow:0 1px 3px #cacaca;box-shadow:0 1px 3px rgba(0, 0, 0, 0.2);}
.photos li .more a{color:#7e8e57;}
@@ -138,7 +138,7 @@ nav .presents a:hover{text-decoration:line-through;background-color:#e9e9e9;}
.newsletter input[type=email]:focus{outline:1px solid #a5ca4e;}
.newsletter input[type=submit]{background:#a5ca4e;}
.newsletter input[type=submit]:hover{background-color:#8cb135;}
-.top,.top:visited{background:#e9e9e9;background:rgba(0, 0, 0, 0.2);color:#444444;}.top:hover,.top:visited:hover,.top:active,.top:visited:active{background:rgba(0, 0, 0, 0.3);color:#2b2b2b;border-bottom:none;}
+.top,.top:visited{background:#e9e9e9;background:rgba(0, 0, 0, 0.2);color:#2b2b2b;}.top:hover,.top:visited:hover,.top:active,.top:visited:active{background:rgba(0, 0, 0, 0.3);color:#444444;border-bottom:none;}
.extra{display:none;}
.focus .extra{display:block;}
.photos{margin:1.5em 0 0;}.photos ul{margin:0;overflow:hidden;list-style:none;padding-left:0;}
View
225 js/script.js
@@ -1,108 +1,167 @@
+/**
+ * Multipack JS
+ *
+ * If you add to this file, please be a good Javascript citizen:
+ * - wrap new functionality in a closure to avoid polluting the namespace
+ * - if you're loading anything, do it as infrequently as possible
+ * - comment it
+ */
$(function () {
- // Add icon fonts
- setTimeout(function () {
+ /**
+ * Add icon font from Pictos asynchronously (they're not *that* important)
+ */
+ ;(function () {
var url = "//get.pictos.cc/fonts/1780/1",
elem = document.createElement('link');
$(elem).prop({rel: "stylesheet", href: url});
$('head').append(elem);
- }, 1000);
+ }());
- // Event interactions
- $(".findmore a").click(function (e) {
- $(this).closest('.event').removeClass('folded');
- e.preventDefault();
- });
- $(".findless a").click(function (e) {
- $(this).closest('.event').addClass('folded');
- e.preventDefault();
- });
+ /**
+ * set up event interactions
+ */
+ ;(function () {
+
+ $(".findmore a").click(function (e) {
+ $(this).closest('.event').removeClass('folded');
+ e.preventDefault();
+ });
+ $(".findless a").click(function (e) {
+ $(this).closest('.event').addClass('folded');
+ e.preventDefault();
+ });
+
+ }());
- // Twitter
- var endpoint = "http://api.twitter.com/1/statuses/user_timeline.json?",
- options = "&exclude_replies=true&count=5&callback=?"; // Callback prevents XHR http://bit.ly/HbQsH7
- var pattern = /((mailto\:|(news|(ht|f)tp(s?))\:\/\/){1}\S+)/ig;
-
- // Swap out tweet text
- var updateText = function (elem, data) {
- // Does this element actually exist?
- if( $(elem).length === 0 ) return;
- // Did we get any data?
- if( !data.text ) return;
-
- // Find text element
- var p = $(elem).find('p');
-
- // Does it need updating?
- if( $(p).text() !== data.text ) {
- $(p).height($(p).height()).fadeOut(function () {
- var date = data.created_at.split(' '),
- date_string = ["<time>", date[0], date[2], date[1], "at", date[3], "</time>"].join(' ');
- var text = data.text;
- text = text.replace(pattern, '<a href="$1">$1</a>');
- $(p).height('auto').html(text + date_string).fadeIn();
+ /**
+ * Get all of the tweets
+ */
+ ;(function () {
+
+ var endpoint = "http://api.twitter.com/1/statuses/user_timeline.json?",
+ options = "&exclude_replies=true&count=5&callback=?"; // Callback prevents XHR http://bit.ly/HbQsH7
+
+ // Don't reload the tweets if we have them in local storage
+ var localStorage = window.localStorage;
+
+ var pattern = /((mailto\:|(news|(ht|f)tp(s?))\:\/\/){1}\S+)/ig;
+
+ // Swap out tweet text
+ var updateText = function (elem, data) {
+ // Does this element actually exist?
+ if( $(elem).length === 0 ) return;
+ // Did we get any data?
+ if( !data.text ) return;
+
+ // Find text element
+ var p = $(elem).find('p');
+
+ // Format the date all nicely like
+ var date = data.created_at.split(' '),
+ date_string = ["<time>", date[0], date[2], date[1], "at", date[3], "</time>"].join(' ');
+
+ // Make links linky
+ var text = data.text;
+ text = text.replace(pattern, '<a href="$1">$1</a>');
+
+ // Stick the date on the end
+ text = text + date_string;
+
+ // Does it need updating?
+ if( $(p).text() !== text ) {
+ $(p).height($(p).height()).fadeOut(function () {
+ $(p).height('auto').html(text).fadeIn();
+ });
+ }
+ };
+
+ // Go get em, tiger
+ var getTweets = function (force) {
+
+ // If we're not being forced, and we have some tweets in
+ // localStorage, stick em in there
+ if( !force && localStorage["tweets"] !== undefined ) {
+ updateText($('.multipack.tweet blockquote'), localStorage["tweets.multipack"]);
+ updateText($('.leampack.tweet blockquote'), localStorage["tweets.leampack"]);
+ return;
+ }
+
+ // Grab that tweet, oh yeah
+ $.getJSON(endpoint + "screen_name=multipack" + options, function (data) {
+ localStorage["tweets.multipack"] = data[0];
+ updateText($('.multipack.tweet blockquote'), data[0]);
+ });
+ $.getJSON(endpoint + "screen_name=leampack" + options, function (data) {
+ localStorage["tweets.leampack"] = data[0];
+ updateText($('.leampack.tweet blockquote'), data[0]);
});
- }
- };
- var getTweets = function () {
- $.getJSON(endpoint + "screen_name=multipack" + options, function (data) {
- updateText($('.multipack.tweet blockquote'), data[0]);
- });
- $.getJSON(endpoint + "screen_name=leampack" + options, function (data) {
- updateText($('.leampack.tweet blockquote'), data[0]);
- });
- };
+ // We got the tweets
+ localStorage["tweets"] = true;
+ };
+
+ // Auto update
+ setInterval(function () {
+ getTweets(true); // Force a refresh
+ }, 1000 * 60 * 20); // Check for tweets every twenty minutes
+
+ // If we've got tweets, don't show the (hilarous) messages
+ if( localStorage["tweets"] !== undefined ) {
+ getTweets(false);
+ } else {
+ setTimeout(function () {
+ getTweets(true); // Dont't force a refresh
+ }, 1000 * 5); // Ahem. Synergising.
+ }
- setInterval(getTweets, 1000 * 60 * 5); // Check for tweets every five minutes
- setTimeout(getTweets, 1000 * 5); // Ahem
+ }());
+
+
+ /**
+ * Return to top button
+ */
+ ;(function () {
- // Return to top button
- var top = $('.top'), offset = $('section').first().offset().top;
- var hasTransitions = $('html').hasClass('csstransitions');
- var moveFade;
- $(window).scroll(function () {
+ var top = $('.top'),
+ offset = $('section').first().offset().top;
+ var hasTransitions = $('html').hasClass('csstransitions');
+ var moveFade;
+ $(window).scroll(function () {
- // Don't move yet, still scrollin'
- clearTimeout(moveFade);
+ // Don't move yet, still scrollin'
+ clearTimeout(moveFade);
- // Move the button after 100ms of no scrolling
- moveFade = setTimeout(function () {
- // Fade it out at the top
- if( $(window).scrollTop() < offset) {
- if( hasTransitions ) {
- $(top).css({opacity: 0});
+ // Move the button after 100ms of no scrolling
+ moveFade = setTimeout(function () {
+ // Fade it out at the top
+ if( $(window).scrollTop() < offset) {
+ if( hasTransitions ) {
+ $(top).css({opacity: 0});
+ } else {
+ $(top).fadeOut('slow');
+ }
} else {
- $(top).fadeOut('slow');
+ if( hasTransitions ) {
+ $(top).css({opacity: 0.5});
+ } else {
+ $(top).fadeIn('slow');
+ }
}
- } else {
+ // Move it real good
if( hasTransitions ) {
- $(top).css({opacity: 0.5});
+ $(top).css({top: $(window).scrollTop()});
} else {
- $(top).fadeIn('slow');
+ $(top).animate({top: $(window).scrollTop()});
}
- }
- // Move it real good
- if( hasTransitions ) {
- $(top).css({top: $(window).scrollTop()});
- } else {
- $(top).animate({top: $(window).scrollTop()});
- }
- }, 200);
+ }, 200);
- });
+ });
- // Trigger a scroll event
- $(window).scroll();
+ // Trigger a scroll event
+ $(window).scroll();
- // Debug info
- $('.debug').click(function () {
- if( $(this).height() <= 20 ) {
- $(this).animate({height: 'auto', background: 'transparent'});
- } else {
- $(this).animate({height: '20px', background: '#eee'});
- }
- });
+ }());
});
Please sign in to comment.
Something went wrong with that request. Please try again.