-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
133 lines (123 loc) · 6.34 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
132
133
<!DOCTYPE html>
<html>
<head>
<!-- TODO: Include Font Awesome file here -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"/>
<!-- TODO: Include Google Fonts file here -->
<link href="https://fonts.googleapis.com/css?family=Montez&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Ubuntu+Mono&display=swap" rel="stylesheet"/>
<link rel="stylesheet" type="text/css" media="screen" href="./styles/index.css"/>
<link rel="stylesheet" type="text/css" media="screen" href="./styles/common.css"/>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
</head>
<body>
<!-- TODO: Include all your code for the header and home page here -->
<header class="header">
<div>
<p id="headingScribbler">
ScriBBler
</p>
<p id="subheading">Explore, Imagine, Create</p>
</div>
<div class="btn-wrapper">
<button type="button" id="signUpBtn" data-toggle="modal" data-target="#signUpModal">Sign Up</button>
<button id="signInBtn" data-toggle="modal" data-target="#signInModal">Sign In</button>
</div>
<div id="signUpModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<p class="modal-title">Get Started</p>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<form>
<div class="form-group">
<label for="name">Name</label>
<input type="text" class="form-control" id="name" aria-describedby="name" placeholder="Enter your name" required>
</div>
<div class="form-group">
<label for="username">Username</label>
<input type="text" class="form-control" id="username" aria-describedby="username" placeholder="Enter your username" required>
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" class="form-control" id="password" placeholder="Enter your password" required>
</div>
<div class="form-group">
<label for="reenterPassword">Confirm Password</label>
<input type="password" class="form-control" id="reenterPassword" placeholder="Re-enter your password" required>
</div>
<button type="submit" id="submitSignUpBtn" class="btn btn-primary btn-lg btn-block">Sign Up</button>
</form>
</div>
</div>
</div>
</div>
<div id="signInModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<p class="modal-title">Welcome Back</p>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<form>
<div class="form-group">
<label for="username-signin">Username</label>
<input type="text" class="form-control" id="username-signin" aria-describedby="username" placeholder="Enter your username" required>
</div>
<div class="form-group">
<label for="password-signin">Password</label>
<input type="password" class="form-control" id="password-signin" placeholder="Enter your password" required>
</div>
<button type="submit" id="submitSignInBtn" class="btn btn-primary btn-lg btn-block">Sign In</button>
<p class="not-member">
Not a member? <span id="signUpLink" data-toggle="modal" data-target="#signUpModal" data-dismiss="modal">Sign Up</span>
</p>
</form>
</div>
</div>
</div>
</div>
</header>
<section>
<div class="post-buttons">
<button id="all-post-btn" onclick="location.href='./html/postslist.html'">All Posts</button>
<button id="create-post-btn" data-toggle="modal" data-target="#createPostModal">Create Post</button>
</div>
<div id="createPostModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<p class="modal-title">Pen Your Post</p>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<form>
<div class="form-group">
<label for="postTitle">Title</label>
<input type="text" class="form-control" id="postTitle" placeholder="Enter title of your post">
</div>
<div class="form-group">
<label for="contents">Contents</label>
<textarea class="form-control" id="contents" rows="10" placeholder="Enter the contents of your post"></textarea>
</div>
<div class="create-btn-div">
<button type="submit" class="btn btn-success" id="createPostApi">Create</button>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
<script src="./scripts/index.js"></script>
</body>
</html>