github · zhifanl · Dec 13, 2020 · Dec 13, 2020 · Dec 13, 2020 · Dec 13, 2020
diff --git a/CNAME b/CNAME
@@ -0,0 +1 @@
+www.zhifanli.website
diff --git a/_config.yml b/_config.yml
@@ -28,31 +28,36 @@ projects:
     projects:
     # - repo-name
 
-# social_media:
+social_media:
   # behance: your_username
   # dribbble: your_username
-  # facebook: your_username
+  # facebook: Zhifan Li
   # hackerrank: your_username
-  # instagram: your_username
+    instagram: zhifan_li
   # keybase: your_username
-  # linkedin: your_username
+    linkedin: zhifan-tom-li-7198331a7
+
   # mastodon: your_username
   # medium: your_username
   # stackoverflow: your_user_id
   # telegram: your_username
   # twitter: your_username
   # unsplash: your_username
   # vk: your_username
-  # website: http://your_website_url
+    website: https://www.zhifanli.website
   # youtube: your_username
 
 topics:
-  - name: CSS
-    web_url: https://github.com/topics/css
-    image_url: https://raw.githubusercontent.com/github/explore/6c6508f34230f0ac0d49e847a326429eefbfc030/topics/css/css.png
-
-  - name: Web design
-
-  - name: Sass
-    web_url: https://github.com/topics/sass
-    image_url: https://raw.githubusercontent.com/github/explore/6c6508f34230f0ac0d49e847a326429eefbfc030/topics/sass/sass.png
+  - name: C++
+    web_url: https://github.com/topics/cpp
+    image_url: https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/cpp/cpp.png
+
+  - name: Algorithm
+    web_url:  https://github.com/topics/algorithm
+    image_url: https://pandorafms.com/blog/wp-content/uploads/2018/05/what-is-an-algorithm-featured.png
+
+  - name: HTML
+    web_url: https://github.com/topics/html
+    image_url: https://raw.githubusercontent.com/github/explore/6c6508f34230f0ac0d49e847a326429eefbfc030/topics/html/html.png
+courses:
+
diff --git a/_includes/.DS_Store b/_includes/.DS_Store
diff --git a/_includes/courses.html b/_includes/courses.html
@@ -0,0 +1,149 @@
+  <!doctype html>
+<html lang="en">
+
+<head>
+
+	<!-- Bootstrap CSS -->
+	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
+		integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
+	<link href="../CSS/custom.css" rel="stylesheet">
+</head>
+
+<body>
+
+	<div class="container text-center">
+		<h1 class="display-4" class="animate__animated animate__pulse">Courses</h1>
+		<div class="lead text-left">
+			<p>
+				Here are the courses I have taken and planning to take.
+			</p>
+		</div>
+		<hr>
+
+		<div id="accordion">
+			<div class="card">
+				<div class="card-header" id="headingOne">
+					<h5 class="mb-0">
+						<button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne"
+							aria-controls="collapseOne">
+							Bachelor in Software Engineering
+						</button>
+					</h5>
+				</div>
+
+				<div id="collapseOne" class="collapse" aria-labelledby="headingOne" data-parent="#accordion">
+					<div class="card-body">
+						<table class="table table-bordered table-hover">
+							<thead>
+								<tr class="academic_year">
+									<th colspan="4" scope="colgroup">Year 1 (2019 - 2020)</th>
+								</tr>
+								<tr class="academic_semester">
+									<th class="w-25" scope="col">FALL 2019</th>
+									<th class="w-25" scope="col">WINTER 2020</th>
+									<th class="w-25" scope="col">SPRING 2020</th>
+									<th class="w-25" scope="col">SUMMER 2020</th>
+								</tr>
+							</thead>
+							<tbody>
+								<tr>
+									<td title="Engineering Design and Communication">ENGG 200</td>
+									<td title="General Chemistry for Engineers">CHEM 209</td>
+									<td title="Programming Fundamentals for Software and Computer">ENSF 337</td>
+									<td title="Discrete Mathematics">MATH 271</td>
+								</tr>
+								<tr>
+									<td title="Computing for Engineers">ENGG 233</td>
+									<td title="Engineering Statics">ENGG 202</td>
+									<td title=""></td>
+									<td title=""></td>
+								</tr>
+								<tr>
+									<td title="Linear Methods I">MATH 211</td>
+									<td title="Fundamentals of Electrical Circuits and Machines">ENGG 225</td>
+									<td title=""></td>
+									<td title=""></td>
+								</tr>
+								<tr>
+									<td title="Calculus for Engineers and Scientists">MATH 275</td>
+									<td title="Multivariable Calculus for Engineers and Scientists">MATH 277</td>
+									<td title=""></td>
+									<td title=""></td>
+								</tr>
+								<tr>
+									<td title="Behaviour of Liquids, Gases and Solids">ENGG 201</td>
+									<td title="Electricity and Magnetism (for students in Engineering)">PHYS 259</td>
+									<td title=""></td>
+									<td title=""></td>
+								</tr>
+							</tbody>
+						</table>
+						<table class="table table-bordered table-hover">
+							<thead>
+								<tr class="academic_year">
+									<th colspan="4" scope="colgroup">Year 2 (2020 - 2021)</th>
+								</tr>
+								<tr class="academic_semester">
+									<th class="w-25" scope="col">FALL 2020</th>
+									<th class="w-25" scope="col">WINTER 2021</th>
+									<th class="w-25" scope="col">SPRING 2021</th>
+									<th class="w-25" scope="col">SUMMER 2021</th>
+								</tr>
+							</thead>
+							<tbody>
+								<tr>
+									<td title="Digital Circuits">ENEL 353</td>
+									<td title="Signals and Transforms">ENEL 327</td>
+									<td title=""></td>
+									<td title=""></td>
+								</tr>
+								<tr>
+									<td title="Probability And Statistics For Engineers">ENGG 319</td>
+									<td title="	Computer Organization">ENCM 369</td>
+									<td title=""></td>
+									<td title=""></td>
+								</tr>
+								<tr>
+									<td title="Differential Equations for Engineers and Scientists">MATH 375</td>
+									<td title="Data Structures, Algorithms, and Their Applications">CPSC 319</td>
+									<td title=""></td>
+									<td title=""></td>
+								</tr>
+								<tr>
+									<td title="Acoustics, Optics and Modern Physics (for students in Engineering)">PHYS
+										365</td>
+									<td title="Principles of Software Development">ENSF 409</td>
+									<td title=""></td>
+									<td title=""></td>
+								</tr>
+								<tr>
+									<td title="Principles of Microeconomics">ECON 201</td>
+									<td title="Technology And Society">ENGG 481</td>
+									<td title=""></td>
+									<td title=""></td>
+								</tr>
+							</tbody>
+						</table>
+
+
+					</div>
+				</div>
+			</div>
+
+			<hr>
+			<p class="text-center">
+				<a href="#top" class="btn btn-outline-info">Back to Top</a>
+			</p>
+		</div>
+		<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
+			integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous">
+		</script>
+		<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
+			integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous">
+		</script>
+		<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
+			integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous">
+		</script>
+</body>
+
+</html>
diff --git a/_includes/header.html b/_includes/header.html
@@ -29,5 +29,10 @@
     <meta property="og:description" content="{{ meta_description }}" />
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
     <link href="{{ "/assets/styles.css" | relative_url }}" rel="stylesheet" type="text/css">
