Reaolving faq section

avanimathur · Jan 14, 2024 · 31129af · 31129af
1 parent b72140f
commit 31129af
Show file tree

Hide file tree

Showing 4 changed files with 77 additions and 2 deletions.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -1,3 +1,3 @@
 {
-    "liveServer.settings.port": 5501
+    "liveServer.settings.port": 5502
 }
diff --git a/faq.html b/faq.html
@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Faq section</title>
+    <style>
+        *{
+            text-decoration: none;
+            list-style: none;
+        }
+        body{
+            background-color: hsl(186, 60%, 80%);
+            margin:0px;
+            padding:0px;
+        }
+    #heading{
+       color: rgb(201, 205, 218);
+       font-weight: bolder;
+       font-style: underline;
+       background-color: black;
+       font-size:56px;
+    }
+    .question{
+        width:56vw;
+        height:149px;
+       border-radius: 5px;
+    }
+    .list{
+        margin:7px;
+        padding:5px;
+        font-size:24px;
+        margin-left: 0px;
+        background-color: antiquewhite;
+    }
+    #h2{
+        margin-left: 35px;
+    }
+    </style>
+</head>
+<body>
+    <div class="container">
+        <h1 id="heading">WELCOME TO FAQ SECTION</h1>
+        <img class="question" src="data:image/jpeg;base64,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">
+        <h2 id="h2">Let's understand how this notes app works!</h2>
+      <div class="sub-head">
+      <ul>
+        <li class="list"><details><summary>
+       Q1.What is the purpose of this app?</summary>ANS.The purpose of this app is to help you storing your important notes</details>
+        </li>
+      <li class="list"><details><summary>Q2.What is procedure to use it?</summary>ANS.It is very simple to use.Just add your text along with titles and save it.You can access it anytime on landing page</details> </li>
+      <li class="list"><details><summary>Q3.Where is it's theme changing option?</summary>ANS.It is placed very right at top of page.</details></li>
+      <li class="list"><details><summary>Q4.Can we stop the sound coming in app?</summary>ANS.Yes ,this is possible ,just click on sound icon at left of theme option.</details></li>
+      <li class="list"><details><summary>Q5.Is it possible to change  note once made? </summary>ANS.yes,after you made a note,there'll be an option coming at bottom to edit your responses.</details></li>
+        </ul>
+      </div>
+    </div>
+</body>
+</html>
diff --git a/index.html b/index.html
@@ -87,6 +87,7 @@ <h5 class="card-title" style="color: rgb(134, 153, 237);">Add a note
         <h3 style="color: rgb(134, 153, 237); margin-top: 8px;">Your Notes</h3>
         <div id="notes" class="row container-fluid"> </div>
     </div>
+    <submit id="btn"><a style="text-decoration:none" href="faq.html">FAQ'S</a></submit><!---adding faq section in  form of buttton-->
 </div>
 
 

diff --git a/style.css b/style.css
@@ -118,4 +118,19 @@ body {
     font-size: 40px;
     margin-right: 20px;
     cursor: pointer;
-  }
+  }
+  #btn{
+    margin-left:45rem;
+    padding:8px;
+    background-color: #d8d7e5;
+    font-weight: bolder;
+    border-radius:5px;
+    border:2px solid rgb(25, 24, 24);
+    width:56px;
+    cursor:pointer;
+    box-shadow:2px 2px #637cf3;
+
+  }
+ a{
+  color: white;
+ }
-Original file line number
+Diff line change
@@ Expand Up @@
             <h3 style="color: rgb(134, 153, 237); margin-top: 8px;">Your Notes</h3>
             <div id="notes" class="row container-fluid"> </div>
         </div>
+        <submit id="btn"><a style="text-decoration:none" href="faq.html">FAQ'S</a></submit><!---adding faq section in  form of buttton-->
     </div>
@@ Expand Down @@