<commit_before><!DOCTYPE html>
<!--[if IE 8]> <html lang="en" class="ie8"> <![endif]-->
<!--[if !IE]><!-->
<html class="no-js" lang="en">
<!--<![endif]-->
<head>
    <meta charset="utf-8" />
    <meta http-equiv="x-ua-compatible" content="ie=edge" />
	<title><NAME>'s Portfolio</title>
    <link rel="apple-touch-icon" href="apple-touch-icon.png" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
	<meta content="<NAME> - ‎Web Developer and Software Developer" name="robots" />
	<meta content="<NAME>" name="author" />

	<!-- ================== BEGIN BASE CSS STYLE ================== -->
	<link href="https://fonts.googleapis.com/css?family=Ubuntu" rel="stylesheet" />
	<link href="assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
	<link href="assets/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" />
	<link href="assets/css/animate.min.css" rel="stylesheet" />
	<link href="assets/css/style.min.css" rel="stylesheet" />
	<link href="assets/css/style-responsive.min.css" rel="stylesheet" />
	<link href="assets/css/theme/default.css" id="theme" rel="stylesheet" />
    <link href="assets/css/normalize.css" rel="stylesheet">
    <link href="assets/css/main.css" rel="stylesheet" >
	<!-- ================== END BASE CSS STYLE ================== -->

	<!-- ================== BEGIN BASE JS ================== -->
    <script src="assets/js/vendor/modernizr-2.8.3.min.js"></script>
	<script src="assets/plugins/pace/pace.min.js"></script>
	<!-- ================== END BASE JS ================== -->

