diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000000000000000000000000000000000000..257d1bf42def038e03cf0600170d56bee06ea841
Binary files /dev/null and b/.DS_Store differ
diff --git a/client/ideaBank.css b/client/ideaBank.css
index f17104547041a53868e7b16c0d574783924b9e23..1462392c75705764780073cdfa6e0c37d5faec2b 100644
--- a/client/ideaBank.css
+++ b/client/ideaBank.css
@@ -104,3 +104,63 @@ a {
background-color:rgba(240, 240, 240, 0.635);
}
+/*CSS for filer and search bar*/
+.searchBar {
+ width: 90vw;
+ height: 8vh;
+ background-color: #dcd9db;
+ display: flex;
+}
+
+
+.searchBarField input[type=text] {
+}
+
+/* Dropdown Button */
+.dropdownButton {
+ background-color: #04AA6D;
+ color: rgb(198, 86, 86);
+ padding: 20px;
+ height: 8vh;
+ width: 5%s;
+ font-size: 16px;
+ margin-left: 7vw;
+ margin-right: 7vw;
+ border: none;
+ display: flex;
+ }
+
+/* The container <div> - needed to position the dropdown content */
+.dropdownSearchBar {
+ position: relative;
+ display: inline-block;
+ }
+
+ /* Dropdown Content (Hidden by Default) */
+.dropdownContent {
+ display: none;
+ position: absolute;
+ background-color: #f1f1f1;
+ min-width: 160px;
+ box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+ z-index: 1;
+ }
+
+ /* Links inside the dropdown */
+.dropdownContent a {
+ color: rgb(159, 40, 40);
+ padding: 12px 16px;
+ text-decoration: none;
+ display: block;
+ }
+
+/* Show the dropdown menu on hover. ISNT WORKIGN. FIX LATER */
+.dropdown:hover .dropdownContent {
+ display: block;
+ }
+/* Change color of dropdown links on hover */
+ .dropdownContent a:hover {background-color: #ddd;}
+
+
+ /* Change the background color of the dropdown button when the dropdown content is shown */
+ .dropdownButton:hover .dropdownButton {background-color: #3e8e41;}
\ No newline at end of file
diff --git a/client/ideaBank.html b/client/ideaBank.html
index 52dfb0ef678350189ea8b91431714345f7fdf3da..c7c60fcb54cf266c7f8d8621736847acf320c9de 100644
--- a/client/ideaBank.html
+++ b/client/ideaBank.html
@@ -62,9 +62,31 @@
</div>
</div>
+ <div>
+ <div class="searchBar">
+ <input type="text" placeholder="Search">
+ <div class="dropdownFilterBar">
+ <button class="dropdownButton">DropDown1</button>
+ <div class="dropdownContent">
+ <a href="#">Link 1</a>
+ <a href="#">Link 2</a>
+ <a href="#">Link 3</a>
+ </div>
+ </div>
+ <div class="dropdownSortBar">
+ <button class="dropdownButton">DropDown2</button>
+ <div class="dropdownContent">
+ <a href="#">Link 1</a>
+ <a href="#">Link 2</a>
+ <a href="#">Link 3</a>
+ </div>
+ </div>
+ </div>
+
<div id="IdeaBankContainer" class="container-fluid">
</div>
+ </div>
</div>
diff --git a/client/ideaBank.ts b/client/ideaBank.ts
index d9d3d31fd57aadada2983ef7beecfae8a1ba6519..eaf6eeeac41c89999f8c2ce22462bc75cbeae577 100644
--- a/client/ideaBank.ts
+++ b/client/ideaBank.ts
@@ -16,7 +16,8 @@ class IdeaCard {
this.upvoteCount = upvoteCount;
this.id = id;
}
-
+
+
generateHTML(): string {
return `<div class="totalExpandedIdeaCard">
<div class="ideaCard">
diff --git a/client/index.html b/client/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..c047ef6166d5de3486f5bd1a5b4f5f51258167bc
--- /dev/null
+++ b/client/index.html
@@ -0,0 +1,20 @@
+<!--Hej-->
+<!doctype html>
+<html lang="en">
+
+<head>
+ <!-- Required meta tags -->
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+
+
+ <title>Region Östergötaland - Group 3 </title>
+</head> <!-- Navbaren med logan och de olika alternativen -->
+<body>
+ <header>Region Östergötaland - Group 3</header>
+ <div style="width: 80%; margin-left: 10%; position: absolute; height: 100%; background-color: rgb(152, 220, 237); text-align: center">
+ <div style ="width: 30%; height: 30%; background-color: blue; border-radius: 10%;" > Ideer</div>
+ <div style ="width: 30%; height: 30%; background-color: blueviolet; border-radius: 10%"> Project</div>
+ <div style ="width: 30%; height: 30%; background-color: yellow; border-radius: 10%;"> Kunskapsbaken</div>
+ </div>
+</body>
\ No newline at end of file