diff --git a/src/_includes/hero.html b/src/_includes/hero.html index bcab310..a0eb30f 100755 --- a/src/_includes/hero.html +++ b/src/_includes/hero.html @@ -1,7 +1,7 @@ {% comment %} LIQUIDVISUAL-HERO - - updated: 15.08.16 + - updated: 08.07.17 - notes: * Multiple items in carousel_slides.yml triggers carousel mode * .has-auto-height - caption will detemine height diff --git a/src/_pages/about-us.md b/src/_pages/about-us.md index 6ef7178..cd3411d 100755 --- a/src/_pages/about-us.md +++ b/src/_pages/about-us.md @@ -1,10 +1,20 @@ --- layout: child_layout/about_us title: About Us -permalink: /about-us/ +permalink: "/about-us/" hero: video-3 - -body_col_1:

We are named after the small and nimble boat ‘Tom Thumb’ that explorers Bass and Flinders built to investigate the tributaries around the Australian coastline. Just like Bass and Flinders, we aspire to delve into our clients’ business to develop inspiring strategies and creative ideas that will bring their vision to life.

We work with company leaders and through our business and brand acumen, best marketing practices and creative knowledge we deliver targeted and effective strategies to solve their challenges.

- -body_col_2:

We are an independent consultancy collaborating with our supporting partners. We’re all great friends who are all leaders in their individual fields. Each of our clients work directly with at least one of our directors. This reflects our ethos that great work is born from passion, intelligence and personal commitment.

OUR GOAL is your success. This is our greatest passion. Our goal is to build trust and develop the working relationship with our clients that will inspire results. We know the more we learn and improve the greater our clients’ success will be.

---- \ No newline at end of file +body_col_1: "

We are named after the small and nimble boat ‘Tom Thumb’ that explorers + Bass and Flinders built to investigate the tributaries around the Australian coastline. + Just like Bass and Flinders, we aspire to delve into our clients’ business to develop + inspiring strategies and creative ideas that will bring their vision to life.

We + work with company leaders and through our business and brand acumen, best marketing + practices and creative knowledge we deliver targeted and effective strategies to + solve their challenges.

" +body_col_2: "

We are an independent consultancy collaborating with our supporting + partners. We’re all great friends who are all leaders in their individual fields. + Each of our clients work directly with at least one of our directors. This reflects + our ethos that great work is born from passion, intelligence and personal commitment.

Our + goal is your success. This is our greatest passion. Our goal is to build trust and + develop the working relationship with our clients that will inspire results. We + know the more we learn and improve the greater our clients’ success will be.

