diff --git a/src/components/Event/Event.module.css b/src/components/Event/Event.module.css
index 22c5fe8..021f7bd 100644
--- a/src/components/Event/Event.module.css
+++ b/src/components/Event/Event.module.css
@@ -41,6 +41,7 @@
.eventContent {
display: flex;
+ width: 100%;
}
.eventTitle {
diff --git a/src/components/SearchBar/SearchBar.jsx b/src/components/SearchBar/SearchBar.jsx
index 50c3566..d79dfde 100644
--- a/src/components/SearchBar/SearchBar.jsx
+++ b/src/components/SearchBar/SearchBar.jsx
@@ -65,36 +65,37 @@ function SearchBar() {
) : null}
-
- {searchResults.map((result, i) => (
- (location.pathname.includes("events")) ? (
-
-
-
- {result.image == null ? (
-

- ) : (
-

- )}
+
+ {searchResults.map((result, i) => (
+ (location.pathname.includes("events")) ? (
+
+
+
+ {result.image == null ? (
+

+ ) : (
+

+ )}
+
+
{result.name}
-
{result.name}
-
-
- ) : location.pathname.includes("volunteers") ? (
-
-
-
- {result.image == null ? (
-

- ) : (
-

- )}
+
+ ) : location.pathname.includes("volunteers") ? (
+
+
+
+ {result.image == null ? (
+

+ ) : (
+

+ )}
+
+
{result.name} {result.lastname}
-
{result.name} {result.lastname}
-
-
- ) : null
- ))}
+
+ ) : null
+ ))}
+
);
}
diff --git a/src/components/SearchBar/SearchBar.module.css b/src/components/SearchBar/SearchBar.module.css
index 579af04..a58f1de 100644
--- a/src/components/SearchBar/SearchBar.module.css
+++ b/src/components/SearchBar/SearchBar.module.css
@@ -1,6 +1,6 @@
.searchBarContainer{
position: fixed;
- top: 10rem;
+ top: 4rem;
z-index: 100;
width: 60%;
background: #fff;
@@ -11,6 +11,11 @@
display: flex;
}
+.elementList {
+ max-height: 60vh;
+ overflow-y: auto;
+}
+
.eventImageDiv {
@@ -72,3 +77,10 @@
.searchBarForm input:focus{
outline: none;
}
+
+
+@media screen and (max-width: 480px) {
+ .searchBarContainer{
+ width: 80%;
+ }
+}
diff --git a/src/components/ToolBar/ToolBar.module.css b/src/components/ToolBar/ToolBar.module.css
index 79e8a03..1b53950 100644
--- a/src/components/ToolBar/ToolBar.module.css
+++ b/src/components/ToolBar/ToolBar.module.css
@@ -20,6 +20,7 @@
.filterMenu{
padding: 5px 5px 5px 5px;
+ width: fit-content;
}
.createButton, .searchButton, .sortButton {
@@ -27,9 +28,9 @@
align-items: center;
justify-content: center;
border: none;
- border-radius: 50%;
- width: 55px;
- height: 55px;
+ border-radius: 50% !important;
+ width: 55px !important;
+ height: 55px !important;
transition: all 0.5s ease;
}
@@ -72,6 +73,15 @@
@media screen and (max-width: 768px) {
+ .createButton,
+ .searchButton,
+ .sortButton {
+ flex: 0 0 55px;
+ width: 55px !important;
+ height: 55px !important;
+ }
+
+
.eventsButtons {
flex-direction: row;
position: relative;