marc/karnov.club
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

New

Browse source
This commit is contained in:
Marc Cataford 2018-04-08 03:00:41 -04:00
parent 5690db08bf
commit bbaf70ee96
17 changed files with 131 additions and 1005 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

78
404.html
View file

@ -1,78 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Begin Jekyll SEO tag v2.4.0 -->
<title>Your awesome title | Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description.</title>
<meta name="generator" content="Jekyll v3.7.2" />
<meta property="og:title" content="Your awesome title" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description." />
<meta property="og:description" content="Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description." />
<link rel="canonical" href="http://localhost:4000/404.html" />
<meta property="og:url" content="http://localhost:4000/404.html" />
<meta property="og:site_name" content="Your awesome title" />
<script type="application/ld+json">
{"description":"Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description.","@type":"WebPage","url":"http://localhost:4000/404.html","headline":"Your awesome title","@context":"http://schema.org"}</script>
<!-- End Jekyll SEO tag -->
<link rel="stylesheet" href="/assets/main.css">
<link type="application/atom+xml" rel="alternate" href="http://localhost:4000/feed.xml" title="Your awesome title" />
</head>
<body>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="http://localhost:4000/js/base.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link href="http://localhost:4000/css/base.css" rel="stylesheet"/>
<link href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300" rel="stylesheet">
</head>
<body>
<header></header>
<main class="page-content" aria-label="Content">
<div class="wrapper">
<style type="text/css" media="screen">
.container {
margin: 10px auto;
max-width: 600px;
text-align: center;
}
h1 {
margin: 30px 0;
font-size: 4em;
line-height: 1;
letter-spacing: -1px;
}
</style>
<div class="container">
<h1>404</h1>
<p><strong>Page not found :(</strong></p>
<p>The requested page could not be found.</p>
</div>
</div>
</main>
<footer></footer>
</body>
</html>
</body>
</html>

79
about/index.html
View file

@ -1,79 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Begin Jekyll SEO tag v2.4.0 -->
<title>About | Your awesome title</title>
<meta name="generator" content="Jekyll v3.7.2" />
<meta property="og:title" content="About" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description." />
<meta property="og:description" content="Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description." />
<link rel="canonical" href="http://localhost:4000/about/" />
<meta property="og:url" content="http://localhost:4000/about/" />
<meta property="og:site_name" content="Your awesome title" />
<script type="application/ld+json">
{"name":"Your awesome title","description":"Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description.","@type":"WebSite","url":"http://localhost:4000/about/","headline":"About","@context":"http://schema.org"}</script>
<!-- End Jekyll SEO tag -->
<link rel="stylesheet" href="/assets/main.css">
<link type="application/atom+xml" rel="alternate" href="http://localhost:4000/feed.xml" title="Your awesome title" />
</head>
<body>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="http://localhost:4000/js/base.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link href="http://localhost:4000/css/base.css" rel="stylesheet"/>
<link href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300" rel="stylesheet">
</head>
<body>
<header></header>
<main class="page-content" aria-label="Content">
<div class="wrapper">
<article class="post">
<header class="post-header">
<h1 class="post-title">About</h1>
</header>
<div class="post-content">
<p>This is the base Jekyll theme. You can find out more info about customizing your Jekyll theme, as well as basic Jekyll usage documentation at <a href="https://jekyllrb.com/">jekyllrb.com</a></p>
<p>You can find the source code for Minima at GitHub:
<a href="https://github.com/jekyll">jekyll</a> /
<a href="https://github.com/jekyll/minima">minima</a></p>
<p>You can find the source code for Jekyll at GitHub:
<a href="https://github.com/jekyll">jekyll</a> /
<a href="https://github.com/jekyll/jekyll">jekyll</a></p>
</div>
</article>
</div>
</main>
<footer></footer>
</body>
</html>
</body>
</html>

494
assets/main.css
View file

@ -1,494 +0,0 @@
/**
* Reset some basic elements
*/
body, h1, h2, h3, h4, h5, h6,
p, blockquote, pre, hr,
dl, dd, ol, ul, figure {
margin: 0;
padding: 0; }
/**
* Basic styling
*/
body {
font: 400 16px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #111;
background-color: #fdfdfd;
-webkit-text-size-adjust: 100%;
-webkit-font-feature-settings: "kern" 1;
-moz-font-feature-settings: "kern" 1;
-o-font-feature-settings: "kern" 1;
font-feature-settings: "kern" 1;
font-kerning: normal; }
/**
* Set `margin-bottom` to maintain vertical rhythm
*/
h1, h2, h3, h4, h5, h6,
p, blockquote, pre,
ul, ol, dl, figure,
.highlight {
margin-bottom: 15px; }
/**
* Images
*/
img {
max-width: 100%;
vertical-align: middle; }
/**
* Figures
*/
figure > img {
display: block; }
figcaption {
font-size: 14px; }
/**
* Lists
*/
ul, ol {
margin-left: 30px; }
li > ul,
li > ol {
margin-bottom: 0; }
/**
* Headings
*/
h1, h2, h3, h4, h5, h6 {
font-weight: 400; }
/**
* Links
*/
a {
color: #2a7ae2;
text-decoration: none; }
a:visited {
color: #1756a9; }
a:hover {
color: #111;
text-decoration: underline; }
.social-media-list a:hover {
text-decoration: none; }
.social-media-list a:hover .username {
text-decoration: underline; }
/**
* Blockquotes
*/
blockquote {
color: #828282;
border-left: 4px solid #e8e8e8;
padding-left: 15px;
font-size: 18px;
letter-spacing: -1px;
font-style: italic; }
blockquote > :last-child {
margin-bottom: 0; }
/**
* Code formatting
*/
pre,
code {
font-size: 15px;
border: 1px solid #e8e8e8;
border-radius: 3px;
background-color: #eef; }
code {
padding: 1px 5px; }
pre {
padding: 8px 12px;
overflow-x: auto; }
pre > code {
border: 0;
padding-right: 0;
padding-left: 0; }
/**
* Wrapper
*/
.wrapper {
max-width: -webkit-calc(800px - (30px * 2));
max-width: calc(800px - (30px * 2));
margin-right: auto;
margin-left: auto;
padding-right: 30px;
padding-left: 30px; }
@media screen and (max-width: 800px) {
.wrapper {
max-width: -webkit-calc(800px - (30px));
max-width: calc(800px - (30px));
padding-right: 15px;
padding-left: 15px; } }
/**
* Clearfix
*/
.wrapper:after, .footer-col-wrapper:after {
content: "";
display: table;
clear: both; }
/**
* Icons
*/
.svg-icon {
width: 16px;
height: 16px;
display: inline-block;
fill: #828282;
padding-right: 5px;
vertical-align: text-top; }
.social-media-list li + li {
padding-top: 5px; }
/**
* Tables
*/
table {
margin-bottom: 30px;
width: 100%;
text-align: left;
color: #3f3f3f;
border-collapse: collapse;
border: 1px solid #e8e8e8; }
table tr:nth-child(even) {
background-color: #f7f7f7; }
table th, table td {
padding: 10px 15px; }
table th {
background-color: #f0f0f0;
border: 1px solid #dedede;
border-bottom-color: #c9c9c9; }
table td {
border: 1px solid #e8e8e8; }
/**
* Site header
*/
.site-header {
border-top: 5px solid #424242;
border-bottom: 1px solid #e8e8e8;
min-height: 55.95px;
position: relative; }
.site-title {
font-size: 26px;
font-weight: 300;
line-height: 54px;
letter-spacing: -1px;
margin-bottom: 0;
float: left; }
.site-title, .site-title:visited {
color: #424242; }
.site-nav {
float: right;
line-height: 54px; }
.site-nav .nav-trigger {
display: none; }
.site-nav .menu-icon {
display: none; }
.site-nav .page-link {
color: #111;
line-height: 1.5; }
.site-nav .page-link:not(:last-child) {
margin-right: 20px; }
@media screen and (max-width: 600px) {
.site-nav {
position: absolute;
top: 9px;
right: 15px;
background-color: #fdfdfd;
border: 1px solid #e8e8e8;
border-radius: 5px;
text-align: right; }
.site-nav label[for="nav-trigger"] {
display: block;
float: right;
width: 36px;
height: 36px;
z-index: 2;
cursor: pointer; }
.site-nav .menu-icon {
display: block;
float: right;
width: 36px;
height: 26px;
line-height: 0;
padding-top: 10px;
text-align: center; }
.site-nav .menu-icon > svg path {
fill: #424242; }
.site-nav input ~ .trigger {
clear: both;
display: none; }
.site-nav input:checked ~ .trigger {
display: block;
padding-bottom: 5px; }
.site-nav .page-link {
display: block;
padding: 5px 10px;
margin-left: 20px; }
.site-nav .page-link:not(:last-child) {
margin-right: 0; } }
/**
* Site footer
*/
.site-footer {
border-top: 1px solid #e8e8e8;
padding: 30px 0; }
.footer-heading {
font-size: 18px;
margin-bottom: 15px; }
.contact-list,
.social-media-list {
list-style: none;
margin-left: 0; }
.footer-col-wrapper {
font-size: 15px;
color: #828282;
margin-left: -15px; }
.footer-col {
float: left;
margin-bottom: 15px;
padding-left: 15px; }
.footer-col-1 {
width: -webkit-calc(35% - (30px / 2));
width: calc(35% - (30px / 2)); }
.footer-col-2 {
width: -webkit-calc(20% - (30px / 2));
width: calc(20% - (30px / 2)); }
.footer-col-3 {
width: -webkit-calc(45% - (30px / 2));
width: calc(45% - (30px / 2)); }
@media screen and (max-width: 800px) {
.footer-col-1,
.footer-col-2 {
width: -webkit-calc(50% - (30px / 2));
width: calc(50% - (30px / 2)); }
.footer-col-3 {
width: -webkit-calc(100% - (30px / 2));
width: calc(100% - (30px / 2)); } }
@media screen and (max-width: 600px) {
.footer-col {
float: none;
width: -webkit-calc(100% - (30px / 2));
width: calc(100% - (30px / 2)); } }
/**
* Page content
*/
.page-content {
padding: 30px 0; }
.page-heading {
font-size: 32px; }
.post-list-heading {
font-size: 28px; }
.post-list {
margin-left: 0;
list-style: none; }
.post-list > li {
margin-bottom: 30px; }
.post-meta {
font-size: 14px;
color: #828282; }
.post-link {
display: block;
font-size: 24px; }
/**
* Posts
*/
.post-header {
margin-bottom: 30px; }
.post-title {
font-size: 42px;
letter-spacing: -1px;
line-height: 1; }
@media screen and (max-width: 800px) {
.post-title {
font-size: 36px; } }
.post-content {
margin-bottom: 30px; }
.post-content h2 {
font-size: 32px; }
@media screen and (max-width: 800px) {
.post-content h2 {
font-size: 28px; } }
.post-content h3 {
font-size: 26px; }
@media screen and (max-width: 800px) {
.post-content h3 {
font-size: 22px; } }
.post-content h4 {
font-size: 20px; }
@media screen and (max-width: 800px) {
.post-content h4 {
font-size: 18px; } }
/**
* Syntax highlighting styles
*/
.highlight {
background: #fff; }
.highlighter-rouge .highlight {
background: #eef; }
.highlight .c {
color: #998;
font-style: italic; }
.highlight .err {
color: #a61717;
background-color: #e3d2d2; }
.highlight .k {
font-weight: bold; }
.highlight .o {
font-weight: bold; }
.highlight .cm {
color: #998;
font-style: italic; }
.highlight .cp {
color: #999;
font-weight: bold; }
.highlight .c1 {
color: #998;
font-style: italic; }
.highlight .cs {
color: #999;
font-weight: bold;
font-style: italic; }
.highlight .gd {
color: #000;
background-color: #fdd; }
.highlight .gd .x {
color: #000;
background-color: #faa; }
.highlight .ge {
font-style: italic; }
.highlight .gr {
color: #a00; }
.highlight .gh {
color: #999; }
.highlight .gi {
color: #000;
background-color: #dfd; }
.highlight .gi .x {
color: #000;
background-color: #afa; }
.highlight .go {
color: #888; }
.highlight .gp {
color: #555; }
.highlight .gs {
font-weight: bold; }
.highlight .gu {
color: #aaa; }
.highlight .gt {
color: #a00; }
.highlight .kc {
font-weight: bold; }
.highlight .kd {
font-weight: bold; }
.highlight .kp {
font-weight: bold; }
.highlight .kr {
font-weight: bold; }
.highlight .kt {
color: #458;
font-weight: bold; }
.highlight .m {
color: #099; }
.highlight .s {
color: #d14; }
.highlight .na {
color: #008080; }
.highlight .nb {
color: #0086B3; }
.highlight .nc {
color: #458;
font-weight: bold; }
.highlight .no {
color: #008080; }
.highlight .ni {
color: #800080; }
.highlight .ne {
color: #900;
font-weight: bold; }
.highlight .nf {
color: #900;
font-weight: bold; }
.highlight .nn {
color: #555; }
.highlight .nt {
color: #000080; }
.highlight .nv {
color: #008080; }
.highlight .ow {
font-weight: bold; }
.highlight .w {
color: #bbb; }
.highlight .mf {
color: #099; }
.highlight .mh {
color: #099; }
.highlight .mi {
color: #099; }
.highlight .mo {
color: #099; }
.highlight .sb {
color: #d14; }
.highlight .sc {
color: #d14; }
.highlight .sd {
color: #d14; }
.highlight .s2 {
color: #d14; }
.highlight .se {
color: #d14; }
.highlight .sh {
color: #d14; }
.highlight .si {
color: #d14; }
.highlight .sx {
color: #d14; }
.highlight .sr {
color: #009926; }
.highlight .s1 {
color: #d14; }
.highlight .ss {
color: #990073; }
.highlight .bp {
color: #999; }
.highlight .vc {
color: #008080; }
.highlight .vg {
color: #008080; }
.highlight .vi {
color: #008080; }
.highlight .il {
color: #099; }

BIN
assets/me.jpg
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 1.5 MiB

27
assets/minima-social-icons.svg
View file

@ -1,27 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<symbol id="dribbble" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M8 16c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm6.747-6.905c-.234-.074-2.115-.635-4.257-.292.894 2.456 1.258 4.456 1.328 4.872 1.533-1.037 2.624-2.68 2.93-4.58zM10.67 14.3c-.102-.6-.5-2.688-1.46-5.18l-.044.014C5.312 10.477 3.93 13.15 3.806 13.4c1.158.905 2.614 1.444 4.194 1.444.947 0 1.85-.194 2.67-.543zm-7.747-1.72c.155-.266 2.03-3.37 5.555-4.51.09-.03.18-.056.27-.08-.173-.39-.36-.778-.555-1.16-3.413 1.02-6.723.977-7.023.97l-.003.208c0 1.755.665 3.358 1.756 4.57zM1.31 6.61c.307.005 3.122.017 6.318-.832-1.132-2.012-2.353-3.705-2.533-3.952-1.912.902-3.34 2.664-3.784 4.785zM6.4 1.368c.188.253 1.43 1.943 2.548 4 2.43-.91 3.46-2.293 3.582-2.468C11.323 1.827 9.736 1.176 8 1.176c-.55 0-1.087.066-1.6.19zm6.89 2.322c-.145.194-1.29 1.662-3.816 2.694.16.325.31.656.453.99.05.117.1.235.147.352 2.274-.286 4.533.172 4.758.22-.015-1.613-.59-3.094-1.543-4.257z"/></symbol>
<symbol id="facebook" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M15.117 0H.883C.395 0 0 .395 0 .883v14.234c0 .488.395.883.883.883h7.663V9.804H6.46V7.39h2.086V5.607c0-2.066 1.262-3.19 3.106-3.19.883 0 1.642.064 1.863.094v2.16h-1.28c-1 0-1.195.48-1.195 1.18v1.54h2.39l-.31 2.42h-2.08V16h4.077c.488 0 .883-.395.883-.883V.883C16 .395 15.605 0 15.117 0" fill-rule="nonzero"/></symbol>
<symbol id="flickr" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M0 8c0 2.05 1.662 3.71 3.71 3.71 2.05 0 3.713-1.66 3.713-3.71S5.76 4.29 3.71 4.29C1.663 4.29 0 5.95 0 8zm8.577 0c0 2.05 1.662 3.71 3.712 3.71C14.33 11.71 16 10.05 16 8s-1.662-3.71-3.71-3.71c-2.05 0-3.713 1.66-3.713 3.71z"/></symbol>
<symbol id="github" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M8 0C3.58 0 0 3.582 0 8c0 3.535 2.292 6.533 5.47 7.59.4.075.547-.172.547-.385 0-.19-.007-.693-.01-1.36-2.226.483-2.695-1.073-2.695-1.073-.364-.924-.89-1.17-.89-1.17-.725-.496.056-.486.056-.486.803.056 1.225.824 1.225.824.714 1.223 1.873.87 2.33.665.072-.517.278-.87.507-1.07-1.777-.2-3.644-.888-3.644-3.953 0-.873.31-1.587.823-2.147-.09-.202-.36-1.015.07-2.117 0 0 .67-.215 2.2.82.64-.178 1.32-.266 2-.27.68.004 1.36.092 2 .27 1.52-1.035 2.19-.82 2.19-.82.43 1.102.16 1.915.08 2.117.51.56.82 1.274.82 2.147 0 3.073-1.87 3.75-3.65 3.947.28.24.54.73.54 1.48 0 1.07-.01 1.93-.01 2.19 0 .21.14.46.55.38C13.71 14.53 16 11.53 16 8c0-4.418-3.582-8-8-8"/></symbol>
<symbol id="googleplus" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M5.09 7.273v1.745h2.89c-.116.75-.873 2.197-2.887 2.197-1.737 0-3.155-1.44-3.155-3.215S3.353 4.785 5.09 4.785c.99 0 1.652.422 2.03.786l1.382-1.33c-.887-.83-2.037-1.33-3.41-1.33C2.275 2.91 0 5.19 0 8s2.276 5.09 5.09 5.09c2.94 0 4.888-2.065 4.888-4.974 0-.334-.036-.59-.08-.843H5.09zm10.91 0h-1.455V5.818H13.09v1.455h-1.454v1.454h1.455v1.455h1.46V8.727H16"/></symbol>
<symbol id="instagram" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M8 0C5.827 0 5.555.01 4.702.048 3.85.088 3.27.222 2.76.42c-.526.204-.973.478-1.417.923-.445.444-.72.89-.923 1.417-.198.51-.333 1.09-.372 1.942C.008 5.555 0 5.827 0 8s.01 2.445.048 3.298c.04.852.174 1.433.372 1.942.204.526.478.973.923 1.417.444.445.89.72 1.417.923.51.198 1.09.333 1.942.372.853.04 1.125.048 3.298.048s2.445-.01 3.298-.048c.852-.04 1.433-.174 1.942-.372.526-.204.973-.478 1.417-.923.445-.444.72-.89.923-1.417.198-.51.333-1.09.372-1.942.04-.853.048-1.125.048-3.298s-.01-2.445-.048-3.298c-.04-.852-.174-1.433-.372-1.942-.204-.526-.478-.973-.923-1.417-.444-.445-.89-.72-1.417-.923-.51-.198-1.09-.333-1.942-.372C10.445.008 10.173 0 8 0zm0 1.44c2.136 0 2.39.01 3.233.048.78.036 1.203.166 1.485.276.374.145.64.318.92.598.28.28.453.546.598.92.11.282.24.705.276 1.485.038.844.047 1.097.047 3.233s-.01 2.39-.05 3.233c-.04.78-.17 1.203-.28 1.485-.15.374-.32.64-.6.92-.28.28-.55.453-.92.598-.28.11-.71.24-1.49.276-.85.038-1.1.047-3.24.047s-2.39-.01-3.24-.05c-.78-.04-1.21-.17-1.49-.28-.38-.15-.64-.32-.92-.6-.28-.28-.46-.55-.6-.92-.11-.28-.24-.71-.28-1.49-.03-.84-.04-1.1-.04-3.23s.01-2.39.04-3.24c.04-.78.17-1.21.28-1.49.14-.38.32-.64.6-.92.28-.28.54-.46.92-.6.28-.11.7-.24 1.48-.28.85-.03 1.1-.04 3.24-.04zm0 2.452c-2.27 0-4.108 1.84-4.108 4.108 0 2.27 1.84 4.108 4.108 4.108 2.27 0 4.108-1.84 4.108-4.108 0-2.27-1.84-4.108-4.108-4.108zm0 6.775c-1.473 0-2.667-1.194-2.667-2.667 0-1.473 1.194-2.667 2.667-2.667 1.473 0 2.667 1.194 2.667 2.667 0 1.473-1.194 2.667-2.667 2.667zm5.23-6.937c0 .53-.43.96-.96.96s-.96-.43-.96-.96.43-.96.96-.96.96.43.96.96z"/></symbol>
<symbol id="linkedin" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M13.632 13.635h-2.37V9.922c0-.886-.018-2.025-1.234-2.025-1.235 0-1.424.964-1.424 1.96v3.778h-2.37V6H8.51v1.04h.03c.318-.6 1.092-1.233 2.247-1.233 2.4 0 2.845 1.58 2.845 3.637v4.188zM3.558 4.955c-.762 0-1.376-.617-1.376-1.377 0-.758.614-1.375 1.376-1.375.76 0 1.376.617 1.376 1.375 0 .76-.617 1.377-1.376 1.377zm1.188 8.68H2.37V6h2.376v7.635zM14.816 0H1.18C.528 0 0 .516 0 1.153v13.694C0 15.484.528 16 1.18 16h13.635c.652 0 1.185-.516 1.185-1.153V1.153C16 .516 15.467 0 14.815 0z" fill-rule="nonzero"/></symbol>
<symbol id="pinterest" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M8 0C3.582 0 0 3.582 0 8c0 3.39 2.108 6.285 5.084 7.45-.07-.633-.133-1.604.028-2.295.146-.625.938-3.977.938-3.977s-.24-.48-.24-1.188c0-1.11.646-1.943 1.448-1.943.683 0 1.012.513 1.012 1.127 0 .687-.436 1.713-.662 2.664-.19.797.4 1.445 1.185 1.445 1.42 0 2.514-1.498 2.514-3.662 0-1.91-1.376-3.25-3.342-3.25-2.276 0-3.61 1.71-3.61 3.47 0 .69.263 1.43.593 1.83.066.08.075.15.057.23-.06.25-.196.8-.223.91-.035.15-.115.18-.268.11C3.516 10.46 2.89 9 2.89 7.82c0-2.52 1.834-4.84 5.287-4.84 2.774 0 4.932 1.98 4.932 4.62 0 2.76-1.74 4.98-4.16 4.98-.81 0-1.57-.42-1.84-.92l-.5 1.9c-.18.698-.67 1.57-1 2.1.75.23 1.54.357 2.37.357 4.41 0 8-3.58 8-8s-3.59-8-8-8z" fill-rule="nonzero"/></symbol>
<symbol id="rss" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M12.8 16C12.8 8.978 7.022 3.2 0 3.2V0c8.777 0 16 7.223 16 16h-3.2zM2.194 11.61c1.21 0 2.195.985 2.195 2.196 0 1.21-.99 2.194-2.2 2.194C.98 16 0 15.017 0 13.806c0-1.21.983-2.195 2.194-2.195zM10.606 16h-3.11c0-4.113-3.383-7.497-7.496-7.497v-3.11c5.818 0 10.606 4.79 10.606 10.607z"/></symbol>
<symbol id="stackoverflow" class="svg-icon" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M12.658 14.577v-4.27h1.423V16H1.23v-5.693h1.42v4.27h10.006zm-8.583-1.423h7.16V11.73h-7.16v1.424zm.173-3.235l6.987 1.46.3-1.38L4.55 8.54l-.302 1.38zm.906-3.37l6.47 3.02.602-1.3-6.47-3.02-.602 1.29zm1.81-3.19l5.478 4.57.906-1.08L7.87 2.28l-.9 1.078zM10.502 0L9.338.863l4.27 5.735 1.164-.862L10.5 0z"/></symbol>
<symbol id="twitter" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M16 3.038c-.59.26-1.22.437-1.885.517.677-.407 1.198-1.05 1.443-1.816-.634.37-1.337.64-2.085.79-.598-.64-1.45-1.04-2.396-1.04-1.812 0-3.282 1.47-3.282 3.28 0 .26.03.51.085.75-2.728-.13-5.147-1.44-6.766-3.42C.83 2.58.67 3.14.67 3.75c0 1.14.58 2.143 1.46 2.732-.538-.017-1.045-.165-1.487-.41v.04c0 1.59 1.13 2.918 2.633 3.22-.276.074-.566.114-.865.114-.21 0-.41-.02-.61-.058.42 1.304 1.63 2.253 3.07 2.28-1.12.88-2.54 1.404-4.07 1.404-.26 0-.52-.015-.78-.045 1.46.93 3.18 1.474 5.04 1.474 6.04 0 9.34-5 9.34-9.33 0-.14 0-.28-.01-.42.64-.46 1.2-1.04 1.64-1.7z" fill-rule="nonzero"/></symbol>
<symbol id="youtube" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M0 7.345c0-1.294.16-2.59.16-2.59s.156-1.1.636-1.587c.608-.637 1.408-.617 1.764-.684C3.84 2.36 8 2.324 8 2.324s3.362.004 5.6.166c.314.038.996.04 1.604.678.48.486.636 1.588.636 1.588S16 6.05 16 7.346v1.258c0 1.296-.16 2.59-.16 2.59s-.156 1.102-.636 1.588c-.608.638-1.29.64-1.604.678-2.238.162-5.6.166-5.6.166s-4.16-.037-5.44-.16c-.356-.067-1.156-.047-1.764-.684-.48-.487-.636-1.587-.636-1.587S0 9.9 0 8.605v-1.26zm6.348 2.73V5.58l4.323 2.255-4.32 2.24z"/></symbol>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 8.3 KiB

61
css/base.css
View file

@ -1,61 +0,0 @@
body {
background-color: #F5F5F5;
color: #464E46;
font-family: 'Open Sans Condensed', sans-serif;
margin: 0;
/* Panels */ }
body .panel {
width: 100vw;
height: 100vh; }
body .accent {
color: #2196F3; }
body #landing {
display: flex;
justify-content: center;
align-items: center; }
body #landing .content {
display: flex;
justify-content: center; }
body #landing .content img {
border-radius: 50%;
max-width: 20%; }
body #landing .content .intro {
display: flex;
flex-direction: column;
justify-content: center;
margin-left: 1em; }
body #landing .content .intro h1 {
font-size: 4em;
margin: 0 0 0.5em 0; }
body #landing .content .intro h3 {
font-size: 1.5em;
margin: 0 0 0.5em 0; }
body #landing .content .intro p {
font-size: 1.2em;
margin: 0; }
body #landing .content .intro p .accent {
font-weight: bold; }
body #current_biz {
display: flex;
align-items: center;
flex-direction: column; }
body #current_biz > h1 {
font-size: 4em; }
body #current_biz .content {
display: flex;
justify-content: flex-start;
flex-wrap: wrap; }
body #current_biz .content .card {
flex: 0 1 calc(20% - 1em);
font-size: 1.5em;
margin: 1em; }
body #current_biz .content .card .badge-accent, body #current_biz .content .card .btn-accent {
background-color: #2196F3;
transition: 0.25s; }
body #current_biz .content .card .badge {
font-size: 0.9em;
padding: 0.2em; }
body #current_biz .content .card .btn-accent {
width: 100%; }
body #current_biz .content .card .btn-accent:hover {
box-shadow: inset 1000px 0 0 0 rgba(0, 0, 0, 0.5); }

82
current_work/2018/02/22/.html
View file

@ -1,82 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Begin Jekyll SEO tag v2.4.0 -->
<title>TB2 &amp; real-time news integration | Your awesome title</title>
<meta name="generator" content="Jekyll v3.7.2" />
<meta property="og:title" content="TB2 &amp; real-time news integration" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description." />
<meta property="og:description" content="Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description." />
<link rel="canonical" href="http://localhost:4000/current_work/2018/02/22/.html" />
<meta property="og:url" content="http://localhost:4000/current_work/2018/02/22/.html" />
<meta property="og:site_name" content="Your awesome title" />
<meta property="og:image" content="https://placehold.it/500x200" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2018-02-22T22:33:16-05:00" />
<script type="application/ld+json">
{"description":"Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description.","@type":"BlogPosting","url":"http://localhost:4000/current_work/2018/02/22/.html","image":"https://placehold.it/500x200","headline":"TB2 &amp; real-time news integration","dateModified":"2018-02-22T22:33:16-05:00","datePublished":"2018-02-22T22:33:16-05:00","mainEntityOfPage":{"@type":"WebPage","@id":"http://localhost:4000/current_work/2018/02/22/.html"},"@context":"http://schema.org"}</script>
<!-- End Jekyll SEO tag -->
<link rel="stylesheet" href="/assets/main.css">
<link type="application/atom+xml" rel="alternate" href="http://localhost:4000/feed.xml" title="Your awesome title" />
</head>
<body>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="http://localhost:4000/js/base.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link href="http://localhost:4000/css/base.css" rel="stylesheet"/>
<link href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300" rel="stylesheet">
</head>
<body>
<header></header>
<main class="page-content" aria-label="Content">
<div class="wrapper">
<article class="post h-entry" itemscope itemtype="http://schema.org/BlogPosting">
<header class="post-header">
<h1 class="post-title p-name" itemprop="name headline">TB2 &amp; real-time news integration</h1>
<p class="post-meta">
<time class="dt-published" datetime="2018-02-22T22:33:16-05:00" itemprop="datePublished">
Feb 22, 2018
</time>
</p>
</header>
<div class="post-content e-content" itemprop="articleBody">
</div>
<a class="u-url" href="/current_work/2018/02/22/.html" hidden></a>
</article>
</div>
</main>
<footer></footer>
</body>
</html>
</body>
</html>

82
current_work/2018/02/22/plaininbox.html
View file

@ -1,82 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Begin Jekyll SEO tag v2.4.0 -->
<title>PlainInbox | Your awesome title</title>
<meta name="generator" content="Jekyll v3.7.2" />
<meta property="og:title" content="PlainInbox" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="PlainInbox is a generalization of PlainEmail to arbitrary SMTP mailservers. The application provides a new kind of workflow that treats your inbox as a stack, reducing distraction while you process each piece of mail thrown your way." />
<meta property="og:description" content="PlainInbox is a generalization of PlainEmail to arbitrary SMTP mailservers. The application provides a new kind of workflow that treats your inbox as a stack, reducing distraction while you process each piece of mail thrown your way." />
<link rel="canonical" href="http://localhost:4000/current_work/2018/02/22/plaininbox.html" />
<meta property="og:url" content="http://localhost:4000/current_work/2018/02/22/plaininbox.html" />
<meta property="og:site_name" content="Your awesome title" />
<meta property="og:image" content="https://placehold.it/500x200" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2018-02-22T22:33:16-05:00" />
<script type="application/ld+json">
{"description":"PlainInbox is a generalization of PlainEmail to arbitrary SMTP mailservers. The application provides a new kind of workflow that treats your inbox as a stack, reducing distraction while you process each piece of mail thrown your way.","@type":"BlogPosting","url":"http://localhost:4000/current_work/2018/02/22/plaininbox.html","image":"https://placehold.it/500x200","headline":"PlainInbox","dateModified":"2018-02-22T22:33:16-05:00","datePublished":"2018-02-22T22:33:16-05:00","mainEntityOfPage":{"@type":"WebPage","@id":"http://localhost:4000/current_work/2018/02/22/plaininbox.html"},"@context":"http://schema.org"}</script>
<!-- End Jekyll SEO tag -->
<link rel="stylesheet" href="/assets/main.css">
<link type="application/atom+xml" rel="alternate" href="http://localhost:4000/feed.xml" title="Your awesome title" />
</head>
<body>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="http://localhost:4000/js/base.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link href="http://localhost:4000/css/base.css" rel="stylesheet"/>
<link href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300" rel="stylesheet">
</head>
<body>
<header></header>
<main class="page-content" aria-label="Content">
<div class="wrapper">
<article class="post h-entry" itemscope itemtype="http://schema.org/BlogPosting">
<header class="post-header">
<h1 class="post-title p-name" itemprop="name headline">PlainInbox</h1>
<p class="post-meta">
<time class="dt-published" datetime="2018-02-22T22:33:16-05:00" itemprop="datePublished">
Feb 22, 2018
</time>
</p>
</header>
<div class="post-content e-content" itemprop="articleBody">
<p><strong>PlainInbox</strong> is a generalization of <a href="">PlainEmail</a> to arbitrary SMTP mailservers. The application provides a new kind of workflow that treats your inbox as a <em>stack</em>, reducing distraction while you process each piece of mail thrown your way.</p>
</div>
<a class="u-url" href="/current_work/2018/02/22/plaininbox.html" hidden></a>
</article>
</div>
</main>
<footer></footer>
</body>
</html>
</body>
</html>

1
docs/init.md
View file

@ -1 +0,0 @@

1
feed.xml
View file

@ -1 +0,0 @@
<?xml version="1.0" encoding="utf-8"?><feed xmlns="http://www.w3.org/2005/Atom" ><generator uri="https://jekyllrb.com/" version="3.7.2">Jekyll</generator><link href="http://localhost:4000/feed.xml" rel="self" type="application/atom+xml" /><link href="http://localhost:4000/" rel="alternate" type="text/html" /><updated>2018-02-23T00:46:04-05:00</updated><id>http://localhost:4000/</id><title type="html">Your awesome title</title><subtitle>Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description.</subtitle><entry><title type="html">PlainInbox</title><link href="http://localhost:4000/current_work/2018/02/22/plaininbox.html" rel="alternate" type="text/html" title="PlainInbox" /><published>2018-02-22T22:33:16-05:00</published><updated>2018-02-22T22:33:16-05:00</updated><id>http://localhost:4000/current_work/2018/02/22/plaininbox</id><content type="html" xml:base="http://localhost:4000/current_work/2018/02/22/plaininbox.html">&lt;p&gt;&lt;strong&gt;PlainInbox&lt;/strong&gt; is a generalization of &lt;a href=&quot;&quot;&gt;PlainEmail&lt;/a&gt; to arbitrary SMTP mailservers. The application provides a new kind of workflow that treats your inbox as a &lt;em&gt;stack&lt;/em&gt;, reducing distraction while you process each piece of mail thrown your way.&lt;/p&gt;</content><author><name></name></author><summary type="html">PlainInbox is a generalization of PlainEmail to arbitrary SMTP mailservers. The application provides a new kind of workflow that treats your inbox as a stack, reducing distraction while you process each piece of mail thrown your way.</summary><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://placehold.it/500x200" /></entry><entry><title type="html">TB2 &amp;amp; real-time news integration</title><link href="http://localhost:4000/current_work/2018/02/22/.html" rel="alternate" type="text/html" title="TB2 &amp; real-time news integration" /><published>2018-02-22T22:33:16-05:00</published><updated>2018-02-22T22:33:16-05:00</updated><id>http://localhost:4000/current_work/2018/02/22/</id><content type="html" xml:base="http://localhost:4000/current_work/2018/02/22/.html"></content><author><name></name></author><summary type="html"></summary><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://placehold.it/500x200" /></entry></feed>

29
index.html
View file

@ -1,2 +1,27 @@
Something new coming soon. :)
--M
<html>
<head>
<link href='style.css' rel='stylesheet'/>
<script defer src="https://use.fontawesome.com/releases/v5.0.9/js/all.js" integrity="sha384-8iPTk2s/jMVj81dnzb/iFR2sdA7u06vHJyyLlAd4snFpCl/SnyUjRrbdJsw1pGIl" crossorigin="anonymous"></script>
<link href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300" rel="stylesheet">
<meta type='og:image' content='socialmedia.PNG'/>
</head>
<body>
<span id='backdrop'>marc</span>
<main>
<img id='me' src='me.png'/>
<h1>Hello! My name is <span>Marc</span>!</h1>
<h2>I like <span>computer engineering</span>, <span>software development</span>, <span>teaching</span> and <span>journalism</span>.</h2>
<nav id='links'>
<a href='marccataford-april2018.pdf' target='_blank'><i class="fa fa-3x fa-file-alt"></i>Resume</a>
<a href='https://github.com/mcataford' target='_blank'><i class="fab fa-3x fa-github"></i>@mcataford</a>
<a href='https://www.linkedin.com/in/marccataford'><i class="fab fa-3x fa-linkedin-in"></i>@marccataford</a>
<a href='https://www.twitter.com/marccataford' target='_blank'><i class="fab fa-3x fa-twitter"></i>@marccataford</a>
<a href='mailto:marc@marccataford.com' target='_blank'><i class="fas fa-3x fa-at"></i>Email</a>
</nav>
</main>
</body>
</html>

4
js/base.js
View file

@ -1,4 +0,0 @@
$(document).ready((
) => {});

94
js/svgDraw.js
View file

@ -1,94 +0,0 @@
//helper functions, it turned out chrome doesn't support Math.sgn()
function signum(x) {
return (x < 0) ? -1 : 1;
}
function absolute(x) {
return (x < 0) ? -x : x;
}
function drawPath(svg, path, startX, startY, endX, endY) {
// get the path's stroke width (if one wanted to be really precize, one could use half the stroke size)
var stroke = parseFloat(path.attr("stroke-width"));
// check if the svg is big enough to draw the path, if not, set heigh/width
if (svg.attr("height") < endY) svg.attr("height", endY);
if (svg.attr("width" ) < (startX + stroke) ) svg.attr("width", (startX + stroke));
if (svg.attr("width" ) < (endX + stroke) ) svg.attr("width", (endX + stroke));
var deltaX = (endX - startX) * 0.15;
var deltaY = (endY - startY) * 0.15;
// for further calculations which ever is the shortest distance
var delta = deltaY < absolute(deltaX) ? deltaY : absolute(deltaX);
// set sweep-flag (counter/clock-wise)
// if start element is closer to the left edge,
// draw the first arc counter-clockwise, and the second one clock-wise
var arc1 = 0; var arc2 = 1;
if (startX > endX) {
arc1 = 1;
arc2 = 0;
}
// draw tha pipe-like path
// 1. move a bit down, 2. arch, 3. move a bit to the right, 4.arch, 5. move down to the end
path.attr("d", "M" + startX + " " + startY +
" V" + (startY + delta) +
" A" + delta + " " + delta + " 0 0 " + arc1 + " " + (startX + delta*signum(deltaX)) + " " + (startY + 2*delta) +
" H" + (endX - delta*signum(deltaX)) +
" A" + delta + " " + delta + " 0 0 " + arc2 + " " + endX + " " + (startY + 3*delta) +
" V" + endY );
}
function connectElements(svg, path, startElem, endElem) {
var svgContainer= $("#svgContainer");
// if first element is lower than the second, swap!
if(startElem.offset().top > endElem.offset().top){
var temp = startElem;
startElem = endElem;
endElem = temp;
}
// get (top, left) corner coordinates of the svg container
var svgTop = svgContainer.offset().top;
var svgLeft = svgContainer.offset().left;
// get (top, left) coordinates for the two elements
var startCoord = startElem.offset();
var endCoord = endElem.offset();
// calculate path's start (x,y) coords
// we want the x coordinate to visually result in the element's mid point
var startX = startCoord.left + 0.5*startElem.outerWidth() - svgLeft; // x = left offset + 0.5*width - svg's left offset
var startY = startCoord.top + startElem.outerHeight() - svgTop; // y = top offset + height - svg's top offset
// calculate path's end (x,y) coords
var endX = endCoord.left + 0.5*endElem.outerWidth() - svgLeft;
var endY = endCoord.top - svgTop;
// call function for drawing the path
drawPath(svg, path, startX, startY, endX, endY);
}
function connectAll() {
// connect all the paths you want!
connectElements($("#svg1"), $("#path1"), $(".current1"), $(".current2"));
connectElements($("#svg1"), $("#path2"), $(".current2"), $(".current3"));
connectElements($("#svg1"), $("#path3"), $(".current3"), $(".current4") );
}
$(document).ready(function() {
// reset svg each time
$("#svg1").attr("height", "0");
$("#svg1").attr("width", "0");
connectAll();
});
$(window).resize(function () {
// reset svg each time
$("#svg1").attr("height", "0");
$("#svg1").attr("width", "0");
connectAll();
});

BIN
marccataford-april2018.pdf Normal file
View file

Binary file not shown.

BIN
me.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.8 KiB

BIN
socialmedia.PNG Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 21 KiB

104
style.css Normal file
View file

@ -0,0 +1,104 @@
body {
margin: 0;
height: 100%;
font-family: 'Open Sans Condensed', sans-serif;
}
main {
display: flex;
justify-content: space-around;
align-items: center;
flex-direction: column;
height: calc(100vh - 2em);
padding: 1em 0;
}
#backdrop {
font-size:60vh;
position: absolute;
z-index: -100;
color: rgb(54, 193, 82);
opacity: 0.1;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) scale(0);
text-transform: uppercase;
animation-name: init_me2;
animation-duration: 0.75s;
animation-timing-function:cubic-bezier(0,1.46,.9,.96);
animation-fill-mode: forwards;
}
#me {
max-height: 60vh;
border-radius: 50%;
background-color: rgb(54, 193, 82);
animation-name: init_me;
animation-delay: 0.5s;
animation-duration: 0.75s;
animation-timing-function:cubic-bezier(0,1.46,.9,.96);
animation-fill-mode: forwards;
transform: scale(0);
}
h1, h2 {
animation-name: init_me;
animation-delay: 0.5s;
animation-duration: 0.75s;
animation-timing-function:cubic-bezier(0,1.46,.9,.96);
animation-fill-mode: forwards;
transform: scale(0);
}
h1 { font-size: 1.6em; }
h1 span { color: rgb(54, 193, 82); font-weight: bold; text-transform: uppercase;}
h2 { font-size: 1.4em; }
h2 span { color: rgb(54, 193, 82); font-weight: bold;}
#links {
width: 50%;
display: flex;
justify-content: center;
animation-name: init_me;
animation-delay: 1.25s;
animation-duration: 0.25s;
animation-fill-mode: forwards;
transform: scale(0);
}
#links a {
color: inherit;
margin: 0.25em;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
flex: 1 0 calc(100%/5 - 0.5em);
}
#links svg {
color: rgb(54, 193, 82);
}
@keyframes init_me {
0% { transform: scale(0); }
100% { transform: scale(1); }
}
@keyframes init_me2 {
0% { transform: translate(-50%, -50%) scale(0); }
100% { transform: translate(-50%, -50%) scale(1); }
}