Style note input field and individual notes

burakunal28 · Aug 24, 2024 · 53ae630 · 53ae630
1 parent 9a3eeac
commit 53ae630
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 3 deletions.
diff --git a/css/style.css b/css/style.css
@@ -1,5 +1,5 @@
 /* Set the background color for the entire page */
-html body {
+html, body {
     background-color: #F8F0E5;
 }
 

diff --git a/index.html b/index.html
@@ -10,7 +10,7 @@
     <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
     <link href="https://getbootstrap.com/docs/5.3/assets/css/docs.css" rel="stylesheet">
 </head>
-<body class="font-monospace">
+<body id="app-body" class="font-monospace">
     <div class="container text-primary">
         <!-- App title -->
         <h2 class="fw-bolder">Colorful Notes</h2>

diff --git a/js/script.js b/js/script.js
@@ -11,8 +11,16 @@ const deleteAllButton = document.getElementById('deleteAllButton');
 // Add event listener for delete all button
 deleteAllButton.addEventListener('click', deleteAllNotes);
 
-// Load saved notes when the DOM is fully loaded
+// Function to set the background color
+function setBackgroundColor() {
+    const appBody = document.getElementById('app-body');
+    appBody.style.backgroundColor = '#F8F0E5';
+}
+
+// Call setBackgroundColor when the DOM is fully loaded
 window.addEventListener('DOMContentLoaded', () => {
+    setBackgroundColor();
+
     const savedNotes = JSON.parse(localStorage.getItem('notes')) || [];
 
     // If no saved notes, create default notes