vagabond/the-internet-vagabond-dot-com
1
0
Fork 0
Code Issues 3 Pull requests Projects 2 Activity Actions

Updating WIP files

Browse source
This commit is contained in:
Bill Nibz 2015-02-18 23:01:37 -05:00
parent 9b24e183b5
commit e7a1bf3083
2 changed files with 53 additions and 43 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

56
index_wip.html
View file

@ -16,7 +16,6 @@
<ul id="title">
<li>The</li><li>Internet</li><li>Vagabond</li>
</ul>
<a href="#navbar">CLICK ME</a>
</header>
<div class="clean"></div>
@ -24,40 +23,41 @@
<main>
<div id="post">
<p>Welcome to The Internet Vagabond, a small slice of Internet real-estate for Bill Niblock. Nothing I say is visionary or profound, and sometimes it makes sense.</p>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> <br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
</div>
</main>
<div class="clean"></div>
<!--Sidebar -->
<nav id="navbar">
<ul id="follow">
<li id="github">[ G ]</li>
<li id="twitter">[ T ]</li>
<li id="twitch">[ S ]</li>
<li id="gplus">[ P ]</li>
<li id="flickr">[ F ]</li>
<li id="tumblr">[ U ]</li>
</ul>
<ul id="navigation">
<li>Home</li>
<li>Projects</li>
<ul id="projects">
<li>GitHub Page</li>
<li>Antennae</li>
<label for="toggle-navbar" id="toggle">&#9776</label>
<input type="checkbox" id="toggle-navbar" />
<div>
<ul id="navigation">
<li>Home</li>
<li>Projects</li>
<ul id="projects">
<li>GitHub Page</li>
<li>Antennae</li>
</ul>
</ul>
</ul>
<ul id="info">
<li>
<a href="http://www.wtfpl.net/">
<img src="http://www.wtfpl.net/wp-content/uploads/2012/12/wtfpl-badge-2.png"
width="80" height="15" alt="WTFPL" />
</a>
</li>
<li>Niblock&copy2015</li>
</ul>
<ul id="follow">
<li id="github">[ G ]</li>
<li id="twitter">[ T ]</li>
<li id="twitch">[ S ]</li>
<li id="gplus">[ P ]</li>
<li id="flickr">[ F ]</li>
<li id="tumblr">[ U ]</li>
</ul>
<ul id="info">
<li>Niblock&copy2015</li>
<li>
<a href="http://www.wtfpl.net/">
<img src="http://www.wtfpl.net/wp-content/uploads/2012/12/wtfpl-badge-2.png"
width="80" height="15" alt="WTFPL" />
</a>
</li>
</ul>
</div>
</nav>
<div class="clean"></div>

40
styles_wip.css
View file

@ -21,11 +21,6 @@ header {
box-shadow: 0px 2px 10px -5px blue;
}
header a {
position: absolute; top: 10px; right: 10px;
color: white; text-shadow: 0px 0px 5px blue;
}
#title {
float: left;
list-style: none;
@ -52,19 +47,33 @@ main {
/* Sidebar */
#navbar {
position: fixed; top: 0px; right: 0px; bottom: 0px;
width: 0px; margin: 0px; padding: 0px; z-index: 10;
width: 400px; margin: 0px; padding: 0px; z-index: 10; opacity: 100%
}
#navbar div {
position: absolute; top: 0px; right: 0px; bottom: 0px;
width: 0px; margin: 0px; padding: 0px; overflow: hidden; white-space: nowrap;
background-color: #202020;
transition: width 0.5s ease;
}
#navbar:target {
#navbar #toggle-navbar {
display:none;
}
#navbar #toggle {
position: absolute; right: 0px;
margin: 0px; padding: 13px 25px; z-index: 11;
font: 1.2em "Lucida Sans Unicode", "Lucida Grande", sans-serif;
color: darkgrey; text-shadow: 0px 0px 5px white;
}
#toggle-navbar:checked + div {
width: 300px;
}
#follow {
position: absolute; right: 0px; height: 32px;
overflow: hidden; white-space: nowrap;
float: right;
position: absolute; bottom: 100px;
list-style: none;
margin: 0px; padding: 0px; vertical-align: middle;
}
@ -75,20 +84,21 @@ main {
}
#navigation {
position: absolute; top: 50px; bottom: 40px;
position: absolute; top: 20%;
list-style: none;
margin: 10px;
}
#navigation li {
padding: 10px 0px;
padding: 10px 10px;
color: #888888;
}
#info {
float: left; position: absolute; bottom: 0px;
padding: 0px; margin: 0px auto; height: 20px;
position: absolute; bottom: 0px;
padding: 10px; margin: 10px auto;
list-style: none;
margin: 0px auto;
width: 100%; margin: 0px auto;
}
#info li {