diff --git a/ckanext/ozwillo_theme/fanstatic/off-canvas.js b/ckanext/ozwillo_theme/fanstatic/off-canvas.js index de9dc50..8679f4e 100644 --- a/ckanext/ozwillo_theme/fanstatic/off-canvas.js +++ b/ckanext/ozwillo_theme/fanstatic/off-canvas.js @@ -1,162 +1,18 @@ -/** - *------------------------------------------------------------------------------ - * @package T3 Framework for Joomla! - *------------------------------------------------------------------------------ - * @copyright Copyright (C) 2004-2013 JoomlArt.com. All Rights Reserved. - * @license GNU General Public License version 2 or later; see LICENSE.txt - * @authors JoomlArt, JoomlaBamboo, (contribute to this project at github - * & Google group to become co-author) - * @Google group: https://groups.google.com/forum/#!forum/t3fw - * @Link: http://t3-framework.org - *------------------------------------------------------------------------------ - */ +document.addEventListener('DOMContentLoaded', function() { + document.getElementById('toggle-toc').addEventListener('click', function() { + var el = document.body, className = 'toc-open'; + if (el.classList) { + el.classList.toggle(className); + } else { + var classes = el.className.split(' '); + var existingIndex = classes.indexOf(className); -jQuery (document).ready(function($){ - // fix for old ie - if (/MSIE\s([\d.]+)/.test(navigator.userAgent) ? new Number(RegExp.$1) < 10 : false) { - $('html').addClass ('old-ie'); - } else if(/constructor/i.test(window.HTMLElement)){ - $('html').addClass('safari'); + if (existingIndex >= 0) + classes.splice(existingIndex, 1); + else + classes.push(className); + + el.className = classes.join(' '); } - - var $wrapper = $('body'), - $inner = $('.t3-wrapper'), - $toggles = $('.off-canvas-toggle'), - $offcanvas = $('.t3-off-canvas'), - $close = $('.t3-off-canvas .close'), - $btn=null, - $nav=null, - direction = 'left', - $fixed = null; - // no wrapper, just exit - if (!$wrapper.length) return ; - - // add effect class for nav - $toggles.each (function () { - var $this = $(this), - $nav = $($this.data('nav')), - effect = $this.data('effect'), - direction = ($('html').attr('dir') == 'rtl' && $this.data('pos')!='right') || ($('html').attr('dir') != 'rtl' && $this.data('pos')=='right') ? 'right':'left'; - $nav.addClass (effect).addClass ('off-canvas-'+direction); - - // move to outside wrapper-content - var inside_effect = ['off-canvas-effect-3','off-canvas-effect-16','off-canvas-effect-7','off-canvas-effect-8','off-canvas-effect-14']; - if ($.inArray(effect, inside_effect) == -1) { - $inner.before($nav); - } else { - $inner.prepend($nav); - } - }); - - $toggles.on('click', function(e){ - - stopBubble (e); - - if ($wrapper.hasClass ('off-canvas-open')) { - oc_hide (e); - return false; - } - - $btn = $(this); - $nav = $($btn.data('nav')); - $fixed = $inner.find('*').filter (function() {return $(this).css("position") === 'fixed';}); - - $nav.addClass ('off-canvas-current'); - - direction = ($('html').attr('dir') == 'rtl' && $btn.data('pos')!='right') || ($('html').attr('dir') != 'rtl' && $btn.data('pos')=='right') ? 'right':'left'; - - // add direction class to body - // $('html').removeClass ('off-canvas-left off-canvas-right').addClass ('off-canvas-' + direction); - - $offcanvas.height($(window).height()); - - // disable scroll event - var events = $(window).data('events'); - if (events && events.scroll && events.scroll.length) { - // store current handler for scroll - var handlers = []; - for (var i=0; i .navbar-header { + margin: 0 !important; + } +} + +#toggle-container { + display: none; + position: fixed; + top: 0; + left: 0; + z-index: 1000; + width: 100%; + height: 50px; + background: #fff; + border-bottom: 1px solid #ddd; + transition: left 0.2s ease-out; +} + +#off-nav { + display: none; + margin-bottom: 0; + position: fixed; + left: 0; + top: 0; + z-index: 1000; + bottom: 0; + margin-left: -230px; + width: 230px; + box-sizing: border-box; + overflow-y: auto; + -webkit-overflow-scrolling: touch; + border-right: 1px solid #aaa; + background: #fff; + transition: left 0.2s ease-out; +} + +#off-nav i { + margin: 0 15px 0 8px; +} + +#off-nav a.logo { + padding-bottom: 12px; +} + +#off-nav ul ul.nav a { + padding: 4px 4px 4px 56px; +} + +#off-nav li.divider { + margin: 12px 0; + border-bottom: 2px solid #eee; +} + +#off-nav li.divider.first { + margin-top: 0; +} + +body.toc-open #toggle-container, body.toc-open #off-nav { + left: 230px; +} +@media (max-width: 768px) { + #t3-mainnav { + display: none; + } + #toggle-container, #off-nav { + display: block; + } +} + /* fix CKAN responsive issues */ .homepage.layout-1 .row1 .col2, .homepage.layout-1 .row2 .col2 { diff --git a/ckanext/ozwillo_theme/fanstatic/responsive.css b/ckanext/ozwillo_theme/fanstatic/responsive.css index 7bc0728..2ee4a43 100644 --- a/ckanext/ozwillo_theme/fanstatic/responsive.css +++ b/ckanext/ozwillo_theme/fanstatic/responsive.css @@ -527,9 +527,6 @@ } @media (max-width: 480px) { - .nav-collapse { - -webkit-transform: translate3d(0, 0, 0); - } .page-header h1 small { display: block; line-height: 20px; @@ -605,51 +602,6 @@ padding-left: 10px; margin: 0 0 0 -5px; } - .nav-collapse { - clear: both; - } - .nav-collapse .nav { - float: none; - margin: 0 0 10px; - } - .nav-collapse .nav > li { - float: none; - } - .nav-collapse .nav > li > a { - margin-bottom: 2px; - } - .nav-collapse .nav > .divider-vertical { - display: none; - } - .nav-collapse .nav .nav-header { - color: #777777; - text-shadow: none; - } - .nav-collapse .nav > li > a, - .nav-collapse .dropdown-menu a { - padding: 9px 15px; - font-weight: bold; - color: #777777; - -webkit-border-radius: 3px; - -moz-border-radius: 3px; - border-radius: 3px; - } - .nav-collapse .btn { - padding: 4px 10px 4px; - font-weight: normal; - -webkit-border-radius: 4px; - -moz-border-radius: 4px; - border-radius: 4px; - } - .nav-collapse .dropdown-menu li + li a { - margin-bottom: 2px; - } - .nav-collapse .nav > li > a:hover, - .nav-collapse .nav > li > a:focus, - .nav-collapse .dropdown-menu a:hover, - .nav-collapse .dropdown-menu a:focus { - background-color: #f2f2f2; - } .navbar-inverse .nav-collapse .nav > li > a, .navbar-inverse .nav-collapse .dropdown-menu a { color: #999999; diff --git a/ckanext/ozwillo_theme/fanstatic/templates.t3_bs3_blank.less.bootstrap.less.css b/ckanext/ozwillo_theme/fanstatic/templates.t3_bs3_blank.less.bootstrap.less.css index f062b8c..44926ee 100644 --- a/ckanext/ozwillo_theme/fanstatic/templates.t3_bs3_blank.less.bootstrap.less.css +++ b/ckanext/ozwillo_theme/fanstatic/templates.t3_bs3_blank.less.bootstrap.less.css @@ -2763,26 +2763,6 @@ input[type="button"].btn-block { .fade.in { opacity: 1; } -.collapse { - display: none; -} -.collapse.in { - display: block; -} -tr.collapse.in { - display: table-row; -} -tbody.collapse.in { - display: table-row-group; -} -.collapsing { - position: relative; - height: 0; - overflow: hidden; - -webkit-transition: height 0.35s ease; - -o-transition: height 0.35s ease; - transition: height 0.35s ease; -} @font-face { font-family: 'Glyphicons Halflings'; src: url('../../../plugins/system/t3/base-bs3/bootstrap/fonts/glyphicons-halflings-regular.eot'); diff --git a/ckanext/ozwillo_theme/fanstatic/templates.t3_bs3_blank.less.navbar.less.css b/ckanext/ozwillo_theme/fanstatic/templates.t3_bs3_blank.less.navbar.less.css index c0c5ca3..2aca2a7 100644 --- a/ckanext/ozwillo_theme/fanstatic/templates.t3_bs3_blank.less.navbar.less.css +++ b/ckanext/ozwillo_theme/fanstatic/templates.t3_bs3_blank.less.navbar.less.css @@ -132,11 +132,7 @@ padding-left: 0; padding-right: 0; } -@media (min-width: 768px) { - .t3-mainnav .t3-navbar-collapse { - display: none !important; - } -} + .t3-mainnav .t3-navbar-collapse .navbar-nav { margin: 0 -15px; } diff --git a/ckanext/ozwillo_theme/fanstatic/templates.t3_bs3_blank.less.off-canvas.less.css b/ckanext/ozwillo_theme/fanstatic/templates.t3_bs3_blank.less.off-canvas.less.css index 7ddfbba..e69de29 100644 --- a/ckanext/ozwillo_theme/fanstatic/templates.t3_bs3_blank.less.off-canvas.less.css +++ b/ckanext/ozwillo_theme/fanstatic/templates.t3_bs3_blank.less.off-canvas.less.css @@ -1,65 +0,0 @@ -.off-canvas-toggle { - border-radius: 0; - border: 0; - padding: 0; - width: 50px; - height: 50px; - line-height: 50px; -} -.off-canvas-toggle:focus { - outline: none; -} -.t3-off-canvas { - background: #ffffff; - color: #636884; - z-index: 100; -} -.t3-off-canvas .t3-off-canvas-header { - background: #eeeeee; - color: #636884; - padding: 0 0 0 12px; - height: 35px; -} -.t3-off-canvas .t3-off-canvas-header h2 { - margin: 0; - line-height: 35px; - font-size: 16px; - font-weight: bold; - text-transform: uppercase; -} -.t3-off-canvas .close { - margin: 0; - height: 35px; - line-height: 35px; - width: 35px; - background: #bbbbbb; - position: absolute; - top: 0; - right: 0; -} -.t3-off-canvas .t3-off-canvas-body { - padding: 24px 12px; -} -.t3-off-canvas .t3-off-canvas-body a { - color: #6e418e; - text-decoration: none; -} -.t3-off-canvas .t3-off-canvas-body a:hover, -.t3-off-canvas .t3-off-canvas-body a:focus { - color: #45295a; - text-decoration: none; -} -.t3-off-canvas .t3-off-canvas-body a:focus { - outline: thin dotted; - outline: 5px auto -webkit-focus-ring-color; - outline-offset: -2px; -} -.t3-off-canvas .t3-off-canvas-body .dropdown-menu .active a { - background: transparent; -} -.t3-off-canvas .t3-off-canvas-body .t3-module { - margin-bottom: 22px; -} -.t3-off-canvas .t3-off-canvas-body .module-title { - margin-bottom: 11px; -} \ No newline at end of file diff --git a/ckanext/ozwillo_theme/templates/header.html b/ckanext/ozwillo_theme/templates/header.html index f129b11..63f766c 100644 --- a/ckanext/ozwillo_theme/templates/header.html +++ b/ckanext/ozwillo_theme/templates/header.html @@ -1,13 +1,50 @@ {% set current_lang = request.environ.CKAN_LANG %} {% set current_page = request.environ.CKAN_CURRENT_URL %} +
+ +
+