Merge pull request #16 from codedstrings/fix/overflow

feat: add overflow handling for better scrolling experience

Author: codedstrings

src/assets/styles.css

@@ -30,6 +30,7 @@ html,
 body {
   height: 100%;
   margin: 0;
+  overflow: hidden;
 }
 
 body {
@@ -65,6 +66,7 @@ body {
   display: flex;
   flex-grow: 1;
   width: 100%;
+  overflow: hidden;
 }
 .content>.sidebar {
   flex: 1;
@@ -74,13 +76,17 @@ body {
 .projects-wrapper {
   display: flex;
   flex-direction: column;
+  height: 100%;
 }
 .projects-header{
   font-size: 1.2rem;
   text-transform: uppercase;
   font-weight: bold;
 }
 /* list project section */
+.projects-list{
+  overflow-y: auto;
+}
 .projects-list, .button-add-project{
   padding-left: 5px;
 }
@@ -208,6 +214,10 @@ body {
   text-decoration: line-through;
   opacity: 0.6;
 }
+.tasks-wrapper {
+  height: calc(100% - 60px); /* Subtract space for the "Add Task" button */
+  overflow-y: auto;
+}
 /* New Task Button */
 .tasks-wrapper, .new-todo-btn-wrapper{
   padding-left: 10px;