+    <link
+    rel="stylesheet"
+    href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"
+  />
+<a class="btn" href="http://zhifanli.website/courses" role="button">Courses I have taken</a>
   </head>
   <body class="bg-white min-height-full" {% if site.style == 'dark' %}style="background-color: #2f363d !important"{% endif %}>
diff --git a/_includes/interests.html b/_includes/interests.html
@@ -1,4 +1,7 @@
-<h2 {% if site.style == 'dark' %}class="text-white"{% endif %}>My Interests</h2>
+<h2 {% if site.style == 'dark' %}class="text-white"{% endif %}>
+  <div class="animate__animated animate__pulse">My Interests
+  </div>
+</h2>
 <p class="f4 mb-4 {% if site.style == 'dark' %}text-white{% else %}text-gray{% endif %}">Topics that I want to learn more about.</p>
 <div class="d-flex flex-wrap gutter-condensed mb-4">
   {% for topic in site.topics %}

diff --git a/_includes/projects.html b/_includes/projects.html
@@ -1,5 +1,6 @@
-<h2 {% if site.style == 'dark' %}class="text-white"{% endif %}>My Projects</h2>
-<p class="f4 mb-4 {% if site.style == 'dark' %}text-white{% else %}text-gray{% endif %}">GitHub repositories that I've built.</p>
+<h2 {% if site.style == 'dark' %}class="text-white"{% endif %}>
+  <div class="animate__animated animate__pulse">My Projects</div></h2>
+<p class="f4 mb-4 {% if site.style == 'dark' %}text-white{% else %}text-gray{% endif %}">GitHub repositories</p>
 <div class="d-sm-flex flex-wrap gutter-condensed mb-4">
   {% if site.projects.sort_by == 'stars' %}
     {% assign sort_order = 'stargazers_count', 'last' %}

diff --git a/_layouts/home.html b/_layouts/home.html
@@ -39,14 +39,15 @@
         {% endunless %}
 
         {% include projects.html %}
-
+        
         {% if site.topics %}
           {% include interests.html %}
         {% endif %}
 
         {% unless posts_total == 0 %}
           {% include thoughts.html %}
         {% endunless %}
+        {% include courses.html %}
       </div>
     </div>
   </div>

diff --git a/assets/styles.scss b/assets/styles.scss
@@ -52,3 +52,11 @@
 .min-height-full {
   min-height: 100vh;
 }
+#btn {
+  position:relative;
+  transition: .5s ease;
+  top: 191px;
+  left: 420px;
+  right: -420px;
+  bottom: -191px;
+}