Fixed bug #16939: ExtJS Tooltip / CSH styling
authorSteffen Gebert <steffen.gebert@typo3.org>
Wed, 12 Jan 2011 14:37:44 +0000 (14:37 +0000)
committerSteffen Gebert <steffen.gebert@typo3.org>
Wed, 12 Jan 2011 14:37:44 +0000 (14:37 +0000)
git-svn-id: https://svn.typo3.org/TYPO3v4/Core/trunk@10038 709f56b5-9817-0410-a4d7-c38de5d9e867

ChangeLog
t3lib/js/extjs/contexthelp.js
typo3/backend.php
typo3/sysext/lang/locallang_core.xml
typo3/sysext/t3skin/extjs/images/qtip/tip-anchor-sprite.gif
typo3/sysext/t3skin/extjs/images/qtip/tip-sprite.gif [deleted file]
typo3/sysext/t3skin/extjs/xtheme-t3skin.css
typo3/sysext/t3skin/stylesheets/structure/element_csh.css
typo3/sysext/t3skin/stylesheets/visual/element_csh.css

index 7ad9543..6fe8908 100755 (executable)
--- a/ChangeLog
+++ b/ChangeLog
@@ -1,3 +1,7 @@
+2011-01-12  Steffen Gebert  <steffen@steffen-gebert.de>
+
+       * Fixed bug #16939: ExtJS Tooltip / CSH styling
+
 2011-01-12  Benjamin Mack  <benjamin.mack@typo3.org>
 
        * Synchronized external repositories of version (tag 4.5.0beta4) and workspaces (tag 4.5.0beta4)
