[FIX] change selector for icons font (#162)

prevent wrong elements to be targeted as icon in FE updated IconFontSelector to make selector work in BE
t3kit · Apr 20, 2017 · 32770db · 32770db
1 parent 78a115f
commit 32770db
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 13 deletions.
diff --git a/Classes/UserFunction/IconFontSelector.php b/Classes/UserFunction/IconFontSelector.php
@@ -177,9 +177,13 @@ private function populateItemsFromIcoMoonJson()
             $filename = rtrim($this->cssFileInformation['dirname'], '/') . '/' . $this->icoMoonSelectionJsonFileName;
             $fileInformation = $this->getFileInformation($filename);
             $jsonData = json_decode(GeneralUtility::getUrl($fileInformation['absFileName']), true);
+            $classSelector = '';
             if (is_array($jsonData['icons']) && count($jsonData['icons']) > 0) {
                 if (isset($jsonData['preferences']['fontPref']['prefix']) && $jsonData['metadata']['name']) {
-                    $this->fontPrefix = $jsonData['preferences']['fontPref']['prefix'];
+                    if (isset($jsonData['preferences']['fontPref']['classSelector'])) {
+                        $classSelector = ltrim($jsonData['preferences']['fontPref']['classSelector'], '.') . ' ';
+                    }
+                    $this->fontPrefix = $classSelector . $jsonData['preferences']['fontPref']['prefix'];
                     foreach ($jsonData['icons'] as $key => $icon) {
                         $title = preg_replace("/([[:alpha:]])([[:digit:]])/", "\\1 \\2", $icon['properties']['name']);
                         $this->items[] = array(

diff --git a/Resources/Public/IconFonts/style.css b/Resources/Public/IconFonts/style.css
@@ -8,19 +8,19 @@
   font-style: normal;
 }
 
-[class^="icon-"], [class*=" icon-"] {
-  /* use !important to prevent issues with browser extensions that change fonts */
-  font-family: 'icons' !important;
-  speak: none;
-  font-style: normal;
-  font-weight: normal;
-  font-variant: normal;
-  text-transform: none;
-  line-height: 1;
+.icons {
+    /* use !important to prevent issues with browser extensions that change fonts */
+    font-family: 'icons' !important;
+    speak: none;
+    font-style: normal;
+    font-weight: normal;
+    font-variant: normal;
+    text-transform: none;
+    line-height: 1;
 
-  /* Better Font Rendering =========== */
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
+    /* Better Font Rendering =========== */
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
 }
 
 .icon-alarm:before {