Add search input in Badges and Docs pages cs-internship#47

Ali-Sdg90 · Mar 1, 2024 · d78ff5f · d78ff5f
1 parent c67f8fe
commit d78ff5f
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 2 deletions.
diff --git a/...stallineSociety/Client/CrystallineSociety.Client.Core/Components/OrganizationBadges.razor b/...stallineSociety/Client/CrystallineSociety.Client.Core/Components/OrganizationBadges.razor
@@ -2,7 +2,24 @@
 @inherits AppComponentBase
 
 
-<div class="container-fluid pb-3">
+<div class="container-fluid pb-6">
+
+    <div class="container mt-1 mb-4">
+        <div class="row justify-content-center">
+            <div class="col-md-6">
+                <form class="d-flex">
+                    <input class="form-control me-2"
+                           type="search"
+                           placeholder="Search"
+                           aria-label="Search" />
+                    <button class="btn btn-outline-primary" type="submit">
+                        Search
+                    </button>
+                </form>
+            </div>
+        </div>
+    </div>
+
     <div class="d-grid gap-3" style="grid-template-columns: 1fr 2fr;">
         <div class="bg-body-tertiary border rounded-3">
             <BadgeTree BadgeBundleDto="Bundle" BadgeDtoCallBack="@GetBadge"></BadgeTree>

diff --git a/...rystallineSociety/Client/CrystallineSociety.Client.Core/Components/OrganizationDocs.razor b/...rystallineSociety/Client/CrystallineSociety.Client.Core/Components/OrganizationDocs.razor
@@ -1,7 +1,24 @@
 @using CrystallineSociety.Shared.Dtos.BadgeSystem
 @inherits AppComponentBase
 
-<div class="container-fluid pb-3">
+<div class="container-fluid pb-6">
+
+    <div class="container mt-1 mb-4">
+        <div class="row justify-content-center">
+            <div class="col-md-6">
+                <form class="d-flex">
+                    <input class="form-control me-2"
+                           type="search"
+                           placeholder="Search"
+                           aria-label="Search" />
+                    <button class="btn btn-outline-primary" type="submit">
+                        Search
+                    </button>
+                </form>
+            </div>
+        </div>
+    </div>
+
     <div class="d-grid gap-3" style="grid-template-columns: 1fr 2fr;">
         <div class="bg-body-tertiary border rounded-3">
             <ProgramDocumentTree ProgramDocuments="_programDocuments" ProgramDocumentCallBack="@GetProgramDocument"></ProgramDocumentTree>