add global class ellipsis-left for strings where the end is more rele…

…vant to view than the beginning (#52)
Azure · Oct 28, 2021 · 414f430 · 414f430
1 parent 9ea701b
commit 414f430
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 1 deletion.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,10 @@
 # CHANGELOG
 
+## v8.1.11
+### Changed
+- Added global class ellipsis-left to display tree structure-type items where the
+text at the end of the string is more relevant than the text at the beginning
+
 ## v8.1.10
 ### Changed
 - Added $size-75 sizing constant (6rem)

diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@microsoft/azure-iot-ux-fluent-css",
   "description": "Azure IoT common styles library for CSS, Colors and Themes",
-  "version": "8.1.10",
+  "version": "8.1.11",
   "license": "MIT",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",

diff --git a/src/_normalize.scss b/src/_normalize.scss
@@ -217,6 +217,19 @@
     white-space: nowrap;
   }
 
+  .ellipsis-left {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    direction: rtl;
+    text-align: left;
+
+    @include rtl {
+        direction: ltr;
+        text-align: right;
+    }
+  }
+
   .hidden {
     display: none !important;
   }