</head>
<body>
    <div id="page-container">
        <div class="container" data-animation="true" data-animation-type="fadeInDown">
            <div class="row ">
                <div class="col-md-12" >
                    <ul class="nav nav-pills">
                        <li class="active"><a href="#aboutTab" data-toggle="tab"><i class="fa fa-user fa-2x" aria-hidden="true"></i> <br><p class="menuText">About me</p></a></li>
                        <li><a href="#tab-2" data-toggle="tab"><i class="fa fa-tasks fa-2x" aria-hidden="true"></i><br><p class="menuText">Projects</p></a></li>
                        <li><a href="#tab-3" data-toggle="tab"><i class="fa fa-briefcase fa-2x" aria-hidden="true"></i><br><p class="menuText">Work</p></a></li>
                        <li><a href="assets/src/tkao.pdf" target="_blank"><i class="fa fa-file-text fa-2x"></i><br><p class="menuText">CV</p></a></li>
                    </ul>
                </div>                  
                <div id="tab-content" class="tab-content flexcenter">
                    <div class="tab-pane fade in active" id="aboutTab">
                        <div id="about"data-scrollview="true">
                            <div class="fadeInDown contentAnimated" data-animation="true" data-animation-type="fadeInDown">
                                <div class="row">
                                    <div class="col-md-12 col-sm-12 profile portrait"><img src="assets/img/pic.jpg"></div>
                                </div>
                                <div class="row">
                                    <div class=" col-md-12 col-sm-12 profile">                         
                                        <h3><NAME></h3>  
                                        <p>I'm a Web Developer from Toronto. I study Computer Science at Ryerson University. I love minimalistic designs and neat, readable code. I recently discovered React.js and I'm planning on taking on a few personal projects to quickly learn the ins and outs of this wonderful library. Once I get the hang of it, I'm planning on uploading some videos on youtube of programming challenges i give myself ! Some other fields of interest include mobile app development, software development, AI/bots, networking, security and game development. </p>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-12 col-sm-12 flexcenter">
                                        <a href="https://github.com/toddkao" target="_blank"><i class="fa fa-github fa-2x"></i></a>
                                        <a href="https://codepen.io/toddkao/" target="_blank"><i class="fa fa-codepen fa-2x"></i></a>               
                                        <a href="https://www.linkedin.com/in/toddkao/" target="_blank"><i class="fa fa-linkedin fa-2x"></i></a>                 
                                    </div>
                                </div>                                  
                            </div>
                        </div>
                    </div>

                    <div class="tab-pane fade" id="tab-2">
                        <div class="fadeInDown contentAnimated" data-animation="true" data-animation-type="fadeInDown">
                            <h2>Projects</h2>
                            <!-- Projects row -->
                            <div class="row">
                                <div class="col-md-3 col-sm-6 col-xs-6">
                                    <div class="work" on-touch="showdesc(1,'proj')" on-release="hidedesc(1,'proj')" onmouseover="showdesc(1,'proj')" onmouseout="hidedesc(1,'proj')">
                                        <div class="image">
                                            <a><img src="assets/img/tictactoe.png" alt="tictactoe"></a>
                                        </div>
                                        <div id="proj1" class="desc">
                                            <a href="https://codepen.io/toddkao/pen/EZBJyj" target="_blank" class="desc-title">Tic Tac Toe</a>
                                            <span class="desc-text"> Tic Tac Toe made with React (My first React app) I followed React's Tutorial page and added a reset game button</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-3 col-sm-6 col-xs-6">
                                    <div class="work" on-touch="showdesc(2,'proj')" on-release="hidedesc(2,'proj')" onmouseover="showdesc(2,'proj')" onmouseout="hidedesc(2,'proj')">
                                        <div class="image">
                                            <a href="#"><img src="assets/img/empty.png" alt=""></a>
                                        </div>
                                        <div id="proj2" class="desc">
                                            <span class="desc-title">Quisque at pulvinar lacus</span>
                                            <span class="desc-text">Lorem ipsum dolor sit amet</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-3 col-sm-6 col-xs-6">
                                    <div class="work" on-touch="showdesc(3,'proj')" on-release="hidedesc(3,'proj')" onmouseover="showdesc(3,'proj')" onmouseout="hidedesc(3,'proj')" >
                                        <div class="image">
                                            <a href="#"><img src="assets/img/empty.png" alt=""></a>
                                        </div>
                                        <div id="proj3" class="desc">
                                            <span class="desc-title">Vestibulum et erat ornare</span>
                                            <span class="desc-text">Lorem ipsum dolor sit amet</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-3 col-sm-6 col-xs-6">
                                    <div class="work" on-touch="showdesc(4,'proj')" on-release="hidedesc(4,'proj')" onmouseover="showdesc(4,'proj')" onmouseout="hidedesc(4,'proj')">
                                        <div class="image">
                                            <a href="#"><img src="assets/img/empty.png" alt=""></a>
                                        </div>
                                        <div id="proj4" class="desc">
                                            <span class="desc-title">Sed vitae mollis magna</span>
                                            <span class="desc-text">Lorem ipsum dolor sit amet</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- Technologies -->
                            <div class="row" style="margin-top: 50px">
                                <h2>Technologies used</h2>                           
                                <div class="col-cust col-sm-3 col-xs-3">                           
                                    <div class="img-wrapper" on-touch="showdesc(1,'tech')" on-release="hidedesc(1,'tech')" onmouseover="showdesc(1,'tech')" onmouseout="hidedesc(1,'tech')" >
                                        <div class="tech">
                                            <a><img src="assets/img/sass.jpg" alt="Sass"></a>
                                        </div>
                                        <div class="description"  id="tech1"><a href="http://sass-lang.com/" target="_blank">Sass</a></div>
                                    </div>
                                    
                                </div>
                                <div class="col-cust col-sm-3 col-xs-3">                           
                                    <div class="img-wrapper" on-touch="showdesc(2,'tech')" on-release="hidedesc(2,'tech')" onmouseover="showdesc(2,'tech')" onmouseout="hidedesc(2,'tech')" >
                                        <div class="tech">
                                            <a target="_blank"><img src="assets/img/jQuery.gif" alt="jQuery"></a>
                                        </div>
                                        <div class="description"  id="tech2"><a href="https://jquery.com/" target="_blank">jQuery</a></div>
                                    </div>
                                </div>
                                <div class="col-cust col-sm-3 col-xs-3">                           
                                    <div class="img-wrapper"  on-touch="showdesc(3,'tech')" on-release="hidedesc(3,'tech')" onmouseover="showdesc(3,'tech')" onmouseout="hidedesc(3,'tech')">
                                        <div class="tech">
                                            <a  target="_blank"><img src="assets/img/reactjs.png" alt="reactjs"></a>
                                        </div>
                                        <div class="description"  id="tech3"><a href="https://facebook.github.io/react/" target="_blank">React.js</a></div>
                                    </div>
                                </div>
                                <div class="col-cust col-sm-3 col-xs-3">                           
                                    <div class="img-wrapper" on-touch="showdesc(4,'tech')" on-release="hidedesc(4,'tech')" onmouseover="showdesc(4,'tech')" onmouseout="hidedesc(4,'tech')">
                                        <div class="tech">
                                            <a target="_blank"><img src="assets/img/bootstrap.png" alt="Bootstrap"></a>
                                        </div>
                                        <div class="description"  id="tech4"><a href="http://getbootstrap.com/" target="_blank">Bootstrap</a></div>
                                    </div>
                                </div><commit_msg>fixed naming for jquery asset<commit_after><!DOCTYPE html>
