CalvinYan.github.io/index.html at master · CalvinYan/CalvinYan.github.io · GitHub

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
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
<!doctype html>
<html lang="en">


<head>

    <!-- Global site tag (gtag.js) - Google Analytics -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-136376843-1"></script>
    <script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());

    gtag('config', 'UA-136376843-1');
    </script>

    <title>Calvin Yan</title>

    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
    <!-- Font Awesome CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
    <!-- Custom CSS-->
    <link rel="stylesheet" href="./style.css">


    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>

    <!-- Favicon -->
    <link rel="shortcut icon" type="image/png" href="images/favicon_altalt.png"/>

</head>

<body data-spy="scroll" data-target=".navbar" data-offset="72">
    <nav id="navbar" class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top py-3">
        <div class="container-fluid">
            <a class="navbar-brand"  href="./index.html">Calvin Yan</a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsedNavList">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="collapsedNavList">
                <ul class="nav nav-pills navbar-nav ml-auto">
                    <li class="nav-item"><a class="nav-link" href="#about">About</a></li>
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#project-grid" id="projectsDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Projects</a>
                        <div class="dropdown-menu text-white bg-dark" aria-labelledby="projectsDropdown">

                        </div>
                    </li>
                    <li class="nav-item"><a class="nav-link" href="#contact">Contact</a></li>
                </ul>
            </div>
        </div>
    </nav>
    <div class="background-header">
        <div class="row">
            <div class="col"></div>
            <div class="py-4 col-lg-6 text-center">
                <img class="img-thumbnail rounded-circle text-center portrait" src="./images/portrait.jpg">
                <h1 class="display-3 text-white">Calvin Yan</h1>
                <p class="text-white lead">
                    Computer science student, data journalism enthusiast, budding jazzhead, occasionally funny individual
                </p>
                <hr>
                <span class="icons">
                    <a class="btn" target="_blank" href="mailto:calviny524@gmail.com"><i class="icon fa fa-lg fa-envelope text-white"></i></a>
                    <a class="btn" target="_blank" href="https://github.com/CalvinYan"><i class="icon fa fa-lg fa-github text-white"></i></a>
                    <a class="btn" target="_blank" href="./images/CalvinYan.pdf"><i class="icon fa fa-lg fa-file-pdf-o text-white"></i></a>
                    <a class="btn" target="_blank" href="https://www.linkedin.com/in/calv1n-yan"><i class="icon fa fa-lg fa-linkedin text-white"></i></a>
                    <a class="btn" target="_blank" href="https://www.facebook.com/calv1n.yan"><i class="icon fa fa-lg fa-facebook text-white"></i></a>
                </span>
                <p><strong><a href="./wdd/index.html">WDD STAFF: CLICK HERE FOR SUBMISSIONS</a></strong></p>
            </div>
            <div class="col"></div>
        </div>
    </div>
    <!-- Main page content -->
    <div class="container-fluid">
        <div class="row bg-dark text-white align-items-center" id="about">
            <div class="col"></div>
            <div class="col-lg-6 text-center">
                <br>
                <h1>About me</h1>
                <p class="lead" align="justify">
                    Welcome to my digital sanctum! I'm your host, Calvin Yan.
                    I grew up in the Bay Area as a first-generation Chinese-American and am working towards my computer
                    science degree in the University of California, Berkeley's College of Letters and Sciences.
                    If you're here to learn more about me as a software developer, you should know that I've been
                    engaging with CS in some form or another since I was a wee sixth grader. Since then, I've written
                    flash games, computer vision applications, machine learning classifiers, and algorithms for
                    computing olympiad problem sets, and am beyond excited to put the seven years of programming
                    experience I've accrued to use in an industry setting.
                    If not, you may want to know that some of my hobbies include pen spinning, journaling, trying and
                    failing to motivate myself to pick up the vibraphone, scheduled naps, playing Stardew Valley, and
                    devising ways to prevent Uniqlo from capturing 100 percent of the market that is my wardrobe. Want
                    to drop me a line/learn even more? Just click on the icons above!
                </p>
            </div>
            <div class="col-lg-5 text-center">
                <img src="./images/me_but_chonky.jpg">
            </div>
            <div class="col"></div>
        </div>

        <div class="py-5 row featurette" id="projects">
            <span class="text-center container-fluid">
                <h1 class="display-4">
                    Stuff I've worked on
                </h1>
            </span>
            <!-- Project grid -->
            <!-- <div class="col-lg-4 text-center"> -->
            <section class="project-grid row container-fluid">
                <div class="col-lg-4">
                    <div class="project" style="background-image:url(./images/veritas.jpg)">
                        <div class="overlay">
                            <a target="_blank" href="https://palyveritas.com"><h3 class="project-title py-3">Veritas Magazine</h3></a>
                            <p>
                                A Wordpress site for our high school science publication Veritas.
                            </p>
                            <p>
                                Status: <span class="project-ongoing">ONGOING</span>
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4">
                    <div class="project" style="background-image:url(./images/team8vision.jpg)">
                        <div class="overlay">
                            <a target="_blank" href="https://github.com/team8/2017-vision-app"><h3 class="project-title py-3">Team 8 Vision</h3></a>
                            <p>
                                A computer vision Android app for use by FIRST Robotics Competition Team 8's 2017 robot.
                                Utilizes OpenCV to identify retroreflective tape and estimate horizontal displacement.
                            </p>
                            <p>
                                Status: <span class="project-complete">COMPLETE</span>
                            </p>
                        </div>
                    </div>
                </div>
            </section>
            <!-- </div> -->
        </div>
    </div>


    <footer class="py-5 bg-dark">
        <div class="container">
            <p class="m-0 text-center text-white">Updated September 2021. No copyright whatsoever!</p>
            <a href="./projects/geniushour.html"><p class="m-0 text-center text-dark">Don't click me</p></a>
        </div>
    </footer>

</body>
</html>