" +--- diff --git a/src/assets/webvisual/assets/_scss/bootstrap/bootstrap.scss b/src/assets/webvisual/assets/_scss/bootstrap/bootstrap.scss index ab1201f..88a60ca 100644 --- a/src/assets/webvisual/assets/_scss/bootstrap/bootstrap.scss +++ b/src/assets/webvisual/assets/_scss/bootstrap/bootstrap.scss @@ -1,14 +1,14 @@ /*! - * Bootstrap v4.0.0-alpha.3 (http://getbootstrap.com) - * Copyright 2011-2016 The Bootstrap Authors - * Copyright 2011-2016 Twitter, Inc. + * Bootstrap v4.0.0-alpha.6 (https://getbootstrap.com) + * Copyright 2011-2017 The Bootstrap Authors + * Copyright 2011-2017 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) */ // Core variables and mixins -@import "custom"; @import "variables"; @import "mixins"; +@import "custom"; // Reset and dependencies @import "normalize"; @@ -25,7 +25,7 @@ @import "buttons"; // Components -@import "animation"; +@import "transitions"; @import "dropdown"; @import "button-group"; @import "input-group"; @@ -35,7 +35,7 @@ @import "card"; @import "breadcrumb"; @import "pagination"; -@import "tags"; +@import "badge"; @import "jumbotron"; @import "alert"; @import "progress"; diff --git a/src/assets/webvisual/assets/_scss/liquidvisual/components/_alert-bar.scss b/src/assets/webvisual/assets/_scss/liquidvisual/components/_alert-bar.scss index f895da2..7bcedc7 100755 --- a/src/assets/webvisual/assets/_scss/liquidvisual/components/_alert-bar.scss +++ b/src/assets/webvisual/assets/_scss/liquidvisual/components/_alert-bar.scss @@ -1,11 +1,10 @@ /* ALERT-BAR.CSS - - updated: 23.07.16 + - updated: 24.02.17 - liquidvisual.com - Notes: - - Requires Modernizr - Since this is primarily an IE notifier, pxs and hacks are used */ //----------------------------------------------------------------- @@ -45,6 +44,7 @@ $alert-font-size: 14px !default; left: 0; margin: 0; width: 100%; + background: $alert-color; // IE8 fallback background: rgba($alert-color, 0.95); font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; color: white; @@ -85,6 +85,20 @@ $alert-font-size: 14px !default; } } +//----------------------------------------------------------------- +// BLACKOUT +//----------------------------------------------------------------- + +.lv-blackout { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: white; + z-index: -1; +} + //----------------------------------------------------------------- // //----------------------------------------------------------------- \ No newline at end of file diff --git a/src/assets/webvisual/assets/_scss/liquidvisual/components/_block-grid.scss b/src/assets/webvisual/assets/_scss/liquidvisual/components/_block-grid.scss index 5d5e629..5af5e43 100755 --- a/src/assets/webvisual/assets/_scss/liquidvisual/components/_block-grid.scss +++ b/src/assets/webvisual/assets/_scss/liquidvisual/components/_block-grid.scss @@ -1,22 +1,24 @@ /* -BLOCK-GRID.CSS + BLOCK-GRID.CSS -- updated: 28.06.16 -- liquidvisual.com + - Last updated: 06.10.16 + - liquidvisual.com */ //----------------------------------------------------------------- -// Variables +// VARIABLES //----------------------------------------------------------------- + +$grid-gutter-width: 30px !default; + //----------------------------------------------------------------- // BLOCK GRID -//----------------------------------------------------------------- - +// // https://gist.github.com/Jursdotme/67abe379d4a357233d3c -// Block Grid -// Technique adapted from Foundation 5 for Bootstrap 3. +// Block Grid technique adapted from Foundation 5 for Bootstrap 3. // https://github.com/zurb/foundation/blob/f755d8704123f86c281ede0b171881e2672f150d/scss/foundation/components/_block-grid.scss // Original LESS Version by Christopher Mitchell (https://gist.github.com/ChrisTM) // Converted to SCSS by Rasmus Jürs (https://github.com/Jursdotme) +//----------------------------------------------------------------- [class*="block-grid-"] { @include clearfix(); @@ -99,7 +101,4 @@ BLOCK-GRID.CSS //========================================= // -//========================================= - - - +//========================================= \ No newline at end of file diff --git a/src/assets/webvisual/assets/_scss/liquidvisual/components/_em-calc.scss b/src/assets/webvisual/assets/_scss/liquidvisual/components/_em-calc.scss new file mode 100755 index 0000000..3d7ebc9 --- /dev/null +++ b/src/assets/webvisual/assets/_scss/liquidvisual/components/_em-calc.scss @@ -0,0 +1,59 @@ +/* + EM-CALC.CSS + + - updated: 07.11.16 + - liquidvisual.com +*/ +//----------------------------------------------------------------- +// VARIABLES +//----------------------------------------------------------------- + +// This is the default html and body font-size for the base em value. +$em-base: 16px !default; + +//----------------------------------------------------------------- +// STRIP UNIT +// It strips the unit of measure and returns it +//----------------------------------------------------------------- + +@function strip-unit($num) { + @return $num / ($num * 0 + 1); +} + +//----------------------------------------------------------------- +// CONVERT TO EM +//----------------------------------------------------------------- + +@function convert-to-em($value, $base-value: $em-base) { + $value: strip-unit($value) / strip-unit($base-value) * 1em; + @if ($value == 0em) { $value: 0; } // Turn 0em into 0 + @return $value; +} + +@function data($attr) { + @if $namespace { + @return '[data-' + $namespace + '-' + $attr + ']'; + } + + @return '[data-' + $attr + ']'; +} + +//----------------------------------------------------------------- +// EM CALC +//----------------------------------------------------------------- + +@function em-calc($values, $base-value: $em-base) { + $max: length($values); + + @if $max == 1 { @return convert-to-em(nth($values, 1), $base-value); } + + $emValues: (); + @for $i from 1 through $max { + $emValues: append($emValues, convert-to-em(nth($values, $i), $base-value)); + } + @return $emValues; +} + +//----------------------------------------------------------------- +// +//----------------------------------------------------------------- \ No newline at end of file diff --git a/src/assets/webvisual/assets/_scss/liquidvisual/components/_hero.scss b/src/assets/webvisual/assets/_scss/liquidvisual/components/_hero.scss index ad5c2f3..7ab3003 100755 --- a/src/assets/webvisual/assets/_scss/liquidvisual/components/_hero.scss +++ b/src/assets/webvisual/assets/_scss/liquidvisual/components/_hero.scss @@ -10,11 +10,11 @@ // Variables //----------------------------------------------------------------- -$hero-height-small: auto; //rem-calc(266); // default: auto // IMPORTANT: if carousel slides, you need a fixed height -$hero-height-medium: rem-calc(575); -$hero-height-medium-fixed: rem-calc(575); -$hero-height-large: rem-calc(690); //rem-calc(570); -$hero-carousel-bullet-size: rem-calc(16); +$hero-height-sm: auto; // IMPORTANT: if carousel slides, you need a fixed height +$hero-height-md: rem-calc(575); +$hero-height-md-fixed: rem-calc(575); +$hero-height-lg: rem-calc(690); +$hero-carousel-bullet-size: rem-calc(16); //----------------------------------------------------------------- // Hero Wrapper @@ -35,14 +35,14 @@ $hero-carousel-bullet-size: rem-calc(16); .lv-hero { width: 100%; // added last minute - breaking? overflow: hidden; // causes problems without JS - height: $hero-height-small; + height: $hero-height-sm; @include media-breakpoint-up(md) { - height: $hero-height-medium; + height: $hero-height-md; } @include media-breakpoint-up(lg) { - height: $hero-height-large; + height: $hero-height-lg; } //========================================= @@ -62,7 +62,7 @@ $hero-carousel-bullet-size: rem-calc(16); //========================================= &.has-fixed-height { - height: rem-calc(150); //$hero-height-small; + height: rem-calc(150); //$hero-height-sm; background-position: center center; @include media-breakpoint-up(md) { // added - refactor @@ -70,7 +70,7 @@ $hero-carousel-bullet-size: rem-calc(16); } @include media-breakpoint-up(xl) { - height: $hero-height-medium-fixed; + height: $hero-height-md-fixed; } } } @@ -150,6 +150,11 @@ $hero-carousel-bullet-size: rem-calc(16); text-align: center; font-family: "FontAwesome"; font-size: rem-calc(50); + display: none; + + @include media-breakpoint-up(md) { + display: block; + } a { position: absolute; @@ -162,19 +167,11 @@ $hero-carousel-bullet-size: rem-calc(16); } .lv-hero-carousel-prev-btn { - left: rem-calc(20); - - @include media-breakpoint-up(md) { - left: 0; - } + left: $container-gutter/2; } .lv-hero-carousel-next-btn { - right: rem-calc(20); - - @include media-breakpoint-up(md) { - right: 0; - } + right: $container-gutter/2; } } diff --git a/src/assets/webvisual/assets/_scss/liquidvisual/components/_rem-calc.scss b/src/assets/webvisual/assets/_scss/liquidvisual/components/_rem-calc.scss index aca9cd7..5a1edb2 100755 --- a/src/assets/webvisual/assets/_scss/liquidvisual/components/_rem-calc.scss +++ b/src/assets/webvisual/assets/_scss/liquidvisual/components/_rem-calc.scss @@ -1,32 +1,28 @@ /* REM-CALC.CSS - - updated: 12.10.15 + - updated: 06.10.16 - liquidvisual.com */ //----------------------------------------------------------------- -// Variables +// VARIABLES //----------------------------------------------------------------- // This is the default html and body font-size for the base rem value. $rem-base: 16px !default; //----------------------------------------------------------------- -// REM CALC -//----------------------------------------------------------------- - -//========================================= // STRIP UNIT // It strips the unit of measure and returns it -//========================================= +//----------------------------------------------------------------- @function strip-unit($num) { @return $num / ($num * 0 + 1); } -//========================================= +//----------------------------------------------------------------- // CONVERT TO REM -//========================================= +//----------------------------------------------------------------- @function convert-to-rem($value, $base-value: $rem-base) { $value: strip-unit($value) / strip-unit($base-value) * 1rem; @@ -42,9 +38,9 @@ $rem-base: 16px !default; @return '[data-' + $attr + ']'; } -//========================================= +//----------------------------------------------------------------- // REM CALC -//========================================= +//----------------------------------------------------------------- @function rem-calc($values, $base-value: $rem-base) { $max: length($values); diff --git a/src/assets/webvisual/assets/_scss/liquidvisual/components/_toolbox.scss b/src/assets/webvisual/assets/_scss/liquidvisual/components/_toolbox.scss index c005b1b..16ef58e 100755 --- a/src/assets/webvisual/assets/_scss/liquidvisual/components/_toolbox.scss +++ b/src/assets/webvisual/assets/_scss/liquidvisual/components/_toolbox.scss @@ -40,22 +40,9 @@ $include-developer-styles: true !default; text-shadow: none; } -//----------------------------------------------------------------- -// Example Text -//----------------------------------------------------------------- - -.lv-example { - padding: 1.250em; - border: 1px dashed #CFCCCF; - margin-bottom: 1.875em; - background: white; - box-shadow: 0 3px 5px -4px rgba(0, 0, 0, 0.26); -} - //----------------------------------------------------------------- // Helper Classes //----------------------------------------------------------------- - //========================================= // Display //========================================= @@ -104,12 +91,12 @@ $include-developer-styles: true !default; .lv-dropcap:first-letter { float: left; - color: $primary-color; - font-size: 100px; - line-height: 90px; padding-top: 4px; padding-right: 10px; padding-left: 3px; + line-height: 90px; + font-size: 100px; + color: $primary-color; } //========================================= diff --git a/src/assets/webvisual/assets/scripts/liquidvisual/equal-height.js b/src/assets/webvisual/assets/scripts/liquidvisual/equal-height.js index 04aa918..bca572d 100755 --- a/src/assets/webvisual/assets/scripts/liquidvisual/equal-height.js +++ b/src/assets/webvisual/assets/scripts/liquidvisual/equal-height.js @@ -1,5 +1,13 @@ /* - EQUAL-HEIGHT.JS - Last updated: 27.10.15 + EQUAL-HEIGHT.JS - Last updated: 23.11.16 + + USAGE: place data-equal-height on each element + + Thanks to CSS Tricks for pointing out this bit of jQuery + http://css-tricks.com/equal-height-blocks-in-rows/ + It's been modified into a function called at page load and then each time the page is resized. One large modification was to remove the set height before each new calculation. + + http://codepen.io/micahgodbolt/pen/FgqLc */ //----------------------------------------------------------------- // EQUAL HEIGHT @@ -12,13 +20,7 @@ // Variables //================================================== - var equalHeightElement = $('[data-match-height]'); - - /* Thanks to CSS Tricks for pointing out this bit of jQuery - http://css-tricks.com/equal-height-blocks-in-rows/ - It's been modified into a function called at page load and then each time the page is resized. One large modification was to remove the set height before each new calculation. */ - - // http://codepen.io/micahgodbolt/pen/FgqLc + var equalHeightElement = $('[data-equal-height]'); //================================================== // Launch @@ -26,46 +28,46 @@ var equalHeight = function(target){ - if ($(window).width() >= 768) { - - var currentTallest = 0; - var currentRowStart = 0; - var rowDivs = []; - var $el; - var topPosition = 0; - - $(target).each(function() { - $el = $(this); - $($el).height('auto'); - topPosition = $el.position().top; - - if (currentRowStart != topPosition) { - for (var currentDiv = 0; currentDiv < rowDivs.length; currentDiv++) { - rowDivs[currentDiv].height(currentTallest); - } - rowDivs.length = 0; // empty the array - currentRowStart = topPosition; - currentTallest = $el.height(); - rowDivs.push($el); - } else { - rowDivs.push($el); - currentTallest = (currentTallest < $el.height()) ? ($el.height()) : (currentTallest); - } - for (currentDiv = 0 ; currentDiv < rowDivs.length ; currentDiv++) { - rowDivs[currentDiv].height(currentTallest); - } - }); - } else { - equalHeightElement.height('auto'); - } + if ($(window).width() >= 768) { + + var currentTallest = 0; + var currentRowStart = 0; + var rowDivs = []; + var $el; + var topPosition = 0; + + $(target).each(function() { + $el = $(this); + $($el).height('auto'); + topPosition = $el.position().top; + + if (currentRowStart != topPosition) { + for (var currentDiv = 0; currentDiv < rowDivs.length; currentDiv++) { + rowDivs[currentDiv].height(currentTallest); + } + rowDivs.length = 0; // empty the array + currentRowStart = topPosition; + currentTallest = $el.height(); + rowDivs.push($el); + } else { + rowDivs.push($el); + currentTallest = (currentTallest < $el.height()) ? ($el.height()) : (currentTallest); + } + for (currentDiv = 0 ; currentDiv < rowDivs.length ; currentDiv++) { + rowDivs[currentDiv].height(currentTallest); + } + }); + } else { + equalHeightElement.height('auto'); + } }; $(window).on('load', function() { - equalHeight(equalHeightElement); + equalHeight(equalHeightElement); }); $(window).resize(function(){ - equalHeight(equalHeightElement); + equalHeight(equalHeightElement); }); }(jQuery)); diff --git a/src/assets/webvisual/assets/scripts/liquidvisual/hero.js b/src/assets/webvisual/assets/scripts/liquidvisual/hero.js index ce04e1f..57f5901 100755 --- a/src/assets/webvisual/assets/scripts/liquidvisual/hero.js +++ b/src/assets/webvisual/assets/scripts/liquidvisual/hero.js @@ -19,7 +19,7 @@ var isTablet = $(window).width() < 1025; // no more touch $('.lv-hero').bxSlider({ - auto: true, //(isTablet ? false : true), + auto: false, //(isTablet ? false : true), mode: 'horizontal', // fade (much have fixed height or won't work) adaptiveHeight: true, responsive: true, diff --git a/src/assets/webvisual/assets/scripts/liquidvisual/responsive-utility.js b/src/assets/webvisual/assets/scripts/liquidvisual/responsive-utility.js index 2a345ad..5de01f7 100755 --- a/src/assets/webvisual/assets/scripts/liquidvisual/responsive-utility.js +++ b/src/assets/webvisual/assets/scripts/liquidvisual/responsive-utility.js @@ -1,5 +1,5 @@ /* - RESPONSIVE-UTILITY.JS - Last updated: 17.01.16 + RESPONSIVE-UTILITY.JS - Last updated: 24.02.17 - Notes: Needs refactor */ @@ -66,7 +66,7 @@ var $body = $('body'); if ($('.lv-screen-data').length != 1) { - $body.append('
'); + $body.append('
'); } var screenWidth = $(window).width(); var screenHeight = $(window).height(); @@ -83,6 +83,8 @@ 'position': 'fixed', 'top': 0, 'padding': '10px 20px', + //'margin': '4px', + // 'border-radius': '3px', 'background': 'rgba(0,0,0,0.5)', 'font-family': 'Helvetica Neue', 'font-size': '14px', @@ -98,7 +100,7 @@ // Display if body has 'dev-mode' attribute //----------------------------------------------------------------- - if ($('body[dev-mode-enabled="true"]').length) { + if ($('html[data-dev-mode]').length) { // Launch it responsiveHelper(); diff --git a/src/assets/webvisual/assets/scripts/liquidvisual/scrolling.js b/src/assets/webvisual/assets/scripts/liquidvisual/scrolling.js index c3d3ea4..6d6250b 100755 --- a/src/assets/webvisual/assets/scripts/liquidvisual/scrolling.js +++ b/src/assets/webvisual/assets/scripts/liquidvisual/scrolling.js @@ -1,44 +1,9 @@ /* - SCROLLING.JS - Last updated: 16.06.15 + SCROLLING.JS - Last updated: 30.09.16 */ //----------------------------------------------------------------- // Variables //----------------------------------------------------------------- -//----------------------------------------------------------------- -// http://stackoverflow.com/questions/24765185/hide-fixed-header-on-scroll-down-show-on-scroll-up-and-hover -// http://jsfiddle.net/uAc3p/5/ -//----------------------------------------------------------------- - -$(function(){ - var lastScrollTop = 0; - var delta = 5; - - $(window).scroll(function(event){ - var header = $('.global-header'); - var st = $(this).scrollTop(); - var headerHeight = header.position().top + header.outerHeight(true); - - if (Math.abs(lastScrollTop - st) <= delta) return; - - if (st > lastScrollTop ) { - $('body').removeClass('scrolling-up'); - - } else { - // upscroll code - $('body').addClass('scrolling-up'); - } - lastScrollTop = st; - }); -}); - -//----------------------------------------------------------------- -// -//----------------------------------------------------------------- - -// var topMenu = $(".topbar"); -// var topMenuHeight = topMenu.outerHeight(); -// var menuItems = $('.topbar, .off-canvas-menu').find('a'); - //----------------------------------------------------------------- // Click Logo: Jump to Top //----------------------------------------------------------------- diff --git a/src/assets/webvisual/views/overview/welcome.html b/src/assets/webvisual/views/overview/welcome.html index 94ceb5d..c62b951 100755 --- a/src/assets/webvisual/views/overview/welcome.html +++ b/src/assets/webvisual/views/overview/welcome.html @@ -90,7 +90,7 @@

Integrate easily into your CMS



-