<!--[if IE 8]> <html lang="en" class="ie8"> <![endif]-->
<!--[if !IE]><!-->
<html class="no-js" lang="en">
<!--<![endif]-->
<head>
    <meta charset="utf-8" />
    <meta http-equiv="x-ua-compatible" content="ie=edge" />
	<title><NAME>'s Portfolio</title>
    <link rel="apple-touch-icon" href="apple-touch-icon.png" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
	<meta content="<NAME> - ‎Web Developer and Software Developer" name="robots" />
	<meta content="<NAME>" name="author" />

	<!-- ================== BEGIN BASE CSS STYLE ================== -->
	<link href="https://fonts.googleapis.com/css?family=Ubuntu" rel="stylesheet" />
	<link href="assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
	<link href="assets/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" />
	<link href="assets/css/animate.min.css" rel="stylesheet" />
	<link href="assets/css/style.min.css" rel="stylesheet" />
	<link href="assets/css/style-responsive.min.css" rel="stylesheet" />
	<link href="assets/css/theme/default.css" id="theme" rel="stylesheet" />
    <link href="assets/css/normalize.css" rel="stylesheet">
    <link href="assets/css/main.css" rel="stylesheet" >
	<!-- ================== END BASE CSS STYLE ================== -->

	<!-- ================== BEGIN BASE JS ================== -->
    <script src="assets/js/vendor/modernizr-2.8.3.min.js"></script>
	<script src="assets/plugins/pace/pace.min.js"></script>
	<!-- ================== END BASE JS ================== -->

