diff --git a/Angular-JS-Projects/Basic/Task-Manager/README.md b/Angular-JS-Projects/Basic/Task-Manager/README.md new file mode 100644 index 000000000..13a3fe8ed --- /dev/null +++ b/Angular-JS-Projects/Basic/Task-Manager/README.md @@ -0,0 +1,38 @@ +

📝 Task Manager 📝

+ + + +

Tech Stack Used 🎮

+ + +![HTML5](https://img.shields.io/badge/html5-%23E34F26.svg?style=for-the-badge&logo=html5&logoColor=white) +![CSS3](https://img.shields.io/badge/css3-%231572B6.svg?style=for-the-badge&logo=css3&logoColor=white) +![Angular.js](https://img.shields.io/badge/angular.js-%23E23237.svg?style=for-the-badge&logo=angularjs&logoColor=white) + +![Line](https://github.com/Avdhesh-Varshney/WebMasterLog/assets/114330097/4b78510f-a941-45f8-a9d5-80ed0705e847) + + + +## :zap: How to run it? 🕹ī¸ + +- Fork the project and run the `index.html` file directly on any browser. + + + +## :zap: Screenshots 📸 + + +![Line](screenshot.webp) + + + +

Developed By Mehul Prajapati đŸ‘Ļ

+

+ + + +

+ +

Happy Coding 🧑‍đŸ’ģ

+ +

Show some  â¤ī¸  by  đŸŒŸ  this repository!

diff --git a/Angular-JS-Projects/Basic/Task-Manager/app.js b/Angular-JS-Projects/Basic/Task-Manager/app.js new file mode 100644 index 000000000..2a49e01e6 --- /dev/null +++ b/Angular-JS-Projects/Basic/Task-Manager/app.js @@ -0,0 +1,21 @@ +angular.module('taskManagerApp', []) +.controller('TaskController', function() { + var vm = this; + + vm.tasks = []; + vm.newTask = ''; + + vm.addTask = function() { + if (vm.newTask) { + vm.tasks.push({ name: vm.newTask, editing: false }); + vm.newTask = ''; + } + }; + + vm.deleteTask = function(task) { + var index = vm.tasks.indexOf(task); + if (index !== -1) { + vm.tasks.splice(index, 1); + } + }; +}); diff --git a/Angular-JS-Projects/Basic/Task-Manager/index.html b/Angular-JS-Projects/Basic/Task-Manager/index.html new file mode 100644 index 000000000..d1ecded47 --- /dev/null +++ b/Angular-JS-Projects/Basic/Task-Manager/index.html @@ -0,0 +1,29 @@ + + + + + + Task Manager + + + + + +
+

Task Manager

+ + + + +
+ + diff --git a/Angular-JS-Projects/Basic/Task-Manager/screenshot.webp b/Angular-JS-Projects/Basic/Task-Manager/screenshot.webp new file mode 100644 index 000000000..86c8a2598 Binary files /dev/null and b/Angular-JS-Projects/Basic/Task-Manager/screenshot.webp differ diff --git a/Angular-JS-Projects/Basic/Task-Manager/style.css b/Angular-JS-Projects/Basic/Task-Manager/style.css new file mode 100644 index 000000000..21bb201d6 --- /dev/null +++ b/Angular-JS-Projects/Basic/Task-Manager/style.css @@ -0,0 +1,82 @@ +body { + font-family: 'Arial', sans-serif; + background-color: #f0f8ff; + padding: 20px; +} + +.container { + max-width: 600px; + margin: 0 auto; + background: #ffffff; + padding: 20px; + border-radius: 8px; + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); +} + +h1 { + text-align: center; + color: #333; + margin-bottom: 20px; +} + +input[type="text"] { + width: calc(100% - 100px); + padding: 12px; + margin-right: 10px; + border: 1px solid #ddd; + border-radius: 4px; + font-size: 16px; + transition: border-color 0.3s; +} + +input[type="text"]:focus { + border-color: #007bff; + outline: none; +} + +button { + padding: 12px 15px; + background-color: #007bff; + color: #fff; + border: none; + border-radius: 4px; + cursor: pointer; + font-size: 16px; + transition: background-color 0.3s; + margin-top: 10px; /* Added margin to create space above the button */ +} + +button:hover { + background-color: #0056b3; +} + + +ul { + list-style-type: none; + padding: 0; +} + +li { + display: flex; + align-items: center; + justify-content: space-between; + padding: 10px; + margin: 8px 0; + background-color: #f9f9f9; + border: 1px solid #e3e3e3; + border-radius: 4px; + transition: background-color 0.3s; +} + +li:hover { + background-color: #e9ecef; +} + +span { + flex: 1; + color: #333; +} + +button { + margin-left: 10px; +} diff --git a/Angular-JS-Projects/README.md b/Angular-JS-Projects/README.md index 40496bc09..0edeb7df1 100644 --- a/Angular-JS-Projects/README.md +++ b/Angular-JS-Projects/README.md @@ -28,7 +28,7 @@ | 1 | [Quick Notes](./Basic/Quick-Notes) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) | | 2 | [Train Booking Website](./Intermediate/Train-Website/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) | | 3 | [Contact Manager](./Advanced/Contact-Manager/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) | - +| 4 | [Task Manager](./Basic/Task-Manager) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |