diff --git a/Gemfile b/Gemfile index 565d7e2c..c3031905 100644 --- a/Gemfile +++ b/Gemfile @@ -3,4 +3,5 @@ source "https://rubygems.org" # gem "rails" gem 'jekyll', '~>1.3.0' -gem 'mini_magick', '~>3.6.0' \ No newline at end of file +gem 'mini_magick', '~>3.6.0' +gem 'fileutils', '~>0.7' \ No newline at end of file diff --git a/Gemfile.lock b/Gemfile.lock index 6d22ef93..f78303d7 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -8,6 +8,8 @@ GEM highline (~> 1.6.11) fast-stemmer (1.0.2) ffi (1.9.3) + fileutils (0.7) + rmagick (>= 2.13.1) highline (1.6.20) jekyll (1.3.1) classifier (~> 1.3) @@ -38,6 +40,7 @@ GEM rb-kqueue (0.2.0) ffi (>= 0.5.0) redcarpet (2.3.0) + rmagick (2.13.2) safe_yaml (0.9.7) subexec (0.2.3) syntax (1.0.0) @@ -47,5 +50,6 @@ PLATFORMS ruby DEPENDENCIES + fileutils (~> 0.7) jekyll (~> 1.3.0) mini_magick (~> 3.6.0) diff --git a/Gruntfile.js b/Gruntfile.js index 8e057213..fd89c59d 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -103,6 +103,7 @@ module.exports = function(grunt){ 'bower_components/infinitescroll/index.js', 'bower_components/masonry/index.js', 'bower_components/imagesloaded/imagesloaded.js', + 'bower_components/simpleJekyllSearch/index.js', '<%= config.src %>/<%= config.assets.js %>/helper.js', '<%= config.src %>/<%= config.assets.js %>/app.js' ] @@ -144,7 +145,7 @@ module.exports = function(grunt){ options: { port: 1337, hostname: '*', - base: '_site' + base: '<%= config.site %>' } } }, diff --git a/README.md b/README.md index 773cc802..2f7f09e3 100644 --- a/README.md +++ b/README.md @@ -1,13 +1,19 @@ kremalicious3 -============= +================== Requirements ------------------ [https://npmjs.org/](NPM), [http://bower.io/](Bower), [http://bundler.io/](Bundler) -Get up and running: +Get up and running +------------------ +Install dependencies `npm install && bower install && bundle install` -`grunt server` \ No newline at end of file +Local development +`grunt server` + +Production build +`grunt build` \ No newline at end of file diff --git a/_src/_includes/header.html b/_src/_includes/header.html index 41b2c5c6..136896aa 100644 --- a/_src/_includes/header.html +++ b/_src/_includes/header.html @@ -1,18 +1,27 @@ - + + +
+ + +
+
- \ No newline at end of file + + + \ No newline at end of file diff --git a/_src/assets/fonts/entypo.dev.svg b/_src/assets/fonts/entypo.dev.svg deleted file mode 100644 index 618d95cf..00000000 --- a/_src/assets/fonts/entypo.dev.svg +++ /dev/null @@ -1,85 +0,0 @@ - - - - -This is a custom SVG font generated by IcoMoon. - - - - - - - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/_src/assets/fonts/entypo.eot b/_src/assets/fonts/entypo.eot old mode 100644 new mode 100755 index cc6c3de1..e473d617 Binary files a/_src/assets/fonts/entypo.eot and b/_src/assets/fonts/entypo.eot differ diff --git a/_src/assets/fonts/entypo.svg b/_src/assets/fonts/entypo.svg old mode 100644 new mode 100755 index c8b8c95f..7ec38087 --- a/_src/assets/fonts/entypo.svg +++ b/_src/assets/fonts/entypo.svg @@ -1,85 +1,27 @@ - -This is a custom SVG font generated by IcoMoon. - - +Generated by IcoMoon - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/_src/assets/fonts/entypo.ttf b/_src/assets/fonts/entypo.ttf old mode 100644 new mode 100755 index 2b0182b6..11f73512 Binary files a/_src/assets/fonts/entypo.ttf and b/_src/assets/fonts/entypo.ttf differ diff --git a/_src/assets/fonts/entypo.woff b/_src/assets/fonts/entypo.woff old mode 100644 new mode 100755 index 98cf7183..df1c71f1 Binary files a/_src/assets/fonts/entypo.woff and b/_src/assets/fonts/entypo.woff differ diff --git a/_src/assets/js/app.js b/_src/assets/js/app.js index afc0ae28..c99bdd47 100644 --- a/_src/assets/js/app.js +++ b/_src/assets/js/app.js @@ -16,16 +16,40 @@ $(ASAP = function(){ photoGrid.init(); + siteNavigation.init(); }); $(window).load( AfterLoad = function() { - //siteEffects.init(); infiniteScroll.init(); }); +var siteNavigation = { + + siteSearch: function() { + $('.search-field').simpleJekyllSearch({ + searchResults : '.search-results', + searchResultsTitle : '', + template : '{title}', + }); + }, + + siteMenu: function() { + $('.menu-btn').click(function(e) { + e.preventDefault(); + $('.nav-main .nav-popover').toggleClass('show').toggleClass('hide'); + }); + }, + + init: function(){ + this.siteSearch(); + this.siteMenu(); + } + +} + var photoGrid = { masonryLayout: function() { @@ -49,7 +73,7 @@ var photoGrid = { } var siteEffects = { - + init: function(){ } diff --git a/_src/assets/less/forms.less b/_src/assets/less/forms.less index c945026f..583da1b2 100644 --- a/_src/assets/less/forms.less +++ b/_src/assets/less/forms.less @@ -21,20 +21,8 @@ label { select, textarea, -input[type="text"], -input[type="password"], -input[type="datetime"], -input[type="datetime-local"], -input[type="date"], -input[type="month"], -input[type="time"], -input[type="week"], -input[type="number"], -input[type="email"], -input[type="url"], -input[type="search"], -input[type="tel"], -input[type="color"] { +.input-text, +.input-search { font-size: @font-size-base; line-height: @line-height-computed; font-family: @font-family-base; diff --git a/_src/assets/less/grid.less b/_src/assets/less/grid.less index a905de48..c26e340b 100644 --- a/_src/assets/less/grid.less +++ b/_src/assets/less/grid.less @@ -5,7 +5,7 @@ // 320px and up .container { - padding: 0 5%; + padding: 0 7%; width: 100%; } .row { @@ -23,7 +23,6 @@ .container:before, .row:before, .container:after, .row:after { display: table; content: ""; } .container:after, .row:after { clear: both; } -.container, .row { *zoom: 1; } @media @breakpoint1 { @@ -33,14 +32,13 @@ .col4, .col5, .col6 { } - - .container { - padding: 0 15%; } } @media @breakpoint2 { - + + .container { padding: 0 15%; } + .row { max-width: 35em; margin: @line-height-computed*2 auto; diff --git a/_src/assets/less/icons.less b/_src/assets/less/icons.less index 9489e78c..576099e5 100644 --- a/_src/assets/less/icons.less +++ b/_src/assets/less/icons.less @@ -13,6 +13,7 @@ font-style: normal; } +.topbar, .hentry, .footer { [class*="icon-"]:before { @@ -26,6 +27,7 @@ text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; } } @@ -43,60 +45,60 @@ } .icon-twitter:before { - content: "\e000"; + content: "\e600"; } .icon-facebook:before { - content: "\e001"; + content: "\e601"; } .icon-googleplus:before { - content: "\e002"; + content: "\e602"; } .icon-rss:before { - content: "\e008"; + content: "\e603"; } .icon-user:before, .icon-personal:before { - content: "\e009"; + content: "\e604"; } .icon-leaf:before, .icon-design:before { - content: "\e00a"; + content: "\e605"; } .icon-link:before { - content: "\e00b"; + content: "\e606"; } .icon-pictures:before, .icon-photos:before { - content: "\e00c"; + content: "\e607"; } .icon-camera:before, .icon-photography:before { - content: "\e010"; + content: "\e608"; } .icon-arrow-down:before, .icon-download:before, .icon-download-alt:before { - content: "\e00d"; -} -.icon-arrow-right:before { - content: "\e00e"; -} -.icon-arrow-left:before { - content: "\e00f"; -} -.icon-heart:before { - content: "\e012"; + content: "\e609"; } .icon-forward:before { - content: "\e013"; + content: "\e60a"; +} +.icon-heart:before { + content: "\e60b"; } .icon-info:before { - content: "\e014"; + content: "\e60c"; } .icon-star:before, .entry-content li:before { - content: "\e003"; + content: "\e60d"; } .icon-github:before { - content: "\e004"; + content: "\e60e"; +} +.icon-search:before { + content: "\e60f"; +} +.icon-arrow-down:before { + content: "\e610"; } \ No newline at end of file diff --git a/_src/assets/less/kremalicious3.less b/_src/assets/less/kremalicious3.less index 56d7e5fb..9e38b64e 100644 --- a/_src/assets/less/kremalicious3.less +++ b/_src/assets/less/kremalicious3.less @@ -34,7 +34,7 @@ @import 'icons.less'; // Forms & Buttons -//@import 'forms.less'; +@import 'forms.less'; @import 'buttons.less'; // Media: images, video etc. diff --git a/_src/assets/less/mixins.less b/_src/assets/less/mixins.less index 764fd1eb..188c9a3f 100644 --- a/_src/assets/less/mixins.less +++ b/_src/assets/less/mixins.less @@ -9,7 +9,7 @@ background-image: data-uri('../img/logo.png'); background-repeat: no-repeat; background-position: center top; - height: 60px; + height: 31px; @media @highDPI { background-image: url('../img/logo@2x.png'); @@ -101,19 +101,19 @@ } // Single side border-radius -.border-top-radius(@radius) { +.border-top-radius(@radius: @border-radius-base) { border-top-right-radius: @radius; border-top-left-radius: @radius; } -.border-right-radius(@radius) { +.border-right-radius(@radius: @border-radius-base) { border-bottom-right-radius: @radius; border-top-right-radius: @radius; } -.border-bottom-radius(@radius) { +.border-bottom-radius(@radius: @border-radius-base) { border-bottom-right-radius: @radius; border-bottom-left-radius: @radius; } -.border-left-radius(@radius) { +.border-left-radius(@radius: @border-radius-base) { border-bottom-left-radius: @radius; border-top-left-radius: @radius; } diff --git a/_src/assets/less/navigation.less b/_src/assets/less/navigation.less index 208b99df..653e3a7a 100644 --- a/_src/assets/less/navigation.less +++ b/_src/assets/less/navigation.less @@ -2,24 +2,109 @@ // NAVIGATION ///////////////////////////////////// - -// Main Navigation -///////////////////////////////////// - -.nav-main { - margin-top: 0; - .textcenter; - - .row { - margin-top: 0; - margin-bottom: 0; - } - li { display: inline-block; } +// +// Topbar +// +.topbar { + .clearfix; + background: #f1f4f7; + padding: @line-height-computed/3 @line-height-computed; } +// +// Main Navigation +// + +.nav-main { + position: relative; + float: right; + width: 5%; + + li { display: inline-block; } + + .nav-popover { + right: 0; + top: 100%; + } +} + +.nav-link { + display: block; + padding: .5em 1em; + + &:hover { + background: rgba(255,255,255,.5); + } +} + +.nav-popover { + position: absolute; + z-index: 5; // so it's always above page content + .border-bottom-radius; + background: rgba(255,255,255,.85); + box-shadow: 0 2px 7px rgba(0,0,0,.05); +} + +.menu-btn, +.search-btn { + line-height: 1em; + text-align: center; + vertical-align: middle; + display: inline-block; + padding: .6em .7em .5em .7em; + margin: 0; +} + +// +// Site Search +// + +.site-search { + position: relative; + clear: both; + width: 80%; + float: left; + + @media @breakpoint2 { + clear: none; + margin-right: 1%; + width: 60%; + } + // loupe icon + .search-btn { + position: absolute; + left: 0; + z-index: 2; + } +} + +.search-field { + padding-left: 40px; + position: relative; + width: 90%; + border: none; + .box-shadow(none); + background: transparent; + + .placeholder(rgba(46, 79, 92, .1)); + + &:hover, + &:focus { + background: rgba(255,255,255,.7) !important; + .placeholder(rgba(46, 79, 92, .2)); + } +} + +.search-results { + left: 0; + width: 100%; +} + + +// // Pager -///////////////////////////////////// +// .pager { .clearfix; diff --git a/_src/assets/less/scaffolding.less b/_src/assets/less/scaffolding.less index 91164809..6d99a9c1 100644 --- a/_src/assets/less/scaffolding.less +++ b/_src/assets/less/scaffolding.less @@ -12,16 +12,14 @@ body { ///////////////////////////////////// .banner { - - .row { - margin-top: @line-height-computed; - margin-bottom: @line-height-computed; - } - + float: left; + width: 15%; + min-width: 160px; + .banner-title { - margin: 0 auto; width: 128px; - + margin-top: .1em; + margin-bottom: 0; // display toned down logo // by default .logo; @@ -33,10 +31,8 @@ body { // repeat logo // but display hover version .logo; - background-position: center bottom; + background-position: center -61px; width: 128px; - margin-left: auto; - margin-right: auto; // hide by default opacity: 0; @@ -44,7 +40,6 @@ body { &:hover { opacity: 1 } &:active { top: 0 } } - } diff --git a/_src/assets/less/typography.less b/_src/assets/less/typography.less index 2e9ef81f..182fe1a8 100644 --- a/_src/assets/less/typography.less +++ b/_src/assets/less/typography.less @@ -11,12 +11,8 @@ body { font-size: @font-size-base; line-height: @line-height-base; - padding-left: 2%; - padding-right: 2%; - @media @breakpoint1 { line-height: @line-height-computed; - padding: 0; } @media @breakpoint3 { diff --git a/_src/assets/less/utilities.less b/_src/assets/less/utilities.less index 9909d6da..7f762e76 100644 --- a/_src/assets/less/utilities.less +++ b/_src/assets/less/utilities.less @@ -4,7 +4,6 @@ // Clear stuff .clearfix { - *zoom: 1; clear: both; &:before, &:after { diff --git a/_src/search.json b/_src/search.json new file mode 100644 index 00000000..5af325b3 --- /dev/null +++ b/_src/search.json @@ -0,0 +1,12 @@ +--- +--- +[ + {% for post in site.posts %} + { + "title" : "{{ post.title | escape }}", + "category" : "{{ post.category }}", + "url" : "{{ post.url }}", + "date" : "{{ post.date }}" + } {% if forloop.last %}{% else %},{% endif %} + {% endfor %} +] \ No newline at end of file diff --git a/bower.json b/bower.json index e6654b12..29ea2c97 100644 --- a/bower.json +++ b/bower.json @@ -14,7 +14,8 @@ "picturefill": "~1.2.1", "masonry": "http://masonry.desandro.com/masonry.pkgd.min.js", "imagesloaded": "~3.0.4", - "infinitescroll": "https://raw.github.com/paulirish/infinite-scroll/master/jquery.infinitescroll.js" + "infinitescroll": "https://raw.github.com/paulirish/infinite-scroll/master/jquery.infinitescroll.js", + "simpleJekyllSearch": "https://raw.github.com/christian-fei/Simple-Jekyll-Search/master/simpleJekyllSearch.js" }, "ignore": [