Bug #30900

ActionIcon for Available Extensions is hidden in ExtensionManager

Added by Stefan Sorgen almost 5 years ago. Updated about 4 years ago.

Status:Resolved Start date:2011-10-13
Priority:Must have Due date:
Assigned To:Francois Suter % Done:

100%

Category:Extension Manager Spent time: -
Target version:4.5.16
TYPO3 Version:6.0 Complexity:easy
PHP Version:5.3 Is Regression:
Tags: Sprint Focus:

Description

In the backend tool "Extension Manager" the first tab show a list all available extensions. In the first column there should be an icon for the action "update", "install" or "remove".

Today I noticed, that there are only three dots "..." and the icons had gone for all extensions (each row) in this tab (but not for the tab import extensions).

I found out that the icon is still available, but there are hidden...

I use Firefox-7.0.1 and retreive yesterday an update. It could be possible, that with the update of FF the CSS compatibilities was extended.

My analysis:
- there are two img elements inside the td element, first for update, second for install/remove
- the css style for img is inherited from td which has the classes "paddingNoActionIcon" and "paddingActionIcon":
.paddingActionIcon img {margin-right:5px}
.paddingNoActionIcon img {margin-right:20px}
(declared in /typo3/sysext/em/res/css/t3_em.css)
- the css style for td has the class "x-grid3-cell-inner":
.x-grid3-cell-inner {
overflow: hidden;
padding: 3px 3px 3px 5px;
text-overflow: ellipsis;
white-space: nowrap;
}

Problem:
The CSS "text-overflow: ellipsis" means, that an overflow of content will not cut off, but replaced by a string "...".
The browser calculate the width and however include the margin to the width and notes that the image can not be displayed completely and replaces the second image with "...".

This property is not W3C conform and exists since IE5.5, but i don't know why it doesn't occur in IE8 and IE7.

Solutions:
When I disable the property "text-overflow: ellipsis" or change the "margin-right" of the definition ".paddingNoActionIcon img" to "5px", the icon will be displayed.
A change of the padding from "3px 3px 3px 5px" to "3px" works as well.

I hope you have an opportunity to check this.

I tested it in IE8 and FF6.0.2 and there it looks ok.

screenshot_em_actionIcons.png (9.4 kB) Stefan Sorgen, 2011-10-13 17:27


Related issues

related to Core - Bug #33931: sprites in em borken with ff 12/13 install/uninstall Closed 2012-02-14
duplicated by Core - Bug #36665: Missing install/uninstall icons in Extension Manager of 4... Resolved 2012-04-27
duplicated by Core - Bug #36770: Extension manager doesn't show whether extension is insta... Closed 2012-05-02

Associated revisions

Revision 3e9177b9
Added by Francois Suter about 4 years ago

[BUGFIX] EM: avoid cropping action columns

In some browsers the action icons of the new EM disappear, to be
replaced by an ellipsis (...). This is due to ExtJS using
"text-overflow: ellipsis" and some browsers miscalculating the
width of the column. This text-overflow directive is not necessary
as the icons fit nicely anyway.

Change-Id: I35aa04191f1f315e1e3ac7c22057d205bb0393b2
Fixes: #30900
Releases: 6.0, 4.7, 4.6, 4.5
Reviewed-on: http://review.typo3.org/10809
Reviewed-by: Francois Suter
Tested-by: Francois Suter

Revision e267810d
Added by Francois Suter about 4 years ago

[BUGFIX] EM: avoid cropping action columns

In some browsers the action icons of the new EM disappear, to be
replaced by an ellipsis (...). This is due to ExtJS using
"text-overflow: ellipsis" and some browsers miscalculating the
width of the column. This text-overflow directive is not necessary
as the icons fit nicely anyway.

Change-Id: I35aa04191f1f315e1e3ac7c22057d205bb0393b2
Fixes: #30900
Releases: 6.0, 4.7, 4.6, 4.5
Reviewed-on: http://review.typo3.org/10809
Reviewed-by: Francois Suter
Tested-by: Francois Suter

Revision c43ba46a
Added by Francois Suter about 4 years ago

[BUGFIX] EM: avoid cropping action columns

In some browsers the action icons of the new EM disappear, to be
replaced by an ellipsis (...). This is due to ExtJS using
"text-overflow: ellipsis" and some browsers miscalculating the
width of the column. This text-overflow directive is not necessary
as the icons fit nicely anyway.

Change-Id: I8c541ec5d931f6ef7fb727a6e5d68f03931bdd3c
Fixes: #30900
Releases: 6.0, 4.7, 4.6, 4.5
Reviewed-on: http://review.typo3.org/10877
Reviewed-by: Jigal van Hemert
Tested-by: Jigal van Hemert

Revision a8443bdb
Added by Francois Suter about 4 years ago

[BUGFIX] EM: avoid cropping action columns

In some browsers the action icons of the new EM disappear, to be
replaced by an ellipsis (...). This is due to ExtJS using
"text-overflow: ellipsis" and some browsers miscalculating the
width of the column. This text-overflow directive is not necessary
as the icons fit nicely anyway.

Change-Id: I26ae9c679b6419a723e98ebb66c726f5ddb3fe77
Fixes: #30900
Releases: 6.0, 4.7, 4.6, 4.5
Reviewed-on: http://review.typo3.org/10878
Reviewed-by: Jigal van Hemert
Tested-by: Jigal van Hemert

