Green Sock Todo list

Developer
Vinny
Size
2,877 Kb
Views
22,264
  1. Green Sock Todo list Previews
  2. Green Sock Todo list HTML Codes
  3. Green Sock Todo list CSS Codes
  4. Green Sock Todo list JS Codes

How do I make an green sock todo list?

What is a green sock todo list? How do you make a green sock todo list? This script and codes were developed by Vinny on 15 October 2022, Saturday.

Green Sock Todo list Previews
IQ Test

Green Sock Todo list - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Green Sock Todo list</title> <link rel='stylesheet prefetch' href='http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <link href='https://fonts.googleapis.com/css?family=Lobster+Two' rel='stylesheet' type='text/css'> <link href='https://fonts.googleapis.com/css?family=Comfortaa' rel='stylesheet' type='text/css'>
<div ng-app="myApp" class="container"> <div ng-controller="mainCtrl" class="main-div row text-center center-block"> <h1 id="title">My To-Do List</h1> <div class="app-contain col-md-8 col-md-offset-2"> <form role="form" ng-submit="addTodo()"> <label for="add-todo">Add to the list:</label> <input type="text" class="form-control" ng-model="todo"> <button class="btn btn-add center-block">Add</button> </form> <!-- todo list --> <div id="sortable" ng-repeat="todo in todos"> <div class="list-item input-group"> <input ng-model="todo" type="text" class="grab form-control" /> <div class="input-group-addon"> <button class="btn btn-danger" ng-click="deleteTodo($index)">x</button> </div> </div> </div> <!-- end repeat div --> </div> <!--todo list--> </div>
</div> <script src='http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.14/angular.min.js'></script>
<script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='http://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js'></script>
<script src='http://cdnjs.cloudflare.com/ajax/libs/gsap/1.16.1/TweenMax.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Green Sock Todo list - Script Codes CSS Codes

body { font-family: 'Comfortaa', cursive; background: url("https://images.duckduckgo.com/iu/?u=http%3A%2F%2Fwww.pixeden.com%2Fmedia%2Fk2%2Fgalleries%2F136%2F002-subtle-light-pattern-background-texture.jpg&f=1");
}
.input-group-addon { padding: 0px;
}
form { margin-bottom: 50px; margin-top: 70px;
}
label{ font-size: 1.4em;
}
.btn-add { margin-top: 4%; background-color: #F79EA2; border: 2px solid white; color: #fff; font-weight: bold;
}
.btn-danger { border-radius: 0px;
}
.input-group-addon { border: none;
}
.grab { cursor: move;
}
#title { position: relative; left:0; right:0; margin:0 auto; width: 60.5%; background-color: rgb(247, 158, 162); left: -820px; font-family: 'Lobster Two', cursive;
}
.main-div { background-color: rgb(247, 158, 162); width: 65%; padding-top: 7%; padding-bottom: 7%; margin-top: 4%; margin-bottom: 4%;
}
.app-contain { background-color: transparent;
}

Green Sock Todo list - Script Codes JS Codes

$(window).load(function() { TweenMax.to("#title", 2, { left: "0px", backgroundColor: "#F7F4F4", paddingTop: "2%", paddingBottom: "2%", rotation: 360, ease:Back.easeOut }); TweenMax.staggerFrom(".list-item", 2,{ x:900, delay:2 },0.3);
});
(function() { //sortables var app = angular.module("myApp", []); app.controller('mainCtrl', function($scope) { $scope.todos = [ 'Eat', 'Sleep', 'Code' ]; $scope.addTodo = function() { if ($scope.todo != "") { $scope.todos.push($scope.todo); $scope.todo = " "; } } $scope.deleteTodo = function($index) { $scope.todos.splice($index, 1); } });
}()); //end closure
Green Sock Todo list - Script Codes
Green Sock Todo list - Script Codes
Home Page Home
Developer Vinny
Username vinnyA3
Uploaded October 15, 2022
Rating 3
Size 2,877 Kb
Views 22,264
Do you need developer help for Green Sock Todo list?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Vinny (vinnyA3) Script Codes
Name
Svg-play
Your Favorite Twitch App
Raw JS Image Slider
A Pen by Vinny
CSS Binary Sunset on Tatooine
Batman Emblem in Pure CSS - chrome tested only
Tic Tac Toe Bro
Rotating CSS Cube
Pure CSS Fullscreen Image Slider
CSS Animations and Effects
Create amazing marketing copy with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!