go over resume, add contact page

This commit is contained in:
Brian Picciano 2022-03-15 21:34:16 -06:00
parent 6bb81759c6
commit 7b207b5b01
4 changed files with 175 additions and 60 deletions

84
contact.html Normal file
View File

@ -0,0 +1,84 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Basic Page Needs -->
<meta charset="utf-8">
<title>Brian Picciano - Freelance Developer</title>
<meta name="author" content="Brian Picciano">
<!-- No favicon -->
<link rel="shortcut icon" href="#" />
<!-- Mobile Specific Metas -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSS -->
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/skeleton.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<div class="header">
<div class="tab"><a href="index.html">/index</a></div><!--
--><div class="tab"><a href="resume.html">/resume</a></div><!--
--><div class="selected tab">/contact</div>
<div class="x">X</div>
</div>
<div class="container">
<h1>Contact Me</h1>
<p>
Please direct all questions and inquiries to:
</p>
<a href="mailto:bgpicciano@gmail.com"/>bgpicciano@gmail.com</a>
</div>
<div class="footer">
<div class="scrollpos" id="scrollpos">---</div>
</div>
<script>
function getScrollPct() {
const heightOfWindow = window.innerHeight,
contentScrolled = window.pageYOffset,
bodyHeight = document.body.offsetHeight;
if(bodyHeight - contentScrolled <= heightOfWindow) {
return "Bot";
} else if (contentScrolled == 0) {
return "Top";
} else {
const total = bodyHeight - heightOfWindow,
got = contentScrolled,
percent = parseInt((got/total) * 100);
return percent + "%"
}
}
const scrollposEl = document.getElementById("scrollpos");
scrollposEl.textContent = getScrollPct();
window.addEventListener("scroll", (event) => {
scrollposEl.textContent = getScrollPct();
});
</script>
</body>
</html>

View File

