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

Fidgeting with navigation bar...

Browse source
This commit is contained in:
Bill Niblock 2015-03-08 15:50:17 -04:00
parent 257544b61b
commit 23b5271852
2 changed files with 24 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
_layouts/default.html
View file

@ -33,16 +33,13 @@
<li>Projects</li>
<ul id="projects">
<li>GitHub Page<br />
<div>[ Page ]</div>
<div>[ Source ]</div>
<div>[ Page ][ Source ]</div>
</li>
<li>Dot Files<br />
<div>[ Page ]</div>
<div>[ Source ]</div>
<div>[ Page ][ Source ]</div>
</li>
<li>Antennae<br />
<div>[ Page ]</div>
<div>[ Source ]</div>
<div>[ Page ][ Source ]</div>
</li>
<li> ... more ... </li>
</ul>

38
src/styles.css
View file

@ -57,10 +57,10 @@ header {
}
#navbar #bar {
position: absolute; top: 0px; right: 0px; bottom: 0px;
width: 0px; margin: 0px; padding: 0px; overflow-x: hidden;
position: absolute; top: 0px; right: -300px; bottom: 0px;
width: 300px; margin: 0px; padding: 0px; overflow-x: hidden;
background-color: #202020;
transition: width 0.5s ease;
transition: right 0.5s ease;
}
#navbar a {
@ -79,7 +79,7 @@ header {
}
#toggle-navbar:checked + #bar {
width: 300px;
right: 0px;
}
#bar #header {
@ -106,37 +106,41 @@ header {
padding: 10px;
}
#projects div {
text-align: center;
}
#navigation #posts {
list-style: none;
}
#navigation #expand {
padding: 0px 20px;
border-top: 1px solid grey;
border-bottom: 1px solid grey;
}
#bar #footer {
}
#follow {
position: absolute; bottom: 100px; left: 0px;
width: 100%; margin: 0px auto; padding: 0px;
position: absolute; bottom: 0px;
width: 100%;
padding: 10px 0px;
text-align: center;
}
#follow { }
#follow a {
padding: 0px 9px;
}
#info {
position: absolute; bottom: 0px;
padding: 10px; margin: 10px auto; overflow-x: hidden;
width: 100%; margin: 0px auto; text-align: center;
padding: 10px;
width: 100%;
}
#info #cw {
margin: 0px auto; padding: 10px 0px; width: 100%;
font: 0.9em "Lucida Sans Unicode", "Lucida Grande", sans-serif; text-align: center;
font: 0.9em "Lucida Sans Unicode", "Lucida Grande", sans-serif;
letter-spacing: 0.4em; color: grey;
}