</head>
<body>
    <div id="page-container">
        <div class="container" data-animation="true" data-animation-type="fadeInDown">
            <div class="row ">
                <div class="col-md-12" >
                    <ul class="nav nav-pills">
                        <li class="active"><a href="#aboutTab" data-toggle="tab"><i class="fa fa-user fa-2x" aria-hidden="true"></i> <br><p class="menuText">About me</p></a></li>
                        <li><a href="#tab-2" data-toggle="tab"><i class="fa fa-tasks fa-2x" aria-hidden="true"></i><br><p class="menuText">Projects</p></a></li>
                        <li><a href="#tab-3" data-toggle="tab"><i class="fa fa-briefcase fa-2x" aria-hidden="true"></i><br><p class="menuText">Work</p></a></li>
                        <li><a href="assets/src/tkao.pdf" target="_blank"><i class="fa fa-file-text fa-2x"></i><br><p class="menuText">CV</p></a></li>
                    </ul>
                </div>                  
                <div id="tab-content" class="tab-content flexcenter">
                    <div class="tab-pane fade in active" id="aboutTab">
                        <div id="about"data-scrollview="true">
                            <div class="fadeInDown contentAnimated" data-animation="true" data-animation-type="fadeInDown">
                                <div class="row">
                                    <div class="col-md-12 col-sm-12 profile portrait"><img src="assets/img/pic.jpg"></div>
                                </div>
                                <div class="row">
                                    <div class=" col-md-12 col-sm-12 profile">                         
                                        <h3><NAME></h3>  
                                        <p>I'm a Web Developer from Toronto. I study Computer Science at Ryerson University. I love minimalistic designs and neat, readable code. I recently discovered React.js and I'm planning on taking on a few personal projects to quickly learn the ins and outs of this wonderful library. Once I get the hang of it, I'm planning on uploading some videos on youtube of programming challenges i give myself ! Some other fields of interest include mobile app development, software development, AI/bots, networking, security and game development. </p>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-12 col-sm-12 flexcenter">
                                        <a href="https://github.com/toddkao" target="_blank"><i class="fa fa-github fa-2x"></i></a>
                                        <a href="https://codepen.io/toddkao/" target="_blank"><i class="fa fa-codepen fa-2x"></i></a>               
                                        <a href="https://www.linkedin.com/in/toddkao/" target="_blank"><i class="fa fa-linkedin fa-2x"></i></a>                 
                                    </div>
                                </div>                                  
                            </div>
                        </div>
                    </div>

                    <div class="tab-pane fade" id="tab-2">
                        <div class="fadeInDown contentAnimated" data-animation="true" data-animation-type="fadeInDown">
                            <h2>Projects</h2>
                            <!-- Projects row -->
                            <div class="row">
                                <div class="col-md-3 col-sm-6 col-xs-6">
                                    <div class="work" on-touch="showdesc(1,'proj')" on-release="hidedesc(1,'proj')" onmouseover="showdesc(1,'proj')" onmouseout="hidedesc(1,'proj')">
                                        <div class="image">
                                            <a><img src="assets/img/tictactoe.png" alt="tictactoe"></a>
                                        </div>
                                        <div id="proj1" class="desc">
                                            <a href="https://codepen.io/toddkao/pen/EZBJyj" target="_blank" class="desc-title">Tic Tac Toe</a>
                                            <span class="desc-text"> Tic Tac Toe made with React (My first React app) I followed React's Tutorial page and added a reset game button</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-3 col-sm-6 col-xs-6">
                                    <div class="work" on-touch="showdesc(2,'proj')" on-release="hidedesc(2,'proj')" onmouseover="showdesc(2,'proj')" onmouseout="hidedesc(2,'proj')">
                                        <div class="image">
                                            <a href="#"><img src="assets/img/empty.png" alt=""></a>
                                        </div>
                                        <div id="proj2" class="desc">
                                            <span class="desc-title">Quisque at pulvinar lacus</span>
                                            <span class="desc-text">Lorem ipsum dolor sit amet</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-3 col-sm-6 col-xs-6">
                                    <div class="work" on-touch="showdesc(3,'proj')" on-release="hidedesc(3,'proj')" onmouseover="showdesc(3,'proj')" onmouseout="hidedesc(3,'proj')" >
                                        <div class="image">
                                            <a href="#"><img src="assets/img/empty.png" alt=""></a>
                                        </div>
                                        <div id="proj3" class="desc">
                                            <span class="desc-title">Vestibulum et erat ornare</span>
                                            <span class="desc-text">Lorem ipsum dolor sit amet</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-3 col-sm-6 col-xs-6">
                                    <div class="work" on-touch="showdesc(4,'proj')" on-release="hidedesc(4,'proj')" onmouseover="showdesc(4,'proj')" onmouseout="hidedesc(4,'proj')">
                                        <div class="image">
                                            <a href="#"><img src="assets/img/empty.png" alt=""></a>
                                        </div>
                                        <div id="proj4" class="desc">
                                            <span class="desc-title">Sed vitae mollis magna</span>
                                            <span class="desc-text">Lorem ipsum dolor sit amet</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- Technologies -->
                            <div class="row" style="margin-top: 50px">
                                <h2>Technologies used</h2>                           
                                <div class="col-cust col-sm-3 col-xs-3">                           
                                    <div class="img-wrapper" on-touch="showdesc(1,'tech')" on-release="hidedesc(1,'tech')" onmouseover="showdesc(1,'tech')" onmouseout="hidedesc(1,'tech')" >
                                        <div class="tech">
                                            <a><img src="assets/img/sass.jpg" alt="Sass"></a>
                                        </div>
                                        <div class="description"  id="tech1"><a href="http://sass-lang.com/" target="_blank">Sass</a></div>
                                    </div>
                                    
                                </div>
                                <div class="col-cust col-sm-3 col-xs-3">                           
                                    <div class="img-wrapper" on-touch="showdesc(2,'tech')" on-release="hidedesc(2,'tech')" onmouseover="showdesc(2,'tech')" onmouseout="hidedesc(2,'tech')" >
                                        <div class="tech">
                                            <a target="_blank"><img src="assets/img/jquery.gif" alt="jQuery"></a>
                                        </div>
                                        <div class="description"  id="tech2"><a href="https://jquery.com/" target="_blank">jQuery</a></div>
                                    </div>
                                </div>
                                <div class="col-cust col-sm-3 col-xs-3">                           
                                    <div class="img-wrapper"  on-touch="showdesc(3,'tech')" on-release="hidedesc(3,'tech')" onmouseover="showdesc(3,'tech')" onmouseout="hidedesc(3,'tech')">
                                        <div class="tech">
                                            <a  target="_blank"><img src="assets/img/reactjs.png" alt="reactjs"></a>
                                        </div>
                                        <div class="description"  id="tech3"><a href="https://facebook.github.io/react/" target="_blank">React.js</a></div>
                                    </div>
                                </div>
                                <div class="col-cust col-sm-3 col-xs-3">                           
                                    <div class="img-wrapper" on-touch="showdesc(4,'tech')" on-release="hidedesc(4,'tech')" onmouseover="showdesc(4,'tech')" onmouseout="hidedesc(4,'tech')">
                                        <div class="tech">
                                            <a target="_blank"><img src="assets/img/bootstrap.png" alt="Bootstrap"></a>
                                        </div>
                                        <div class="description"  id="tech4"><a href="http://getbootstrap.com/" target="_blank">Bootstrap</a></div>
                                    </div>
                                </div>
{'fraction_non_alphanumeric': 0.1594251617783007, 'fraction_numerical': 0.008572148920077318, 'mean_word_length': 1.1896218603367374, 'pattern_counts': {'":': 0, '<': 489, '<?xml version=': 0, '>': 487, 'https://': 14, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 246, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '282125', 'n_tokens_mistral': 6066, 'n_tokens_neox': 5781, 'n_words': 1121}