Added new design
[wolnelektury.git] / src / wolnelektury / static / 2022 / styles / utils / bourbon / library / _ellipsis.scss
diff --git a/src/wolnelektury/static/2022/styles/utils/bourbon/library/_ellipsis.scss b/src/wolnelektury/static/2022/styles/utils/bourbon/library/_ellipsis.scss
new file mode 100644 (file)
index 0000000..6d3e5c6
--- /dev/null
@@ -0,0 +1,36 @@
+@charset "UTF-8";
+
+/// Truncates text and adds an ellipsis to represent overflow.
+///
+/// @argument {number} $width [100%]
+///   The `max-width` for the string to respect before being truncated.
+///
+/// @argument {string} $display [inline-block]
+///   Sets the display-value of the element.
+///
+/// @example scss
+///   .element {
+///     @include ellipsis;
+///   }
+///
+///   // CSS Output
+///   .element {
+///     display: inline-block;
+///     max-width: 100%;
+///     overflow: hidden;
+///     text-overflow: ellipsis;
+///     white-space: nowrap;
+///     word-wrap: normal;
+///   }
+
+@mixin ellipsis(
+  $width: 100%,
+  $display: inline-block
+) {
+  display: $display;
+  max-width: $width;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  word-wrap: normal;
+}