Fix truncated hidden text layout flow bug

2023-11-22 11:04:52 +09:00
parent 1e01f88c15
commit 94a7b710c5
2 changed files with 9 additions and 8 deletions
--- a/frontend/src/app/shared/components/truncate/truncate.component.scss
+++ b/frontend/src/app/shared/components/truncate/truncate.component.scss
@@ -3,6 +3,7 @@
  display: flex;
  flex-direction: row;
  align-items: baseline;
+  position: relative;

  .truncate-link {
    display: flex;
@@ -27,17 +28,17 @@
  &.inline {
    display: inline-flex;
  }
-}

-.hidden { 
-  color: transparent;
-  position: absolute;
-  max-width: 300px;
-  overflow: hidden;
+  .hidden-content {
+    color: transparent;
+    position: absolute;
+    max-width: 300px;
+    overflow: hidden;
+  }
 }

@media (max-width: 567px) {
-  .hidden {
+  .hidden-content {
    max-width: 150px;
  }
 }