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

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

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

@@ -1,9 +1,10 @@
 .standard-btn {
     text-align: center;
+    margin-bottom: 20px;
 }
 
 .standardBtn {
-    width: fit-content;
+    width: 150px;
     background-color: #02ADBA;
     font-size: 15px;
     padding: 7px 20px 7px 20px;

kivi-cars/src/components/CategoryBtns/categorybtns.js

@@ -0,0 +1,19 @@
+import './categorybtns.css'
+import StandardBtn from '../Button/StandardBtn'
+
+var auto = 'AUTO';
+var motor = 'MOTOR';
+var kamion = 'KAMION';
+
+const CategoryBtns = (props) => {
+    return ( 
+        <div className='category-btns'>
+            <StandardBtn title={auto}/>
+            <StandardBtn title={motor}/>
+            <StandardBtn title={kamion}/>
+        </div>
+    )
+
+}
+
+export default CategoryBtns

kivi-cars/src/containers/App.js

@@ -3,17 +3,17 @@ 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'
+import CategoryBtns from '../components/CategoryBtns/categorybtns'
 function App() {
 
-  const info = 'Dobrodosli na stranicu kivi!'
+  const naslov = 'Dobrodosli na stranicu kivi!'
 
 
   return (
     <div className="App">
-      <Header header={info}/>
+      <Header header={naslov}/>
       <ButtonsToolbar/>
-      <StandardBtn/>
+      <CategoryBtns/>
       
     </div>