Task #49589
Optimize global icon styles
| Status: | Resolved | Start date: | 2013-07-02 | |
|---|---|---|---|---|
| Priority: | Should have | Due date: | ||
| Assigned To: | Aske Ertmann | % Done: | 100% |
|
| Category: | Global User Interface | Spent time: | - | |
| Target version: | - |
Description
At the moment we define a very global style for icon-classes:
[class^="icon-"], [class*=" icon-"] {
background: none;
-webkit-font-smoothing: antialiased;
font-size: 14px;
}
File: /Packages/Application/TYPO3.Neos/Resources/Private/Styles/_General.scss
Line: 35 - 39
As class names like icon-xxx are quite generic this will break individual icon styling for the websites.
We have to prefix all icon elements and correct those lines according to the prefixed class-names to prevent breaking user styles.
History
#1 Updated by Berit Hlubek about 2 years ago
- Status changed from New to Needs Feedback
- Assigned To changed from Berit Hlubek to Aske Ertmann
At the moment we use icons by only adding classes like icon-eye-close.
We can add another class like neos-icon and add the above shown global styling to that class only.
At Aske what do you think regarding this idea?
#2 Updated by Aske Ertmann about 2 years ago
- Assigned To changed from Aske Ertmann to Berit Hlubek
Hey Berit
It's already wrapped in .neos.. I didn't want to add .neos to all files to instead I include them inside .neos in Neos.scss so it shouldn't caused any issues.
#3 Updated by Berit Hlubek about 2 years ago
- Assigned To changed from Berit Hlubek to Aske Ertmann
The problem is not the missing .neos class around it but the fact that we do such global styling on a all class names like icon-xxx which also normal websites might use. When such website is used with neos all elements which use such an icon class will break while you are logged in, as the .neos class of course is also around that website and its classes. We can't use such generic class names for styling like that and should add classes like neos-icon which get those styles instead.
#4 Updated by Aske Ertmann about 2 years ago
- Status changed from Needs Feedback to Resolved
- % Done changed from 0 to 100