index 7755dcf..f7a410c 100644 (file)
@@ -52,9 +52,17 @@ TYPO3.ContextHelp = function() {
                var key = table + '.' + field;
                var response = cshHelp.key(key);
                tip.target = tip.triggerElement;
-               if (response ) {
+               if (response) {
                        updateTip(response);
                } else {
+                       // clear old tooltip contents
+                       updateTip({
+                               description: top.TYPO3.LLL.core.csh_tooltip_loading,
+                               cshLink: '',
+                               moreInfo: '',
+                               title: ''
+                       });
+                       // load content
                        TYPO3.CSH.ExtDirect.getContextHelp(table, field, function(response, options) {
                                cshHelp.add(response);
                                updateTip(response);
@@ -72,7 +80,7 @@ TYPO3.ContextHelp = function() {
                tip.cshLink = response.id;
                tip.moreInfo = response.moreInfo;
                tip.setTitle(response.title);
-               tip.syncShadow();
+               tip.doAutoWidth();
        }
 
 
@@ -91,6 +99,7 @@ TYPO3.ContextHelp = function() {
                                delegate: 'span.t3-help-link',
                                renderTo: Ext.getBody(),
                                cls: 'typo3-csh-tooltip',
+                               shadow: false,
                                dismissDelay: 0, // tooltip stays while mouse is over target
                                showDelay: 500, // show after 0.5 seconds
                                hideDelay: 3000, // hide after 3 seconds
@@ -100,13 +109,13 @@ TYPO3.ContextHelp = function() {
                                        render: function(tip) {
                                                tip.body.on('click', function(event){
                                                        event.stopEvent();
-                                                       if (tip.moreInfo)
+                                                       if (tip.moreInfo) {
                                                                try {
                                                                        top.TYPO3.ContextHelpWindow.open(tip.cshLink);
                                                                } catch(e) {
                                                                        // do nothing
                                                                }
-
+                                                       }
                                                });
                                        },
                                        hide: function(tip) {
@@ -133,7 +142,6 @@ TYPO3.ContextHelp = function() {
                        top.TYPO3.ContextHelpWindow.open(id);
                }
        }
-
 }();
 
 /**
index ec1f257..6609de2 100644 (file)
@@ -495,6 +495,7 @@ class TYPO3backend {
                        'donateWindow_button_donate' => $GLOBALS['LANG']->sL('LLL:EXT:lang/locallang_core.xml:donateWindow.button_donate'),
                        'donateWindow_button_disable' => $GLOBALS['LANG']->sL('LLL:EXT:lang/locallang_core.xml:donateWindow.button_disable'),
                        'donateWindow_button_postpone' => $GLOBALS['LANG']->sL('LLL:EXT:lang/locallang_core.xml:donateWindow.button_postpone'),
+                       'csh_tooltip_loading' => $GLOBALS['LANG']->sL('LLL:EXT:lang/locallang_core.xml:csh_tooltip_loading'),
                );
                $t3LLLfileUpload = array(
                        'windowTitle' => $GLOBALS['LANG']->getLL('fileUpload_windowTitle'),
index 05195fb..136f77f 100755 (executable)
@@ -302,6 +302,7 @@ Check also the following points:\n
                        <label index="link.to.dblist.correctly">Please, do not link to this page. Use t3lib_BEfunc::getListViewLink() for link generation.</label>
                        <label index="link.to.filefile.correctly">Please, do not link to this page.</label>
                        <label index="loadingIndicator">Loading ...</label>
+                       <label index="csh_tooltip_loading">Loading help...</label>
                </languageKey>
        </data>
 </T3locallang>
index c813c66..0a2f3e7 100644 (file)
Binary files a/typo3/sysext/t3skin/extjs/images/qtip/tip-anchor-sprite.gif and b/typo3/sysext/t3skin/extjs/images/qtip/tip-anchor-sprite.gif differ
diff --git a/typo3/sysext/t3skin/extjs/images/qtip/tip-sprite.gif b/typo3/sysext/t3skin/extjs/images/qtip/tip-sprite.gif
deleted file mode 100644 (file)
index b20e0e5..0000000
Binary files a/typo3/sysext/t3skin/extjs/images/qtip/tip-sprite.gif and /dev/null differ
index 997c85a..f6f60a0 100644 (file)
@@ -1594,29 +1594,25 @@ td.x-date-mp-sel a {
 td.x-date-mp-sep {
    border-right-color:#A2AAB8;
 }
-.x-tip .x-tip-close{
-       background-image: url(images/qtip/close.gif);
-}
 
-.x-tip .x-tip-tc, .x-tip .x-tip-tl, .x-tip .x-tip-tr, .x-tip .x-tip-bc, .x-tip .x-tip-bl, .x-tip .x-tip-br, .x-tip .x-tip-ml, .x-tip .x-tip-mr {
-       background-image: url(images/qtip/tip-sprite.gif);
-}
-
-.x-tip .x-tip-mc {
-       font: normal 10px verdana, arial,tahoma,helvetica,sans-serif;
-}
-.x-tip .x-tip-ml {
-       background-color: #fff;
+.x-tip {
+       background-color: #ffffc7;
+       border: 1px solid #cccccc;
+       -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
+       -ms-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
+       -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
+       box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
 }
 
 .x-tip .x-tip-header-text {
-       font: bold 10px verdana, arial, tahoma, helvetica,sans-serif;
-       color:#444;
+       font-size: 11px;
+       font-weight: bold;
+       line-height: 14px;
+       margin-bottom: 4px;
 }
 
-.x-tip .x-tip-body {
-       font: normal 10px verdana, arial, tahoma, helvetica,sans-serif;
-       color:#444;
+.x-tip .x-tool-close {
+       display: none;
 }
 
 .x-form-invalid-tip .x-tip-tc, .x-form-invalid-tip .x-tip-tl, .x-form-invalid-tip .x-tip-tr, .x-form-invalid-tip .x-tip-bc,
@@ -1632,6 +1628,12 @@ td.x-date-mp-sep {
 .x-tip-anchor {
        background-image:url(images/qtip/tip-anchor-sprite.gif);
 }
+
+.x-tip-anchor-left,
+.x-tip-anchor-right {
+       height: 16px;
+}
+
 .x-menu {
        border-color:#898989;
        background-color: #ffffff;
index 97aa7f7..5c5d95a 100644 (file)
@@ -4,9 +4,12 @@ Context sensitive help
 $Id$
 - - - - - - - - - - - - - - - - - - - - - */
 
+.typo3-csh-inline {
+       padding: 4px;
+}
+
 table.typo3-csh-inline {
        margin: 5px 4px 20px 0px;
-       padding: 0;
 }
 
 table.typo3-csh-inline a.typo3-csh-link {
@@ -16,7 +19,6 @@ table.typo3-csh-inline a.typo3-csh-link {
 
 a.typo3-csh-link .typo3-csh-inline {
        display: none;
-       padding: 0px;
        position: absolute;
        width: 200px;
        z-index: 100;
@@ -42,10 +44,6 @@ a.typo3-csh-link:hover .typo3-csh-inline {
        height: auto;
 }
 
-.typo3-csh-inline p.t3-csh-short {
-       padding: 3px;
-}
-
 table.typo3-csh-inline a.typo3-csh-link {
        height: 16px;
 }
@@ -123,9 +121,12 @@ div.typo3-view-help img.c-inlineimg  {
 
 
 /*** new help code ***/
+.t3-help-inline {
+       padding: 4px;
+}
+
 table.t3-help-inline {
        margin: 3px 4px 20px 0px;
-       padding: 0;
 }
 
 table.t3-help-inline a.t3-help-link {
@@ -135,7 +136,6 @@ table.t3-help-inline a.t3-help-link {
 
 a.t3-help-link .t3-help-inline {
        display: none;
-       padding: 0px;
        position: absolute;
        width: 200px;
        z-index: 100;
@@ -161,10 +161,6 @@ a.t3-help-link:hover .t3-help-inline {
        height: auto;
 }
 
-.t3-help-inline p.t3-help-short {
-       padding: 3px;
-}
-
 table.t3-help-inline a.t3-help-link {
        height: 16px;
 }
@@ -239,3 +235,14 @@ div.t3-view-help .introduction {
 div.t3-view-help img.c-inlineimg  {
        margin-left: 10px;
 }
+
+/** ExtJS based CSH tooltips */
+.x-tip.typo3-csh-tooltip .x-tip-tl,
+.x-tip.typo3-csh-tooltip .x-tip-cl {
+       padding-left: 8px;
+}
+
+.x-tip.typo3-csh-tooltip .x-tip-tr,
+.x-tip.typo3-csh-tooltip .x-tip-cr {
+       padding-right: 8px;
+}
\ No newline at end of file
index 7e20a0a..9a8ec77 100644 (file)
@@ -5,8 +5,8 @@ $Id$
 - - - - - - - - - - - - - - - - - - - - - */
 
 table.typo3-csh-inline {
-       background-color: #ffffff;
-       border: 1px solid #a2aab8;
+       background-color: #ffffc7;
+       border: 1px solid #cccccc;
 }
 
 .typo3-csh-inline {
@@ -17,16 +17,12 @@ table.typo3-csh-inline {
 }
 
 a.typo3-csh-link .typo3-csh-inline {
-       background: #ffffff;
+       background-color: #ffffc7;
+       border: 1px solid #cccccc;
        color: #000000;
        font-weight: normal;
 }
 
-div.typo3-csh-inline p.t3-csh-short {
-       border: #b6b6b6 1px solid;
-       border-top: none;
-}
-
 img.typo3-csh-icon {
        cursor: help;
 }
@@ -37,8 +33,8 @@ a.typo3-csh-link {
 
 /** new CSH code **/
 table.t3-help-inline {
-       background-color: #ffffff;
-       border: 1px solid #a2aab8;
+       background-color: #ffffc7;
+       border: 1px solid #cccccc;
 }
 
 .t3-help-inline {
@@ -49,16 +45,11 @@ table.t3-help-inline {
 }
 
 a.t3-help-link .t3-help-inline {
-       background: #ffffff;
+       background: #ffffc7;
        color: #000000;
        font-weight: normal;
 }
 
-div.t3-help-inline p.t3-help-short {
-       border: #b6b6b6 1px solid;
-       border-top: none;
-}
-
 p.t3-help-short.tipIsLinked {
        cursor: pointer;
 }