From 29132bc1e5ac7b2191805aaa623f147e333c9188 Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Thu, 3 Jul 2014 18:53:39 +0200 Subject: [PATCH] remove socialite, use static tweet button --- Gruntfile.js | 1 - _src/_includes/comments.html | 6 +-- _src/assets/js/app.js | 82 ++++++++++++++------------------ _src/assets/less/buttons.less | 70 ++++++++++++++++----------- _src/assets/less/comments.less | 10 ++-- _src/assets/less/typography.less | 2 +- bower.json | 1 - 7 files changed, 87 insertions(+), 85 deletions(-) diff --git a/Gruntfile.js b/Gruntfile.js index ca94a792..2c06fdef 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -111,7 +111,6 @@ module.exports = function(grunt){ 'bower_components/masonry/index.js', 'bower_components/imagesloaded/imagesloaded.js', 'bower_components/simpleJekyllSearch/index.js', - 'bower_components/socialite/index.js', 'bower_components/jquery.adaptive-background/index.js', '<%= config.src %>/<%= config.assets.js %>/app.js' ] diff --git a/_src/_includes/comments.html b/_src/_includes/comments.html index 0eb1f1d8..cb5a96da 100644 --- a/_src/_includes/comments.html +++ b/_src/_includes/comments.html @@ -1,7 +1,7 @@ \ No newline at end of file diff --git a/_src/assets/js/app.js b/_src/assets/js/app.js index 101d89b0..43cee414 100644 --- a/_src/assets/js/app.js +++ b/_src/assets/js/app.js @@ -3,29 +3,29 @@ $(ASAP = function(){ siteNavigation.init(); siteEffects.init(); - + infiniteScroll.init(); + }); $(window).load( AfterLoad = function() { - + photoGrid.init(); - infiniteScroll.init(); - + }); var siteNavigation = { - + siteSearch: function() { - + var $searchlink = $('.search-btn'), $searcharea = $('.topbar .search-area'), $searchfield = $('.search-field'), $searchresults = $('.search-results'), $searchpop = $('.popover'); - + $searchlink.click(function(e){ e.preventDefault(); - + // init jekyll search $searchfield.jekyllSearch({ searchResults : $searchresults, @@ -33,28 +33,28 @@ var siteNavigation = { template : '{title}', fuzzy : true }); - + // show search $searcharea.addClass('ready'); $searchfield.focus(); if ( $searchfield.val().length ) { $searchpop.removeClass('hide'); } - + // hide menu too just in case if ( $('body').hasClass('menu-open') ) { $('body').removeClass('menu-open'); } - + // bind the hide controls $(document).bind('click.hidethepop', function() { $searcharea.removeClass('ready'); $searchpop.addClass('hide'); - + // unbind the hide controls $(document).unbind('click.hidethepop'); }); - + // dont close thepop when click on thepop $searchpop.click(function(e) { e.stopPropagation(); @@ -63,39 +63,39 @@ var siteNavigation = { $searchfield.click(function(e) { e.stopPropagation(); }); - - // and dont close thepop now + + // and dont close thepop now e.stopPropagation(); }); - + // finally show popup upon first keypress $searchfield.on('keyup', function() { $searchpop.removeClass('hide'); }); - + // close button $('.search-close').click(function(e){ e.preventDefault(); - + // hide search area $searcharea.removeClass('ready'); $searchpop.addClass('hide'); - + // empty search field $searchfield.val('').blur(); }); }, - + siteMenu: function() { var $thelink = $('.menu-btn'), $thepop = $('.nav-main .nav-popover'); - + $thelink.click(function(e){ e.preventDefault(); - + // toggle menu $('body').toggleClass('menu-open'); - + if ( $('body').hasClass('menu-open') ) { $thepop.removeClass('hide'); } else { @@ -104,22 +104,22 @@ var siteNavigation = { // bind the hide controls $(document).bind('click.hidethepop', function() { - $('body').removeClass('menu-open'); - $thepop.toggleClass('hide'); - // unbind the hide controls - $(document).unbind('click.hidethepop'); + $('body').removeClass('menu-open'); + $thepop.toggleClass('hide'); + // unbind the hide controls + $(document).unbind('click.hidethepop'); }); - + // dont close thepop when you click on thepop $thepop.click(function(e) { e.stopPropagation(); }); - - // and dont close thepop now + + // and dont close thepop now e.stopPropagation(); }); }, - + init: function(){ this.siteSearch(); this.siteMenu(); @@ -131,7 +131,7 @@ var photoGrid = { masonryLayout: function() { var $container = $('#main .masonry'); - + $container.imagesLoaded( function(){ $container.masonry({ itemSelector : 'article', @@ -142,7 +142,7 @@ var photoGrid = { init: function(){ // only fire when photo page present and screen bigger than 480px - if ( $('.page-photos').length > 0 ) { + if ( $('.page-photos').length > 0 ) { this.masonryLayout(); } } @@ -150,33 +150,25 @@ var photoGrid = { } var siteEffects = { - + adaptiveBackground: function() { var opts = { selector: '.hmedia img', parent: '.document' } - + $('.hmedia img').imagesLoaded( function(){ $.adaptiveBackground.run(opts) }); - + // jump to photo background start $(document).scrollTop($('#main').offset().top); }, - - socialiteButtons: function() { - - $('.comments').one('mouseenter', function() { - Socialite.load($(this)[0]); - }); - }, - + init: function(){ if ( $('.page-single .format-photo').length > 0 ) { this.adaptiveBackground(); } - this.socialiteButtons(); } } diff --git a/_src/assets/less/buttons.less b/_src/assets/less/buttons.less index fc934346..f316d0e8 100644 --- a/_src/assets/less/buttons.less +++ b/_src/assets/less/buttons.less @@ -20,11 +20,11 @@ .border-radius; .box-shadow(~"0 1px 3px rgba(151,156,159,.1), inset 0 1px 0 rgba(255,255,255,.7)"); .transition; - + &:hover { background-color: rgba(255,255,255,.5); } - + &:active { background-color: transparent; border-top-color: rgba(94,131,162,.5); @@ -32,7 +32,7 @@ .box-shadow(0 1px 0 #fff); .transition(none); } - + span { font-size: .9em; color: rgba(19, 56, 50, .6); @@ -48,13 +48,13 @@ a.btn-primary:visited { border-color: rgba(40,101,93,.4); border-bottom-color: rgba(40,101,93,.5); .box-shadow(~"0 1px 3px rgba(151,156,159,.1), inset 0 1px 0 rgba(255,255,255,.4)"); - + &:hover { color: darken(@link-color, 30%); background-color: lighten(@link-color, 25%); text-shadow: 0 1px 0 rgba(255,255,255,.3); } - + &:active { color: darken(@link-color, 30%); background-color: lighten(@link-color, 15%); @@ -72,16 +72,16 @@ a.btn-primary:visited { .box-shadow(none); padding: 0; margin: 0; - + i:before { top: .15em; position: relative; } - + &:hover { background: none; } - &:active { + &:active { background: @link-color; .box-shadow(none); } @@ -92,32 +92,46 @@ a.btn-primary:visited { } -// Socialite.js -// replicate social buttons, but dim everything -.btn.socialite { - font: normal normal normal 11px/18px 'Helvetica Neue',Arial,sans-serif; - text-align: left; - color: #676767; - text-transform: none; - font-weight: bold; - text-shadow: 0 1px 0 rgba(255, 255, 255, .5); - height: 21px; - max-width: 100%; - position: relative; - background-color: rgba(255,255,255,.4); - #gradient > .vertical(rgba(255,255,255,0.7); 0%; rgba(255,255,255,0); 100%); - border: 1px solid #dcdcdc; +// +// Tweet button +// +.btn.twitter-share { + display: inline-block; + padding: 1px 3px 0 3px; + height: 21px; + border: 1px solid #ccc; border-radius: 3px; - display: inline-block; + font: bold 11px/17px Helvetica, Arial, sans-serif; + text-align: left; + color: #333; + text-transform: none; + text-decoration: none; + text-shadow: 0 1px 0 rgba(255, 255, 255, .5); + background-color: #f8f8f8; + #gradient > .vertical(#fff; 0%; #dedede; 100%); vertical-align: top; - padding: 1px 5px; .box-shadow(none); - + + &:hover, + &:focus, + &:active { + border-color: #bbb; + background-color: #d9d9d9; + #gradient > .vertical(#f8f8f8; 0%; #d9d9d9; 100%); + } + + &:active { + top: 0; + background-color: #efefef; + box-shadow: inset 0 3px 5px rgba(0,0,0,0.1); + } + // icon &:before { font-size: 15px; margin-right: 2px; - top: 1px + top: 1px; + color: #0089cb; } - + } \ No newline at end of file diff --git a/_src/assets/less/comments.less b/_src/assets/less/comments.less index 2f548049..7df4446f 100644 --- a/_src/assets/less/comments.less +++ b/_src/assets/less/comments.less @@ -1,19 +1,17 @@ .comments { - .clearfix; + &:extend(.clearfix all, .textcenter); font-size: @font-size-small; font-style: italic; color: @text-color-dimmed; margin-top: @line-height-computed*2; - text-align: center; .border-radius; - + p, .btn { margin-bottom: 0; } - - .btn-wrap { + + .btn-wrap { margin-top: @line-height-computed/2; height: 27px } - .btn { left: -20px } } \ No newline at end of file diff --git a/_src/assets/less/typography.less b/_src/assets/less/typography.less index 6f127b8a..6869cea7 100644 --- a/_src/assets/less/typography.less +++ b/_src/assets/less/typography.less @@ -76,7 +76,7 @@ a:active { .transition(none); top: 1px; background: @link-color; - color: #fff !important; + color: #fff; text-shadow: none; } diff --git a/bower.json b/bower.json index d0ee4669..fa242799 100644 --- a/bower.json +++ b/bower.json @@ -15,7 +15,6 @@ "imagesloaded": ">=3.1.0", "infinitescroll": "https://raw.github.com/paulirish/infinite-scroll/master/jquery.infinitescroll.js", "simpleJekyllSearch": "https://raw.github.com/christian-fei/Simple-Jekyll-Search/master/jekyll-search.jquery.js", - "socialite": "https://raw.github.com/tmort/Socialite/master/socialite.js", "jquery.adaptive-background": "https://raw.github.com/briangonzalez/jquery.adaptive-backgrounds.js/master/src/jquery.adaptive-backgrounds.js" }, "ignore": [