-
Notifications
You must be signed in to change notification settings - Fork 14
/
Copy pathlab.html
131 lines (110 loc) · 3.78 KB
/
lab.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>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title> CSci 127 Lab </title>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<link rel="icon" type ="image/png" href="./images/favicon.png">
<style>
body {
background-color: #d4d3e9ce;
width: 100%;
margin: 0;
}
.flex-child {
text-align: center;
}
#graph {
position: relative;
width: 70%;
margin-left: 15%;
margin-bottom: 100px;
height: 60vh;
}
#daily-container {
height: 100%;
}
#info {
padding: 20px;
}
#info,
h2,
p {
font-family: 'Roboto', sans-serif;
}
.btn {
margin-top: 20px;
margin-bottom: 20px;
width: 300px;
height: 45px;
font-family: 'Roboto', sans-serif;
font-size: 11px;
text-transform: uppercase;
letter-spacing: 2.5px;
font-weight: 500;
color: rgb(0, 0, 0);
background-color: rgb(255, 255, 255);
border: 0.5px solid rgb(150, 136, 170);
border-radius: 45px;
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
transition: all 0.3s ease 0s;
cursor: pointer;
outline: none;
}
.btn:hover {
border: none;
background-color: rgb(138, 115, 202);
box-shadow: 0px 5px 10px rgb(24, 24, 24);
color: #fff;
}
.btn.calendar {
color: #fff;
background-color: #1f1d47ce;
border: none;
}
@media only screen and (max-width:1024px) {
/* For mobile phones: */
#graph {
position: relative;
width: 90%;
margin-left: 5%;
margin-bottom: 50px;
height: 60vh;
}
button {
width: 220px;
font-size: 10px;
letter-spacing: 2px;
margin-top: 10px;
margin-bottom: 10px;
}
#info {
font-size: 13px;
}
}
</style>
</head>
<body>
<div class = "flex-child info" id = "info">
<h2> Welcome to CSci 127! </h2>
<p> This webpage serves to provide you with quick information about the 1001E lab and assignments for the current week. </p>
<p> <b> Help Email: </b> [email protected] </p>
<p> <b> Lab Hours: </b> Mon-Fri, 11 AM to 5 PM when classes are in session </p>
<div>
<button class="btn website" onclick="window.open('https://huntercsci127.github.io/f21.html','_blank')"> Official Course Website </button>
<button class="btn schedule" onclick="window.open('https://huntercsci127.github.io/files/LabScheduleF21.pdf','_blank')"> Complete Schedule </button> <br />
<button class="btn topics" onclick="window.open('https://huntercsci127.github.io/f21/quizzes.html','_blank')"> Quiz & Code Review Topics </button>
<button class="btn ps" onclick="window.open('https://huntercsci127.github.io/f21/ps.html','_blank')"> Programming Assignments </button> <br />
<button class="btn calendar" onclick="window.open('https://calendar.google.com/calendar/embed?src=tbstgocdjm7hihfcgrcgehuda4%40group.calendar.google.com&ctz=America%2FNew_York','_blank')"> Google Calendar </button>
</div>
</div>
<div class = "flex-child graph" id = "graph" >
<canvas id='daily-container'></canvas>
</div>
<script type="text/javascript" src="./scripts/lab.js"> </script>
<script async defer src="https://apis.google.com/js/api.js"
onload="this.onload=function(){};handleClientLoad()"
onreadystatechange="if (this.readyState === 'complete') this.onload()">
</script>
</body>
</html>