@ -1,6 +1,6 @@
@font-face { @font-face {
font-family: "SourceCode-Pro"; font-family: "SourceCode-Pro";
src: url("sorce-code-pro.woff") format('woff'); src: url("source-code-pro.woff") format('woff');
} }
html { html {
@ -22,6 +22,7 @@ h1, h2, h3, h4, h5, h6, .button-primary, .button {
h1 { color: #008700; } h1 { color: #008700; }
h2 { color: #0087af; } h2 { color: #0087af; }
h3 { color: #8700af; } h3 { color: #8700af; }
h4 { color: #d75f00; }
em { em {
font-style: normal; font-style: normal;
@ -61,6 +62,16 @@ a, a:active {
color: #444444; color: #444444;
} }
.header .x {
background-color: #0087af;
color: #eeeeee;
padding: 0;
border-right: 1px solid #005f87;
white-space: nowrap;
display: inline-block;
float: right;
}
.container { .container {
margin-top: 3.5rem; margin-top: 3.5rem;
margin-bottom: 3.5rem; margin-bottom: 3.5rem;

View File

@ -23,9 +23,10 @@
<body> <body>
<div class="header"> <div class="header">
<div class="selected tab">/about-me</div><!-- <div class="selected tab">/index</div><!--
--><div class="tab"><a href="resume.html">/resume</a></div><!-- --><div class="tab"><a href="resume.html">/resume</a></div><!--
--><div class="tab"><a href="contact.html">/contact</a></div> --><div class="tab"><a href="contact.html">/contact</a></div>
<div class="x">X</div>
</div> </div>
<div class="container"> <div class="container">

View File

@ -20,8 +20,8 @@
<style> <style>
.section-tail { .section-tail {
padding-bottom: 3%; padding-bottom: 2rem;
margin-bottom: 2%; margin-bottom: 4rem;
border-bottom: 1px solid #ccc; border-bottom: 1px solid #ccc;
} }
@ -43,43 +43,52 @@
<body> <body>
<div class="header"> <div class="header">
<div class="tab"><a href="index.html">/about-me</a></div><!-- <div class="tab"><a href="index.html">/index</a></div><!--
--><div class="selected tab">/resume</div><!-- --><div class="selected tab">/resume</div><!--
--><div class="tab"><a href="contact.html">/contact</a></div> --><div class="tab"><a href="contact.html">/contact</a></div>
<div class="x">X</div>
</div> </div>
<div class="container"> <div class="container">
<div class="row" style="margin-top: 2%"> <div class="row">
<h1 style="margin-bottom:0;">Brian Picciano</h1> <h1 style="margin-bottom:1rem;">Brian Picciano</h1>
<h5 style="margin-bottom:0;font-size:2rem;">Senior Systems and Backend Programmer</h5> <h2 style="margin-bottom:0;font-size:2rem;">Senior Systems and Backend Programmer</h2>
<h5 style="font-size:1.8rem;">University of Florida 2013 · BS Software Engineering · Mathematics Minor</h5> <h2 style="font-size:1.8rem;">University of Florida 2013 · BS Software Engineering · Mathematics Minor</h2>
</div>
<div class="row">
<div class="four columns">
<p>
<em>10+ years</em> of experience across backend systems,
databases, and application development. Passionate about
clean interfaces, good documentation, and open source.
</p>
</div>
<div class="eight columns">
<p>
<strong>Extensively experienced with:</strong><br/>
Go, Javascript-HTML-CSS, Nix, Bash, Lua, Clojure, Erlang;<br/>
Redis, Postgres/MariaDB, Cassandra/Scylla, Mongo;<br/>
Nginx, Caddy, Prometheus/Grafana, ELK stack, Ansible, GCE;<br/>
Many flavors of Linux; Docker.
</p>
</div>
</div> </div>
<div class="row section-tail"> <div class="row section-tail">
<div class="four columns"> <div class="four columns">
<a href=".">bgpicciano.com</a><br/> <p>
<a href="mailto:bgpicciano@gmail.com"/>bgpicciano@gmail.com</a><br/> <em>5+ years</em> of experience working remotely as a
<a href="https://github.com/mediocregopher"/>github.com/mediocregopher</a><br/> developer. Well-versed in communicating over slack, zoom,
<a href="https://blog.mediocregopher.com">blog.mediocregopher.com</a><br/> and email, and in maintaining good working relationships
across large timezone differences.
</p>
</div> </div>
<div class="eight columns"> <div class="eight columns">
<p> <p>
8 years of experience across backend systems, databases, and I also have past experience with many other languages and
application development. Passionate about clean code, good tools which I could easily pick back up.
documentation, and open source.
</p>
<p>
<strong>Extensively experienced with:</strong><br/>
Go, Erlang, Lua, Bash, PHP;<br/>
Nginx, Redis, Mongo, Cassandra/BigTable;<br/>
Ansible, ELK stack, CentOS/RHEL, Archlinux, GCE.
</p>
<p>
<strong>Familiar with:</strong><br/>
Ruby, Python, C, Javascript;<br/>
MySQL/MariaDB, Prometheus/Grafana, Chef;<br/>
Ubuntu/Debian, CoreOS, AWS, Kubernetes/Docker.
</p> </p>
</div> </div>
</div> </div>
@ -187,46 +196,56 @@
</div> </div>
</div> </div>
<div class="row section-tail" style=""> <div class="row" style="">
<div class="four columns"> <div class="four columns">
<h4>Open-Source/Personal Projects</h4> <h4>Open-Source/Personal Projects</h4>
<p> <p>
<a href="https://github.com/mediocregopher">github.com/mediocregopher</a> <a href="https://github.com/mediocregopher">github.com/mediocregopher</a>
contains all public work. Most of it is throw-away projects, contains much of my public work. Most of it is throw-away
but listed here are a few which are actively developed and projects, but listed here are a few which are actively
much loved. developed and much loved.
</p>
<p>
I frequently document the progress of my various projects
on <a href="https://blog.mediocregopher.com">my blog</a>.
</p> </p>
</div> </div>
<div class="eight columns"> <div class="eight columns">
<ul> <ul>
<li> <li>
Author of one of the recommended Redis drivers for Go, Author of one of the recommended Redis drivers for Go,
<a href="https://github.com/mediocregopher/radix.v2">radix.v2</a>, <a href="https://github.com/mediocregopher/radix">radix</a>.
and its much improved sequel,
<a href="https://github.com/mediocregopher/radix">radix/v3</a>.
</li> </li>
<li> <li>
Author of Author of one of <a href="https://dehub.dev">dehub</a>, a
<a href="https://github.com/mediocregopher/mediocre-go-lib">mediocre-go-lib</a>, git project hosting platform baked into the project's
a Go framework used for personal projects and similar in commit history itself. It's not much used, even by me, but
style to the one written for Admiral. it's functional and I'm proud of it.
</li> </li>
<li> <li>
Main contributor to <a href="https://github.com/mc0/okq">okq</a>, Working on an unreleased project, where we are creating
a simple, fast, and scalable job server written in Go the foundation for community-run cloud infrastructures.
and backed by Redis. Used at both Grooveshark and </li>
Admiral for extremely high-throughput loads.
<li>
Long-term work on a toy (so far)
<a href="https://github.com/mediocregopher/ginger">programming language</a>.
You can follow the progress of the language at
<a
href="https://blog.mediocregopher.com/2021/12/31/ginger-its-alive.html">blog.mediocregopher.com</a>.
</li> </li>
<li> <li>
Author of small art projects such as Author of small art projects such as
<a href="https://blog.mediocregopher.com/2018/11/12/viz-2.html">viz</a> <a href="https://blog.mediocregopher.com/2021/07/01/viz-7.html">viz</a>
and others featured at and others featured at
<a href="https://blog.mediocregopher.com">blog.mediocregopher.com</a>, <a href="https://blog.mediocregopher.com">blog.mediocregopher.com</a>,
mostly written in Clojure. mostly written in Clojure.
</li> </li>
</ul> </ul>
</div> </div>
</div> </div>