From 6bde70d60a02e9e461bc8cb6dcb475778c435fec Mon Sep 17 00:00:00 2001 From: Mario Vavti Date: Fri, 16 Dec 2016 16:14:01 +0100 Subject: move the sticky-kit^Cquery plugin to /lib and see if we want this for the whole app --- view/theme/redbasic/js/redbasic.js | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/js/redbasic.js b/view/theme/redbasic/js/redbasic.js index c5f74db3f..c3c2c7e3f 100644 --- a/view/theme/redbasic/js/redbasic.js +++ b/view/theme/redbasic/js/redbasic.js @@ -16,6 +16,23 @@ $(document).ready(function() { } $('#css3-calc').remove(); // Remove the test element + if($(window).outerWidth() > 767) { + $('#left_aside_wrapper').stick_in_parent({ + offset_top: $('nav').outerHeight(true) + }); + } + + $(window).resize(function() { + if($(window).outerWidth() > 767) { + $('#left_aside_wrapper').stick_in_parent({ + offset_top: $('nav').outerHeight(true) + }); + } + else { + $('#left_aside_wrapper').trigger("sticky_kit:detach"); + } + }); + $('#expand-aside').click(function() { $('#expand-aside-icon').toggleClass('fa-arrow-circle-right').toggleClass('fa-arrow-circle-left'); $('main').toggleClass('region_1-on'); -- cgit v1.2.3 From dc34bf18bb75b8be3bf94c2189701b3e847932ac Mon Sep 17 00:00:00 2001 From: Mario Vavti Date: Fri, 16 Dec 2016 16:24:17 +0100 Subject: retrigger after fullscreen --- view/theme/redbasic/js/redbasic.js | 1 + 1 file changed, 1 insertion(+) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/js/redbasic.js b/view/theme/redbasic/js/redbasic.js index c3c2c7e3f..8fb1117ce 100644 --- a/view/theme/redbasic/js/redbasic.js +++ b/view/theme/redbasic/js/redbasic.js @@ -89,5 +89,6 @@ function makeFullScreen(full) { $('#tabs-collapse-1').css({'visibility': ''}); $('#inline-btn').hide(); $('main').css({'transition': ''}); + $(document.body).trigger("sticky_kit:recalc"); } } -- cgit v1.2.3 From 6eed7eb54054502d438ea18a9411d3be7cdf14fc Mon Sep 17 00:00:00 2001 From: Mario Vavti Date: Fri, 16 Dec 2016 22:50:19 +0100 Subject: display inline instead of floating --- view/theme/redbasic/css/style.css | 16 ++++++---------- 1 file changed, 6 insertions(+), 10 deletions(-) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css index 3ae52d5cc..f5998c5f6 100644 --- a/view/theme/redbasic/css/style.css +++ b/view/theme/redbasic/css/style.css @@ -473,7 +473,6 @@ footer { #contact-block { width: 100%; - float: left; } #contact-block-numcontacts { @@ -482,12 +481,10 @@ footer { } .contact-block-div { - float: left; - width: 50px; - height: 50px; + display: inline; } + .contact-block-textdiv { - float: left; width: 150px; height: 34px; } @@ -495,12 +492,11 @@ footer { #contact-block-end { clear: both; } -.contact-block-link { - float: left; -} + .contact-block-img { - width:48px; - height:48px; + width:47px; + height:47px; + margin-bottom: 3px; } #tag-remove { -- cgit v1.2.3 From 827d4c5fb094715a65d4559f8c6159eb5d31d5f7 Mon Sep 17 00:00:00 2001 From: zotlabs Date: Fri, 16 Dec 2016 19:54:07 -0800 Subject: use lock colour to indicate that permissions have been set by the software to something you might not expect rather than an exclamation mark. This may not be the best colour in this page context, but it serves the intended purpose. Perhaps orange might be less intrusive and still convey the desired information. --- view/theme/redbasic/css/style.css | 5 +++++ 1 file changed, 5 insertions(+) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css index 3ae52d5cc..5f5df808f 100644 --- a/view/theme/redbasic/css/style.css +++ b/view/theme/redbasic/css/style.css @@ -1267,6 +1267,11 @@ img.mail-conv-sender-photo { color: $toolicon_colour; } +.jot-icons.jot-lock-warn { + color: red; +} + + /* conversation */ .nsfw-wrap { text-align: center; -- cgit v1.2.3 From e1819a874f334185e379db9390d493d12273704b Mon Sep 17 00:00:00 2001 From: zotlabs Date: Fri, 16 Dec 2016 22:47:25 -0800 Subject: use darkorange. --- view/theme/redbasic/css/style.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css index 9bc39dfb4..8a38c68f3 100644 --- a/view/theme/redbasic/css/style.css +++ b/view/theme/redbasic/css/style.css @@ -1264,7 +1264,7 @@ img.mail-conv-sender-photo { } .jot-icons.jot-lock-warn { - color: red; + color: darkorange; } -- cgit v1.2.3 From 3ad3d3037f8ba9643952bbf64e70c5edf302a73b Mon Sep 17 00:00:00 2001 From: Mario Vavti Date: Mon, 19 Dec 2016 12:46:36 +0100 Subject: make sticky aside available for small screens. we had to get rid of the transition effect for this to work reliably --- view/theme/redbasic/css/style.css | 10 ++++++---- view/theme/redbasic/js/redbasic.js | 38 +++++++++++++++++++++----------------- view/theme/redbasic/php/style.php | 2 +- 3 files changed, 28 insertions(+), 22 deletions(-) (limited to 'view/theme/redbasic') diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css index 8a38c68f3..c66b040a4 100644 --- a/view/theme/redbasic/css/style.css +++ b/view/theme/redbasic/css/style.css @@ -22,6 +22,8 @@ body { color: $font_colour; margin: 0px; height: 100%; + overflow-x: hidden; + } aside { @@ -30,6 +32,10 @@ aside { max-width: $aside_widthpx; } +aside#region_1 { + border-right: 1px solid transparent; +} + main { margin-left: auto; margin-right: auto; @@ -1838,10 +1844,6 @@ nav .badge.mail-update:hover { border-right: 1px solid $nav_bd; } - main { - transition: all 0.25s ease-in-out; - } - main { left: -$aside_widthpx; width: calc( 100% + $aside_widthpx ); diff --git a/view/theme/redbasic/js/redbasic.js b/view/theme/redbasic/js/redbasic.js index 8fb1117ce..4a18db8ff 100644 --- a/view/theme/redbasic/js/redbasic.js +++ b/view/theme/redbasic/js/redbasic.js @@ -8,34 +8,32 @@ $(document).ready(function() { if( $('#css3-calc').width() == 10) { $(window).resize(function() { if($(window).width() < 767) { - $('main').css('width', $(window).width() + 287 ); + $('main').css('width', $(window).width() + $('aside').outerWidth() ); } else { $('main').css('width', '100%' ); } }); } + $('#css3-calc').remove(); // Remove the test element - if($(window).outerWidth() > 767) { - $('#left_aside_wrapper').stick_in_parent({ - offset_top: $('nav').outerHeight(true) - }); - } + $('#left_aside_wrapper').stick_in_parent({ + offset_top: $('nav').outerHeight(true) + }); - $(window).resize(function() { - if($(window).outerWidth() > 767) { - $('#left_aside_wrapper').stick_in_parent({ - offset_top: $('nav').outerHeight(true) - }); - } - else { - $('#left_aside_wrapper').trigger("sticky_kit:detach"); + $('#expand-aside').on('click', toggleAside); + + $('section').on('click', function() { + if($('main').hasClass('region_1-on')){ + toggleAside(); } }); - $('#expand-aside').click(function() { - $('#expand-aside-icon').toggleClass('fa-arrow-circle-right').toggleClass('fa-arrow-circle-left'); - $('main').toggleClass('region_1-on'); + $(window).on('scroll', function() { + if($('main').hasClass('region_1-on') && $(window).scrollLeft() > 5){ + $(window).scrollLeft(0); + toggleAside(); + } }); if($('aside').length && $('aside').html().length === 0) { @@ -92,3 +90,9 @@ function makeFullScreen(full) { $(document.body).trigger("sticky_kit:recalc"); } } + +function toggleAside() { + $(window).scroll(); + $('#expand-aside-icon').toggleClass('fa-arrow-circle-right').toggleClass('fa-arrow-circle-left'); + $('main').toggleClass('region_1-on'); +} diff --git a/view/theme/redbasic/php/style.php b/view/theme/redbasic/php/style.php index 2db0d4c44..9b994ebdf 100644 --- a/view/theme/redbasic/php/style.php +++ b/view/theme/redbasic/php/style.php @@ -165,7 +165,7 @@ if(file_exists('view/theme/redbasic/css/style.css')) { $x .= $schemecss; } - $aside_width = 287; + $aside_width = 288; // left aside and right aside are 285px + converse width if($align_left) { -- cgit v1.2.3