@primer/css 20.8.0-rc.2077007c → 20.8.0-rc.2cd820cb

package/truncate/truncate.scss

@@ -1,61 +1,2 @@
-// Truncate
-//
-// css-truncate will shorten text with an ellipsis.
-
-.css-truncate {
-
-  // css-truncate-auto will shorten text with an ellipsis when overflowing
-  &.css-truncate-overflow,
-  .css-truncate-overflow,
-  &.css-truncate-target,
-  .css-truncate-target {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-
-  // css-truncate-target will shorten text with an ellipsis and a max width
-  &.css-truncate-target,
-  .css-truncate-target {
-    display: inline-block;
-    max-width: 125px;
-    vertical-align: top;
-  }
-
-  &.expandable.zeroclipboard-is-hover .css-truncate-target,
-  &.expandable.zeroclipboard-is-hover.css-truncate-target,
-  &.expandable:hover .css-truncate-target,
-  &.expandable:hover.css-truncate-target {
-    max-width: 10000px !important;
-  }
-}
-
-.Truncate {
-  display: inline-flex;
-  min-width: 0;
-  max-width: 100%;
-
-  > .Truncate-text {
-    min-width: 1ch;
-    max-width: fit-content;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-
-    + .Truncate-text {
-      margin-left: $spacer-1;
-    }
-
-    &.Truncate-text--primary {
-      flex-basis: 200%;
-    }
-
-    &.Truncate-text--expandable:hover,
-    &.Truncate-text--expandable:focus,
-    &.Truncate-text--expandable:active {
-      max-width: 100% !important;
-      flex-shrink: 0;
-      cursor: pointer;
-    }
-  }
-}
+@import '@primer/view-components/app/components/primer/truncate';
+@import '@primer/view-components/app/components/primer/beta/truncate';