bugfix preview images x overflow

Author: new-AF

src/components/Preview.css

@@ -34,10 +34,14 @@
     font-family: var(--sans-serif);
     grid-area: preview;
     overflow-x: scroll;
-    padding-left: 2rem;
+    padding: 0 2rem;
     box-shadow: 1px 0.5rem 2rem 1px darkgray;
 }
-
+/* fix images x overflow */
+#preview img {
+    width: 100%;
+    object-fit: cover;
+}
 /* markdown `---` translated to <hr/> */
 #preview hr {
     border: none;
@@ -49,8 +53,4 @@
         border: none;
         border-top-left-radius: var(--preview-div-br);
     }
-    #preview {
-        grid-column: 1;
-        grid-row: 3;
-    }
 }

src/slice.js

@@ -10,7 +10,7 @@ const initialText = `# About Me
 1. **Work Break timer** [Live App](https://new-af.github.io/) \[[GitHub Repository](https://github.com/new-AF/react-redux-work-break-timer)\]
 2. **Product Page** [Live Page](https://new-af.github.io/)
 
-## Some preview images of live apps
+## Images of live apps
 1. ![live app preview image](https://new-af.github.io/assets/1%20react%20redux%201%20work%20break%20timer.png)
 
 2. ![live app preview image](https://new-af.github.io/assets/3%20html5%20css3%202%20product%20page.png)