集中施肥按钮位置更改

src/pages/FertilizeConcentrated.js

@@ -53,12 +53,8 @@ const StyledBtn = styled.button`
     background-image: ${props => `url(${props.activeBg})`};
   }
 `;
-const Container = styled.div`
-	padding: ${`0 ${convertpx2vw(110)}`};
-	display: flex;
-	flex-wrap: wrap;
-`;
-const names = ['Line', 'Cave', 'Dip', 'Plug', 'Mix', ]; 
+const names = ['Line', 'Cave', 'Dip',]
+const names2 = ['Plug', 'Mix', ]; 
 const bgs = {LineBg, CaveBg, DipBg, PlugBg, MixBg, };
 const bgsActive = { LineBgActive, CaveBgActive, DipBgActive, PlugBgActive, MixBgActive, };
 
@@ -73,7 +69,8 @@ export default function ({ match }) {
   return (
     <StyledWheatBg>
       <StyledTitle src={TitleImg} />
-      <Container>
+      <div>
+        <div>
           {
             names.map(name => (
               <StyledBtn
@@ -84,7 +81,21 @@ export default function ({ match }) {
               />
             ))
           }
-      </Container>
+        </div>
+        <div>
+          {
+            names2.map(name => (
+              <StyledBtn
+                key={name}
+                bg={bgs[name+'Bg']}
+                activeBg={bgsActive[name+'BgActive']}
+                onClick={() => handleClick(name)}
+              />
+            ))
+          }
+        </div>
+
+      </div>
       <BackBtn />
       <HomeBtn />
       <Video wrappedComponentRef={c => videoRef.current = c} />