-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
131 lines (126 loc) · 8.91 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="description" content="Generate random T-Ball/Youth Baseball lineups and positions. Completely random, editable, printable, and free!">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.0/animate.min.css">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="queries.css">
<link rel="shortcut icon" href="favicon.ico">
<title>Free T-Ball/Youth Baseball Random Lineups</title>
</head>
<body>
<!-- HOME SECTION -->
<header id="home-section">
<div class="home-inner container">
<div class="row">
<div class="col text-center py-5">
<img src="baseball_logo.jpg" class="img-fluid rounded mb-5" height="250px" width="250px">
<div class="jumbotron text-center">
<h1 class="display-4">Welcome to Free Random T-Ball/Youth Baseball Lineups!</h1>
<h3>Create randomized positions and lineups to get ready for gameday!</h3>
<p class="lead">How it works:</p>
<ul style='list-style: none'>
<li>1. Enter in your team name, number of innings, whether there's a catcher or not, your players names, and click the Generate Lineups button.</li>
<li>2. You'll get completely randomized lineups and positions for the amount of innings you entered. You can make any changes by clicking the Edit button, or click in an individual field just by clicking in it.</li>
<li>3. When your satisfied with your randomized lineups and positions, click the Print Lineups to print them up and bring copies for you and your coaches on gameday!</li>
</ul>
</div>
<div>
<div class="col-lg-9 col-md-12 float-right mb-5">
<div class="card border-dark text-center">
<div class="card-header bg-dark text-light">Lineup Generator</div>
<div class="card-body bg-light">
<form>
<div class="form-group">
<div class="d-inline">
<label for="name">Team Name</label>
<input type="text" class="form-control mb-2" id="js__teamName">
<div class="row">
<div class="col-md-6">
<label for="">Number of Innings</label>
<select class="form-control" id="js__numOfInnings">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
</select>
</div>
<div class="col-md-6">
<label for="">Catcher?</label>
<select class="form-control" id="js__catcher">
<option>No</option>
<option>Yes</option>
</select>
</div>
</div>
</div>
<label for="name">Player Name</label>
<input type="text" class="form-control mb-2 js__player" id="player1">
<input type="text" class="form-control mb-2 js__player" id="player2">
<input type="text" class="form-control mb-2 js__player" id="player3">
<input type="text" class="form-control mb-2 js__player" id="player4">
<input type="text" class="form-control mb-2 js__player" id="player5">
<input type="text" class="form-control mb-2 js__player" id="player6">
<input type="text" class="form-control mb-2 js__player" id="player7">
<input type="text" class="form-control mb-2 js__player" id="player8">
<input type="text" class="form-control mb-2 js__player" id="player9">
<input type="text" class="form-control mb-2 js__player" id="player10">
<input type="text" class="form-control mb-2 js__player" id="player11">
<input type="text" class="form-control mb-2 js__player" id="player12">
<input type="text" class="form-control mb-2 js__player" id="player13">
<input type="text" class="form-control mb-2 js__player" id="player14">
<input type="text" class="form-control mb-2 js__player" id="player15">
</div>
</form>
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#lineupsModal" id="btnLineups">Generate Lineups</button>
</div>
<div class="card-footer bg-dark text-light py-4"></div>
</div>
</div>
<div class="col-lg-3 col-md-12 float-left">
<div class="list-group">
<li class="list-group-item bg-dark text-light">Quick Links</li>
<a href="http://lnal.com" class="list-group-item list-group-item-action">
Back to LNAL.com
</a>
<li class="list-group-item bg-dark"></li>
</div>
</div>
</div>
</div>
</div>
</div>
</header>
<!-- LINEUPS MODAL -->
<div class="modal fade text-dark" id="lineupsModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="js__displayTeam"></h5>
<button class="close" data-dismiss="modal">
<span>×</span>
</button>
</div>
<div class="modal-body">
<div class="table_user_data"></div>
<div class="modal-footer">
<button class="btn btn-primary btn-block js__printTable">Print Lineups</button>
</div>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
<script src="jquery.waypoints.min.js"></script>
<script src="script.js"></script>
</body>
</html>