From fe9df64fc2bb0a276386321510ec078d83a6b322 Mon Sep 17 00:00:00 2001 From: Mario Vavti Date: Fri, 15 Apr 2016 09:52:40 +0200 Subject: [PATCH 1/2] fix some slight crossbrowser rendering issues with jot --- view/css/conversation.css | 14 +++++++++----- view/theme/redbasic/css/style.css | 16 ++++++---------- view/tpl/jot-header.tpl | 2 +- 3 files changed, 16 insertions(+), 16 deletions(-) diff --git a/view/css/conversation.css b/view/css/conversation.css index 304e0f196..5cbd5c896 100644 --- a/view/css/conversation.css +++ b/view/css/conversation.css @@ -34,10 +34,18 @@ code { padding: 10px; } -.profile-jot-text { +#profile-jot-text { + resize: none; + border-width: 0px; height: 39px; + line-height: 19px; padding: 10px; width: 100%; + display: inherit; +} + +#profile-jot-text:focus { + resize: vertical; } .jot-attachment { @@ -60,10 +68,6 @@ code { height: 30px; } -#profile-jot-form { - line-height: initial; -} - #profile-jot-wrapper { margin-bottom: 30px; } diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css index 903900e7f..c21360a1f 100644 --- a/view/theme/redbasic/css/style.css +++ b/view/theme/redbasic/css/style.css @@ -1108,22 +1108,15 @@ img.mail-conv-sender-photo { } #profile-jot-text { - resize: none; - border-width: 0px; border-radius: $radiuspx; } -#profile-jot-text:focus { - resize: vertical; -} - - #profile-jot-text::-webkit-input-placeholder { - font-size:16px; + font-size: 16px; } #profile-jot-text::-moz-placeholder { - font-size:16px; + font-size: 16px; } #profile-jot-text:focus::-webkit-input-placeholder { @@ -1815,7 +1808,10 @@ nav .badge.mail-update:hover { } /* Abusing theme-green is less work than makeing a new new one */ -.theme-green .back-bar .selected-bar { background-color: #000000; background-image: none; !important } +.theme-green .back-bar .selected-bar { + background-color: #000000; + background-image: none !important; +} /* Turn checkboxes into switches */ diff --git a/view/tpl/jot-header.tpl b/view/tpl/jot-header.tpl index b8618ab69..085710f55 100755 --- a/view/tpl/jot-header.tpl +++ b/view/tpl/jot-header.tpl @@ -10,7 +10,7 @@ function initEditor(cb){ $("#profile-jot-text-loading").spin('small').show(); if(plaintext == 'none') { $("#profile-jot-text-loading").spin(false).hide(); - $("#profile-jot-text").css({ 'height': 200, 'color': '#000' }); + $("#profile-jot-text").css({ 'height': 200, 'color': '#000', 'line-height': 'inherit' }); {{if $bbco_autocomplete}} $("#profile-jot-text").bbco_autocomplete('{{$bbco_autocomplete}}'); // autocomplete bbcode {{/if}} From 2cb04ccb8fb2fcbea181f6bf82f0d2a9a848d57a Mon Sep 17 00:00:00 2001 From: Mario Vavti Date: Fri, 15 Apr 2016 12:39:22 +0200 Subject: [PATCH 2/2] nav: move js and css out of template, provide a help button in the panel on small screens and lots of whitespace cleanup --- view/theme/redbasic/css/style.css | 35 ++- view/theme/redbasic/js/redbasic.js | 12 + view/tpl/nav.tpl | 408 +++++++++++++---------------- 3 files changed, 222 insertions(+), 233 deletions(-) diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css index c21360a1f..de48ff74a 100644 --- a/view/theme/redbasic/css/style.css +++ b/view/theme/redbasic/css/style.css @@ -1674,7 +1674,8 @@ nav .badge.mail-update:hover { } #expand-aside, -#expand-tabs { +#expand-tabs, +#help-btn { color: $nav_active_icon_colour; padding: 7px 10px; } @@ -1887,10 +1888,6 @@ nav .badge.mail-update:hover { background-color: #337AB7; } -/*.channels_ckbx, .pending_ckbx, .users_ckbx { - margin-top: -5px !important; -}*/ - .help-searchlist { list-style-type: none; } @@ -1898,3 +1895,31 @@ nav .badge.mail-update:hover { .help-searchlist a { font-size: 130%; } + +/* contextual help */ +.help-content { + background: rgba(255, 255, 255, 0.9); + color: #333333; + position: fixed; + top: 50px; + left: -80%; + width: 80%; + height: 60%; + padding: 20px; + transition: left 300ms cubic-bezier(0.17, 0.04, 0.03, 0.94); + box-sizing: border-box; + border: #CCC thin solid; + overflow: auto; +} + +.help-content-open { + left: 0px; + -moz-box-shadow: 3px 3px 3px #ccc; + -webkit-box-shadow: 3px 3px 3px #ccc; + box-shadow: 3px 3px 3px #ccc; +} + +.help-content dd { + margin-bottom: 1em; +} +/* contextual help end */ diff --git a/view/theme/redbasic/js/redbasic.js b/view/theme/redbasic/js/redbasic.js index 877bcd840..b4cde6efc 100644 --- a/view/theme/redbasic/js/redbasic.js +++ b/view/theme/redbasic/js/redbasic.js @@ -67,3 +67,15 @@ function makeFullScreen(full) { $('main').css({'transition': ''}); } } + +/* contextual help */ +$(document).mouseup(function (e) { + var container = $("#help-content"); + + if (!container.is(e.target) // if the target of the click isn't the container... + && container.has(e.target).length === 0 // ... nor a descendant of the container + && container.hasClass('help-content-open')) + { + container.removeClass('help-content-open'); + } +}); diff --git a/view/tpl/nav.tpl b/view/tpl/nav.tpl index 886f73947..7f6c33c61 100755 --- a/view/tpl/nav.tpl +++ b/view/tpl/nav.tpl @@ -1,243 +1,195 @@ - - -
- +
+ {{$nav.help.5}} +

Click here for more documentation...

+
+