184 lines
6.7 KiB
HTML
184 lines
6.7 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
|
||
<head>
|
||
<title>Evan Pratten</title>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
|
||
<!--[if lte IE 8]><script src="/assets/js/ie/html5shiv.js"></script><![endif]-->
|
||
<link rel="stylesheet" href="/assets/css/main.css" />
|
||
<!-- <link rel="stylesheet" href="/assets/css/custom.css" /> -->
|
||
<!--[if lte IE 9]><link rel="stylesheet" href="/assets/css/ie9.css" /><![endif]-->
|
||
<!--[if lte IE 8]><link rel="stylesheet" href="/assets/css/ie8.css" /><![endif]-->
|
||
|
||
<!-- Syntax highlight -->
|
||
<link rel="stylesheet" href="/assets/css/vs.css" />
|
||
</head>
|
||
|
||
<body>
|
||
|
||
<!-- Wrapper -->
|
||
<div id="wrapper">
|
||
|
||
<!-- Header -->
|
||
<header id="header" >
|
||
<a href="http://0.0.0.0:4000//" class="logo"><strong>Evan Pratten</strong> <span>retrylife</span></a>
|
||
<nav>
|
||
<!-- <a href="#menu">Menu</a> -->
|
||
</nav>
|
||
</header>
|
||
|
||
<!-- Menu -->
|
||
<!-- <nav id="menu">
|
||
<ul class="links">
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li><a href="http://0.0.0.0:4000//">Home</a></li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li><a href="http://0.0.0.0:4000/all_posts.html">All posts</a></li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
</ul>
|
||
<ul class="actions vertical">
|
||
<li><a href="#" class="button special fit">Get Started</a></li>
|
||
<li><a href="#" class="button fit">Log In</a></li>
|
||
</ul>
|
||
</nav> -->
|
||
|
||
<section id="banner" class="major" style="height:40vh">
|
||
<div class="inner">
|
||
<header class="major">
|
||
<h1>GitHub's CSS is boring. So I refreshed the design</h1>
|
||
</header>
|
||
<div class="content">
|
||
<p ></p>
|
||
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
|
||
<!-- Main -->
|
||
<div id="main" class="alt">
|
||
|
||
<!-- One -->
|
||
<section id="one">
|
||
<div class="inner">
|
||
|
||
<p><p>I have been using GitHub since 2017, and have been getting tired of GitHub’s theme. I didn’t need a huge change, just a small refresh. So, to solve this, I whipped out <a href="https://addons.mozilla.org/en-CA/firefox/addon/styl-us/">Stylus</a> and made a nice little CSS file for it.</p>
|
||
|
||
<h2 id="the-css">The CSS</h2>
|
||
<p>Here is the CSS. Feel free to play with it.</p>
|
||
|
||
<div class="language-css highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="k">@-moz-document</span> <span class="n">url-prefix</span><span class="p">(</span><span class="s1">"https://github.com/"</span><span class="p">)</span> <span class="p">{</span>
|
||
<span class="nc">.Header</span> <span class="p">{</span>
|
||
<span class="nl">background-color</span><span class="p">:</span> <span class="m">#1a3652</span><span class="p">;</span>
|
||
<span class="p">}</span>
|
||
|
||
<span class="nc">.repohead.experiment-repo-nav</span> <span class="p">{</span>
|
||
<span class="nl">background-color</span><span class="p">:</span> <span class="m">#fff</span><span class="p">;</span>
|
||
<span class="p">}</span>
|
||
<span class="nc">.reponav-item.selected</span> <span class="p">{</span>
|
||
<span class="nl">border-color</span><span class="p">:</span> <span class="m">#fff</span> <span class="m">#fff</span> <span class="m">#4a79a8</span><span class="p">;</span>
|
||
<span class="p">}</span>
|
||
|
||
<span class="nc">.btn.hover</span><span class="o">,</span>
|
||
<span class="nc">.btn</span><span class="nd">:hover</span><span class="o">,</span>
|
||
<span class="nc">.btn</span><span class="o">,</span>
|
||
<span class="nc">.btn</span> <span class="p">{</span>
|
||
<span class="nl">background-color</span><span class="p">:</span> <span class="m">#fafafa</span><span class="p">;</span>
|
||
<span class="nl">background-image</span><span class="p">:</span> <span class="n">linear-gradient</span><span class="p">(</span><span class="m">-180deg</span><span class="p">,</span> <span class="m">#fafafa</span><span class="p">,</span> <span class="m">#fafafa</span> <span class="m">90%</span><span class="p">);</span>
|
||
<span class="p">}</span>
|
||
|
||
<span class="nc">.btn-primary.hover</span><span class="o">,</span>
|
||
<span class="nc">.btn-primary</span><span class="nd">:hover</span><span class="o">,</span>
|
||
<span class="nc">.btn-primary</span><span class="o">,</span>
|
||
<span class="nc">.btn-primary</span> <span class="p">{</span>
|
||
<span class="nl">background-color</span><span class="p">:</span> <span class="m">#1aaa55</span><span class="p">;</span>
|
||
<span class="nl">background-image</span><span class="p">:</span> <span class="n">linear-gradient</span><span class="p">(</span><span class="m">-180deg</span><span class="p">,</span> <span class="m">#1aaa55</span><span class="p">,</span> <span class="m">#1aaa55</span> <span class="m">90%</span><span class="p">);</span>
|
||
<span class="p">}</span>
|
||
|
||
<span class="nc">.overall-summary</span> <span class="p">{}</span>
|
||
<span class="p">}</span>
|
||
</code></pre></div></div>
|
||
|
||
<h2 id="use-it-yourself">Use it yourself</h2>
|
||
<p>I put this theme on userstyles.org. You can download and install it by going to <a href="https://userstyles.org/styles/172679/ewpratten-s-githubtheme">my userstyles page</a>.</p>
|
||
</p>
|
||
</div>
|
||
</section>
|
||
|
||
</div>
|
||
|
||
<!-- Footer -->
|
||
<footer id="footer">
|
||
<div class="inner">
|
||
<ul class="icons">
|
||
|
||
<li><a href="https://twitter.com/ewpratten" class="icon alt fa-twitter" target="_blank"><span class="label">Twitter</span></a></li>
|
||
|
||
<li><a href="https://gitlab.com/u/ewpratten" class="icon alt fa-gitlab" target="_blank"><span class="label">GitLab</span></a></li>
|
||
|
||
<li><a href="https://github.com/ewpratten" class="icon alt fa-github" target="_blank"><span class="label">GitHub</span></a></li>
|
||
|
||
|
||
<li><a href="/feed.xml" class="icon alt fa-rss" target="_blank"><span class="label">RSS</span></a></li>
|
||
</ul>
|
||
<ul class="copyright">
|
||
<li>© Evan Pratten retrylife</li>
|
||
<li>Design: <a href="https://html5up.net" target="_blank">HTML5 UP</a></li>
|
||
|
||
</ul>
|
||
</div>
|
||
</footer>
|
||
|
||
</div>
|
||
|
||
<!-- Scripts -->
|
||
<script src="http://0.0.0.0:4000/assets/js/jquery.min.js"></script>
|
||
<script src="http://0.0.0.0:4000/assets/js/jquery.scrolly.min.js"></script>
|
||
<script src="http://0.0.0.0:4000/assets/js/jquery.scrollex.min.js"></script>
|
||
<script src="http://0.0.0.0:4000/assets/js/skel.min.js"></script>
|
||
<script src="http://0.0.0.0:4000/assets/js/util.js"></script>
|
||
<!--[if lte IE 8]><script src="http://0.0.0.0:4000/assets/js/ie/respond.min.js"></script><![endif]-->
|
||
<script src="http://0.0.0.0:4000/assets/js/main.js"></script>
|
||
|
||
<!-- Global site tag (gtag.js) - Google Analytics -->
|
||
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-74118570-2"></script>
|
||
<script>
|
||
window.dataLayer = window.dataLayer || [];
|
||
|
||
function gtag() {
|
||
dataLayer.push(arguments);
|
||
}
|
||
gtag('js', new Date());
|
||
|
||
gtag('config', 'UA-74118570-2');
|
||
</script>
|
||
|
||
</body>
|
||
|
||
</html> |