responsive log items

Author: andresdlt03

ethernet-view/src/pages/LoggerPage/LogsColumn/LogLoader/LogList/LogItem/LogItem.module.scss

@@ -2,20 +2,19 @@
 
 .logItemWrapper {
     display: flex;
+    justify-content: center;
     align-items: center;
     gap: .8rem;
-    width: fit-content;
+    width: 100%;
 
     &:hover {
         cursor: pointer;
     }
 }
 
 .icon {
-    width: 1.6rem;
-
     img {
-        width: 100%;
+        width: 1.6rem;
     }
 }
 
@@ -24,6 +23,9 @@
     font-size: 1.6rem;
     font-family: styles.$code-font;
     font-style: italic;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
 }
 
 .active {

ethernet-view/src/pages/LoggerPage/LogsColumn/LogLoader/LogList/LogItem/LogItem.tsx

@@ -19,9 +19,7 @@ export const LogItem = ({logName}: Props) => {
                 <img src={`${isOpen ? folderOpen : folderClosed}`} alt="log-icon" />
             </div>
             <div className={`${styles.title} ${isOpen ? styles.active : ""}`}>
-                <p>
-                    {logName}
-                </p>
+                {logName}
             </div>
         </div>
     )