X-Git-Url: https://git.mdrn.pl/wolnelektury.git/blobdiff_plain/14eaee7aef2e0f89f0210f087d10eeaed0bedf43..a8282aa69e00292bec986722c5230ff89f96f450:/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 index 000000000..6d3e5c63d --- /dev/null +++ b/src/wolnelektury/static/2022/styles/utils/bourbon/library/_ellipsis.scss @@ -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; +}