Index: phonelux-frontend/src/components/FiltersComponents/FilterSelectComponent.js
===================================================================
--- phonelux-frontend/src/components/FiltersComponents/FilterSelectComponent.js	(revision d66b8ebb46c9e4a4056ded9adde5e33dcaaf6b44)
+++ phonelux-frontend/src/components/FiltersComponents/FilterSelectComponent.js	(revision 48f3030e929e5d3717498b6e78a9813429162fde)
@@ -16,5 +16,4 @@
       super(props)
         const {type} = this.props
-        console.log(type)
       this.state = {
          pickedItems: localStorage.getItem(type) ? localStorage.getItem(type).split(',') : [],
Index: phonelux-frontend/src/components/FiltersComponents/SortByComponent.css
===================================================================
--- phonelux-frontend/src/components/FiltersComponents/SortByComponent.css	(revision d66b8ebb46c9e4a4056ded9adde5e33dcaaf6b44)
+++ phonelux-frontend/src/components/FiltersComponents/SortByComponent.css	(revision 48f3030e929e5d3717498b6e78a9813429162fde)
@@ -20,2 +20,18 @@
     overflow-y: scroll;
 }
+
+.pick-specifications-icon{
+    margin-left: 10px;
+}
+
+.pick-specifications-icon:hover{
+    cursor: pointer;
+}
+
+.specifications-filter-main{
+    display: flex;
+}
+.tippy-pick-specifications-icon{
+    width: fit-content;
+    text-align: center;
+}
Index: phonelux-frontend/src/components/FiltersComponents/SortByComponent.js
===================================================================
--- phonelux-frontend/src/components/FiltersComponents/SortByComponent.js	(revision d66b8ebb46c9e4a4056ded9adde5e33dcaaf6b44)
+++ phonelux-frontend/src/components/FiltersComponents/SortByComponent.js	(revision 48f3030e929e5d3717498b6e78a9813429162fde)
@@ -3,4 +3,6 @@
 import './SortByComponent.css'
 import SpecificationsFilterComponent from './SpecificationsFilterComponent'
+import FilterAltIcon from '@mui/icons-material/FilterAlt';
+import PickSpecificationComponent from '../PickSpecificationComponent/PickSpecificationComponent';
 
 export class SortByComponent extends Component {
@@ -10,5 +12,6 @@
     
       this.state = {
-         sortBy: localStorage.getItem('sortBy') ? localStorage.getItem('sortBy') : 'mostPopular'
+         sortBy: localStorage.getItem('sortBy') ? localStorage.getItem('sortBy') : 'mostPopular',
+         openModal: false
       }
     }
Index: phonelux-frontend/src/components/FiltersComponents/SpecificationsFilterComponent.css
===================================================================
--- phonelux-frontend/src/components/FiltersComponents/SpecificationsFilterComponent.css	(revision d66b8ebb46c9e4a4056ded9adde5e33dcaaf6b44)
+++ phonelux-frontend/src/components/FiltersComponents/SpecificationsFilterComponent.css	(revision 48f3030e929e5d3717498b6e78a9813429162fde)
@@ -18,5 +18,8 @@
 .popover-specification-container{
     overflow-y: scroll;
-    height: 400px;
+    height: fit-content;
+    padding-bottom: 30px;
+    max-height: 400px;
+    
 }
 
Index: phonelux-frontend/src/components/FiltersComponents/SpecificationsFilterComponent.js
===================================================================
--- phonelux-frontend/src/components/FiltersComponents/SpecificationsFilterComponent.js	(revision d66b8ebb46c9e4a4056ded9adde5e33dcaaf6b44)
+++ phonelux-frontend/src/components/FiltersComponents/SpecificationsFilterComponent.js	(revision 48f3030e929e5d3717498b6e78a9813429162fde)
@@ -8,4 +8,7 @@
 import FilterSelectComponent from './FilterSelectComponent';
 import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown';
+import PickSpecificationComponent from '../PickSpecificationComponent/PickSpecificationComponent';
+import axios from 'axios';
+import UserContext from '../../context/UserContext';
 export class SpecificationsFilterComponent extends Component {
 
@@ -14,5 +17,6 @@
     
       this.state = {
-        anchorEl: null
+        anchorEl: null,
+        openModal: false,
       }
     }
@@ -29,4 +33,16 @@
       })
     };
