fix: footer windows truncate

ShizukuIchi · Apr 3, 2019 · 029866a · 029866a · vercel · Apr 3, 2019
1 parent c4bed0b
commit 029866a
Showing 1 changed file with 9 additions and 1 deletion.
diff --git a/src/WinXP/Footer/index.js b/src/WinXP/Footer/index.js
@@ -73,7 +73,8 @@ function Footer({
           className="footer__start"
           onMouseDown={toggleMenu}
         />
-        {[...apps]
+        <div className="footer__window__items">
+          {[...apps]
           .sort((a, b) => a.id - b.id)
           .map(app => (
             <FooterWindow
@@ -85,6 +86,7 @@ function Footer({
               isFocus={focusedAppId === app.id}
             />
           ))}
+        </div>
       </div>
 
       <div className="footer__items right">
@@ -190,6 +192,12 @@ const Container = styled.footer`
     box-shadow: 2px 4px 2px rgba(0, 0, 0, 0.5);
     bottom: 100%;
   }
+  .footer__window__items {
+    display: inline-flex;
+    margin-right: 10px;
+    width: 0;
+    flex: 1;
+  }
   .footer__window {
     flex: 1;
     max-width: 150px;