-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathCA2.html
111 lines (98 loc) · 2.67 KB
/
CA2.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
<!DOCTYPE html>
<html>
<head>
<title>CA2: Steps taken</title>
</head>
<body>
<h1>Features of Website</h1>
<h3>Hosted on Github</h3>
URL:
<a href="https://larney11.github.io/" target="_blank" style="color=blue">
https://larney11.github.io/
</a>
<h3>No Template was used</h3>
<h3>Twitter Bootsrap features</h3>
<ul>
<li>Navigation - Collapsible Navigation Bar</li>
<li>Navigation - Scrollspy (highlights the current section in navbar)</li>
<li>Search bar</li>
<li>Grids</li>
<li>Buttons</li>
<li>Panel - Accordion</li>
<li>Panel - Collapsible panel</li>
<li>Modal</li>
<li>alerts</li>
<li>Typography</li>
<li>Glyphicon</li>
<li>Tables(hover)</li>
<li>Forms</li>
<li>Animated progress bar</li>
<li>Carousel with captions</li>
</ul>
<h2>Font-awesome used for icons</h2>
<h3>Dynamic Content</h3>
<h4>Angular.js</h4>
<ul>
<li>
Angular.js used to populate table rows from external json file in education section.
</li>
</ul>
<h4>JQuery</h4>
<ul>
<li>
JQuery used to handle switching of tabs for results in education section. (JQuery.js)
</li>
</ul>
<h4>Javascript</h4>
<ul>
<li>
Javacript used to set location on map (GoogleMap.js)
</li>
</ul>
<h2>
Section Breakdowns
</h2>
<h3>Home</h3>
<ul>
<li>Contact button that opens contact modal</li>
<li>When send button is clicked, an alert message appears</li>
</ul>
<h3>About</h3>
<ul>
<li>Contains a collapsible panel</li>
</ul>
<h3>WorkExp</h3>
<ul>
<li>Panel - accordion</li>
<li>Logo images are links to websites</li>
<li>Click button to read more</li>
<li>Buttons use font-awesome for the icons</li>
<li>Button icon changes when clicked (css file)</li>
</ul>
<h3>Education</h3>
<ul>
<li>panel - collapsible</li>
<li>Logos are links</li>
<li>Click results button to view results</li>
<li>Collapsible panel within panel</li>
<li>Year selection buttons use JQuery to open and close panels (JQuery.js)</li>
<li>Panels contain table in which each row is highlighted when hovered over</li>
<li>Table rows are populated using Angular.js which obtains data from a JSON file(Results.json).</li>
</ul>
<h3>Projects</h3>
<ul>
<li>Images have overlay that change color and change icon when hovered over (Managed in css file)</li>
<li>Click image to dispaly modal</li>
<li>Fourth year project contains carousel</li>
</ul>
<h3>Languages</h3>
<ul>
<li>Tables that contains progress bar</li>
</ul>
<h3>ContactInfo</h3>
<ul>
<li>Google maps API</li>
<li>Contact information contains social media links</li>
</ul>
</body>
</html>