Merge branch 'addstandardbutton' into 'main'

add standard button

See merge request saburly/marketalarm/kivi-za-auta-react!8

kivi-cars/src/components/Button/StandardBtn.js

@@ -0,0 +1,13 @@
+import './button.css'
+
+var title = "DALJE";
+const StandardBtn = (props) => {
+    return (
+        <div className='standard-btn'>
+
+           <button className='standardBtn'>{title}</button>
+        </div>
+    )
+}
+
+export default StandardBtn

kivi-cars/src/components/Button/button.css

@@ -0,0 +1,32 @@
+.standard-btn {
+    text-align: center;
+}
+
+.standardBtn {
+    width: fit-content;
+    background-color: #02ADBA;
+    font-size: 15px;
+    padding: 7px 20px 7px 20px;
+    color: white;
+    border: #02ADBA;
+}
+
+.standardBtn:hover {
+    background-color:#3eced8 ;
+    color: white;
+}
+
+.left-button {
+    padding: 5px;
+}
+.left-button:hover {
+    background-color:#9eedf3 
+}
+
+.right-button {
+    padding: 5px;
+}
+.right-button:hover {
+    background-color:#9eedf3 
+ 
+}

kivi-cars/src/components/Button/leftBtn.js

@@ -6,7 +6,6 @@ const leftBtn = (props) => {
         <div className='left-button'>
             <ArrowLeft/>
         </div>
-        
      );
 }
 

kivi-cars/src/components/Button/rightBtn.js

@@ -3,7 +3,10 @@ import { ReactComponent as ArrowRight } from '../../assets/arrow-right.svg';
 
 const rightBtn = (props) => {
     return ( 
-        <ArrowRight/>
+        <div className='right-button'>
+            <ArrowRight/>
+        </div>
+        
      );
 }
 

kivi-cars/src/containers/App.js

@@ -3,15 +3,18 @@ import React from 'react';
 import Filters from '../components/Filters';
 import Header from '../components/Header/Header';
 import ButtonsToolbar from '../components/ButtonsToolbar/ButtonsToolbar';
-
+import StandardBtn from '../components/Button/StandardBtn'
 function App() {
 
   const info = 'Dobrodosli na stranicu kivi!'
 
+
   return (
     <div className="App">
       <Header header={info}/>
       <ButtonsToolbar/>
+      <StandardBtn/>
+      
     </div>
  
   );