+
+    handleModalClose = () =>{
+      this.setState({
+        openModal: false
+      })
+    }
+
+    handleModalOpen = () =>{
+        this.setState({
+            openModal: true
+        })
+    }
 
   render() {
@@ -53,15 +69,39 @@
         <div className='popover-specification-container'>
         <h2 className='popover-specification-container-header'>Филтер за спецификации</h2>
-        <FilterSelectComponent changeHandler={this.props.changeHandler} width={400} type='ram'></FilterSelectComponent>
-        <FilterSelectComponent changeHandler={this.props.changeHandler} width={400} type='rom'></FilterSelectComponent>
-        <FilterSelectComponent changeHandler={this.props.changeHandler} width={400} type='frontcamera'></FilterSelectComponent>
-        <FilterSelectComponent changeHandler={this.props.changeHandler} width={400} type='backcamera'></FilterSelectComponent>
-        <FilterSelectComponent changeHandler={this.props.changeHandler} width={400} type='chipset'></FilterSelectComponent>
-        <FilterSelectComponent changeHandler={this.props.changeHandler} width={400} type='cpu'></FilterSelectComponent>
-        <FilterSelectComponent changeHandler={this.props.changeHandler} width={400} type='operatingsystem'></FilterSelectComponent>
-        <FilterSelectComponent changeHandler={this.props.changeHandler} width={400} type='color'></FilterSelectComponent>
-        <FilterSelectComponent changeHandler={this.props.changeHandler} width={400} type='battery'></FilterSelectComponent>
+        { !localStorage.getItem('pickedSpecifications') || localStorage.getItem('pickedSpecifications').includes("РАМ меморија") ?
+        <FilterSelectComponent changeHandler={this.props.changeHandler} width={400} type='ram'></FilterSelectComponent> : <></>
+        }
+        { !localStorage.getItem('pickedSpecifications') || localStorage.getItem('pickedSpecifications').includes("РОМ меморија") ?
+        <FilterSelectComponent changeHandler={this.props.changeHandler} width={400} type='rom'></FilterSelectComponent> : <></>
+        } 
+        { !localStorage.getItem('pickedSpecifications') || localStorage.getItem('pickedSpecifications').includes("Предна камера") ?
+        <FilterSelectComponent changeHandler={this.props.changeHandler} width={400} type='frontcamera'></FilterSelectComponent> : <></>
+        }
+        { !localStorage.getItem('pickedSpecifications') || localStorage.getItem('pickedSpecifications').includes("Задна камера") ?
+        <FilterSelectComponent changeHandler={this.props.changeHandler} width={400} type='backcamera'></FilterSelectComponent> : <></>
+        }
+        { !localStorage.getItem('pickedSpecifications') || localStorage.getItem('pickedSpecifications').includes("Чипсет") ?
+        <FilterSelectComponent changeHandler={this.props.changeHandler} width={400} type='chipset'></FilterSelectComponent> : <></>
+        }
+         { !localStorage.getItem('pickedSpecifications') || localStorage.getItem('pickedSpecifications').includes("Процесор") ?
+        <FilterSelectComponent changeHandler={this.props.changeHandler} width={400} type='cpu'></FilterSelectComponent> : <></>
+        }
+        { !localStorage.getItem('pickedSpecifications') || localStorage.getItem('pickedSpecifications').includes("Оперативен систем") ?
+        <FilterSelectComponent changeHandler={this.props.changeHandler} width={400} type='operatingsystem'></FilterSelectComponent> : <></>
+        }
+        { !localStorage.getItem('pickedSpecifications') || localStorage.getItem('pickedSpecifications').includes("Боја") ?
+        <FilterSelectComponent changeHandler={this.props.changeHandler} width={400} type='color'></FilterSelectComponent> : <></>
+        }
+        { !localStorage.getItem('pickedSpecifications') || localStorage.getItem('pickedSpecifications').includes("Батерија") ?
+        <FilterSelectComponent changeHandler={this.props.changeHandler} width={400} type='battery'></FilterSelectComponent> : <></>
+        }
         </div>
       </Popover>
+      <Tippy className='tippy-pick-specifications-icon' placement='bottom' content='Изберете спецификации за приказ'>
+        <FilterAltIcon onClick={this.handleModalOpen} style={{fontSize: '35px'}} className='pick-specifications-icon'></FilterAltIcon>
+        </Tippy>
+        { this.context.userId != '' && <PickSpecificationComponent
+        openModal={this.state.openModal} 
+        handleClose={this.handleModalClose}/> }
       </div>
     )
@@ -69,4 +109,6 @@
 }
 
+SpecificationsFilterComponent.contextType = UserContext
+
 export default SpecificationsFilterComponent
 
