diff --git a/Gruntfile.js b/Gruntfile.js
index 0276337..c5468e4 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -36,7 +36,9 @@ module.exports = function (grunt) {
files: [
'Gruntfile.js',
'<%= app.src %>/*.html',
+ '<%= app.src %>/**/{,*/}*.js',
'<%= app.src %>/**/{,*/}*.less',
+ '<%= app.lib %>/**/{,*/}*.js',
'<%= app.lib %>/**/{,*/}*.less'
],
tasks: ['build']
@@ -69,6 +71,8 @@ module.exports = function (grunt) {
plugins: {
src: [
'<%= app.lib %>/jquery/jquery.js',
+ '<%= app.lib %>/jquery.animate-enhanced/jquery.animate-enhanced.min.js',
+ '<%= app.lib %>/jquery.superslides/dist/jquery.superslides.js',
'<%= app.lib %>/bootstrap/js/transition.js',
// '<%= app.lib %>/bootstrap/js/alert.js',
'<%= app.lib %>/bootstrap/js/button.js',
@@ -103,6 +107,7 @@ module.exports = function (grunt) {
'<%= app.src %>/less',
'<%= app.lib %>/flexslider-less',
'<%= app.lib %>/font-awesome/less',
+ '<%= app.lib %>/jquery.superslides/dist/stylesheets',
'<%= app.lib %>/bootstrap/less'
]
},
diff --git a/bower.json b/bower.json
index f5c48b8..1754edd 100644
--- a/bower.json
+++ b/bower.json
@@ -21,10 +21,12 @@
],
"devDependencies": {
"bootstrap": "~3.0.2",
+ "superslides": "git@github.com:nicinabox/superslides.git",
"modernizr": "~2.6.2",
"font-awesome": "~3.0.2",
"jquery": "~1.9.1",
"raphael": "~2.1.0",
- "scaleraphael": "*"
+ "scaleraphael": "*",
+ "jquery.animate-enhanced": "*"
}
}
diff --git a/src/index.html b/src/index.html
index eabf3c1..9e9992e 100644
--- a/src/index.html
+++ b/src/index.html
@@ -8,7 +8,7 @@
Platsbyggd bokhylla
-
+
@@ -30,6 +30,116 @@ Platsbyggd bokhylla av Jerker Inredning & Form
+
+
diff --git a/src/js/main.js b/src/js/main.js
index e69de29..f19776e 100644
--- a/src/js/main.js
+++ b/src/js/main.js
@@ -0,0 +1,8 @@
+$(function(){
+ $('#slides').superslides({
+ play: '5200',
+ animation: 'fade',
+ inherit_width_from: '#slides .slides-container',
+ inherit_height_from: '#slides .slides-container'
+ });
+});
diff --git a/src/less/main.less b/src/less/main.less
index 22a97ad..41a32a3 100644
--- a/src/less/main.less
+++ b/src/less/main.less
@@ -1,35 +1,39 @@
-// Frameworks
+// Imports
// -------------------------
+// Bootstrap
+//
+
@import "bootstrap";
// Variables
-// -------------------------
+//
@import "variables";
// Fonts
-// -------------------------
+//
@import "fonts";
// Components
-// -------------------------
+//
-@import (less) "flexslider.css";
+@import (less) "superslides.css";
// Partials
-// -------------------------
+//
@import "mixins";
@import "utils";
@import "planner";
+
// Main styles
// -------------------------
@@ -71,7 +75,7 @@ section.alternate {
body > header h1 {
font-family: @font-family-base;
- font-size: @font-size-h3;
+ font-size: @font-size-h1;
}
// Header nav
@@ -81,6 +85,46 @@ body > header nav {
margin-top: @line-height-computed;
}
+// Gallery slideshow
+//
+
+#slides {
+ border: 3px solid @gray-dark;
+ border-radius: @border-radius-large;
+
+ li,
+ img {
+ border-radius: @border-radius-base;
+ }
+
+ .slides-container {
+ height: 550px;
+ }
+
+ figcaption {
+ background-color: @near-black;
+ background-color: fade(@near-black, 80);
+ color: @near-white;
+ border-top-right-radius: @border-radius-base;
+
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ padding: @padding-base-vertical @padding-base-horizontal;
+
+ .model,
+ small {
+ display: block;
+ }
+ }
+
+ .btn {
+ position: absolute;
+ bottom: @padding-base-vertical;
+ right: @padding-base-horizontal;
+ }
+}
+
// Responsive tagline
//