Merge pull request #286 from arifszn/285-truncate-long-text

Truncate long text

src/components/details/index.jsx

@@ -34,14 +34,11 @@ const ListItem = ({ icon, title, value, link, skeleton = false }) => {
         className={`${
           skeleton ? 'flex-grow' : ''
         } text-sm font-normal text-right mr-2 ml-3 ${link ? 'truncate' : ''}`}
+        style={{
+          wordBreak: 'break-word',
+        }}
       >
-        <div
-          style={{
-            wordBreak: 'break-word',
-          }}
-        >
-          {value}
-        </div>
+        {value}
       </div>
     </a>
   );

src/components/project/index.jsx

@@ -96,7 +96,7 @@ const Project = ({ repo, loading, github, googleAnalytics }) => {
               {item.description}
             </p>
           </div>
-          <div className="flex justify-between text-sm text-base-content text-opacity-60">
+          <div className="flex justify-between text-sm text-base-content text-opacity-60 truncate">
             <div className="flex flex-grow">
               <span className="mr-3 flex items-center">
                 <AiOutlineStar className="mr-0.5" />