Revision 240dd556
Added by Francois Suter about 4 years ago

[BUGFIX] EM: avoid cropping action columns

In some browsers the action icons of the new EM disappear, to be
replaced by an ellipsis (...). This is due to ExtJS using
"text-overflow: ellipsis" and some browsers miscalculating the
width of the column. This text-overflow directive is not necessary
as the icons fit nicely anyway.

Change-Id: I44a59c508dba31a4439302237d055a88463c3f82
Fixes: #30900
Releases: 6.0, 4.7, 4.6, 4.5
Reviewed-on: http://review.typo3.org/10879
Reviewed-by: Jigal van Hemert
Tested-by: Jigal van Hemert

History

#1 Updated by Stefan Sorgen almost 5 years ago

Stefan Sorgen wrote:

- the css style for td has the class "x-grid3-cell-inner":
.x-grid3-cell-inner {

...

}

(declared in /typo3/contrib/extjs/resources/css/ext-all-notheme.css)

#2 Updated by Stefan Sorgen almost 5 years ago

The problem could be the language selector... which come with another bug (I think)

When you select a language in the 3th tab "Language Packages" (for example "de"), an entry will be added to "localconf.php"
After that, you will see in the first tab "Available Extensions" an arrow at each row (see screenshot) - this is the ExtJS function "row-expander"

The other bug I noted is, normally if you click on an extension, you will change the view to the extension details.
If you selected a language, you can't switch to this view - a double click on the row or a click to the arrow will expand a row below which is shows the extension details.
On this way, some input fields (used for extension configuration) are broken or don't work correct.

When I de-select any languages, the effect is still present.
In the "localconf.php" is still an entry:
$TYPO3_CONF_VARS['EXT']['extConf']['em'] = 'a:1:{s:17:"selectedLanguages";s:0:"";}';

Now I deleted the line manually and all works fine - there is now also more space (without the row-expander-arrow) for to display the actionIcons.

btw. tested in Typo3 4.6.0 [beta3] and [rc1]

I hope this will help...

#3 Updated by Chris topher over 4 years ago

  • Project changed from Backend Code Clean-Up to Core

#4 Updated by Chris topher over 4 years ago

  • Category set to Extension Manager
  • PHP Version set to 5.3
  • TYPO3 Version set to 4.6

#5 Updated by Francois Suter about 4 years ago

  • Status changed from New to Accepted
  • Assigned To set to Francois Suter
  • Target version set to 4.7.1

I found this report while looking at the same effect but that appeared for me after upgrading to FF12. I have a solution but no time to finalize it tonight. Will submit a patch soon, though.

#6 Updated by Francois Suter about 4 years ago

  • Complexity set to easy

#7 Updated by Gerrit Code Review about 4 years ago

  • Status changed from Accepted to Under Review

Patch set 1 for branch master has been pushed to the review server.
It is available at http://review.typo3.org/10809

#8 Updated by Francois Suter about 4 years ago

  • Target version changed from 4.7.1 to 4.6.9

#9 Updated by Francois Suter about 4 years ago

Stefan, could you test the patch I submitted, please, to see if it also solve the issues you encountered?

Thanks in advance.

#10 Updated by Francois Suter about 4 years ago

  • Priority changed from Should have to Must have
  • Target version changed from 4.6.9 to 4.5.16
  • TYPO3 Version changed from 4.6 to 6.0

#11 Updated by Gerrit Code Review about 4 years ago

Patch set 2 for branch master has been pushed to the review server.
It is available at http://review.typo3.org/10809

#12 Updated by Francois Suter about 4 years ago

  • Status changed from Under Review to Resolved
  • % Done changed from 0 to 100

#13 Updated by Gerrit Code Review about 4 years ago

  • Status changed from Resolved to Under Review

Patch set 1 for branch TYPO3_4-7 has been pushed to the review server.
It is available at http://review.typo3.org/10877

#14 Updated by Gerrit Code Review about 4 years ago

Patch set 1 for branch TYPO3_4-6 has been pushed to the review server.
It is available at http://review.typo3.org/10878

#15 Updated by Gerrit Code Review about 4 years ago

Patch set 1 for branch TYPO3_4-5 has been pushed to the review server.
It is available at http://review.typo3.org/10879

#16 Updated by Francois Suter about 4 years ago

  • Status changed from Under Review to Resolved

#17 Updated by Dirk Wildt about 4 years ago

Hy guys,
A change of the padding from "3px 3px 3px 5px" to "3px" doesn't fix the missing icons in my installation.

I fixed it with:

typo3_src-4.6.8/typo3/contrib/extjs/resources/css/ext-all-notheme.css

...
.x-grid3-cell-inner, .x-grid3-hd-inner{
overflow:hidden;
o-text-overflow: ellipsis;
/* 120502, dwildt, 1
/
/
text-overflow: ellipsis; /
/
120502, dwildt, 1+ */
text-overflow: hidden;
padding:3px 3px 3px 5px;
white-space: nowrap;
}

  • TYPO3 4.6.8
  • Ubuntu 12.04
  • Firefox 12.0

Kind regards
Dirk

#18 Updated by Francois Suter about 4 years ago

Hi Dirk,

Indeed and that's not how it has been solved. The patch which was eventually committed to the Git repository overrides the ellipsis setting, as you mention.

Also available in: Atom PDF