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

Implement topic list in menu bar

Browse source
This commit is contained in:
Bill Nibz 2018-01-13 15:34:13 -05:00
parent ee69b6e674
commit 00bbe19901
7 changed files with 86 additions and 151 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

50
_includes/cor_menu.html Normal file
View file

@ -0,0 +1,50 @@
<div class="cor_menu">
<div class="cor_topics">
<div><a href="/">Home</a></div>
{% for topic in topics %}
<div><a href="/topics/{{ topic.title }}">{{ topic.title }}</a></div>
{% endfor %}
</div>
<div class="cor_footer">
<div class="" id="about">
<h2>The Site</h2>
<p>This site is a small slice of internet real-estate that I use for
occasional writing. Nothing I say is visionary or profound. I
will tend to focus on technology, gaming, and philosophy.</p>
<h2>The Vagabond</h2>
<p>My name is Bill Niblock. I'm a computer scientist by education, a
technologist by trade, a gamer by hobby, and a philosopher by
accident.</p>
</div>
<div id="social">
<div class="">
<a href="https://github.com/VagabondAzulien">
<img src="{{ site.url }}/src/images/github_light.png"
width="32" height="32" alt="GitHub"
title="My GitHub Repos" />
</a>
</div>
<div class="">
<a href="https://twitter.com/Azulien">
<img src="{{ site.url }}/src/images/twitter_light.png"
width="32" height="32" alt="Twitter"
title="My Twitter Feed" />
</a>
</div>
<div class="">
<a href="https://www.twitch.tv/vagabondazulien/profile">
<img src="{{ site.url }}/src/images/twitch_light.png"
width="32" height="32" alt="Twitch"
title="My Twitch Profile" />
</a>
</div>
<div class="">
<a href="https://steamcommunity.com/id/azulien">
<img src="{{ site.url }}/src/images/steam_light.png"
width="32" height="32" alt="Steam"
title="My Steam Profile" />
</a>
</div>
</div>
</div>
</div>

2
_includes/topics.html
View file

@ -6,7 +6,7 @@
<div class="" id="date">{{ post.pub }}</div>
<div class="" id="tags">
{% for topic in post.topics %}
<a href="/topics/{{topic}}.html">{{topic}}</a>
<a href="/topics/{{topic}}">{{topic}}</a>
{% endfor %}
</div>
</div>

47
_layouts/corrupt_collection.html
View file

@ -22,52 +22,7 @@
{{ content }}
</div>
</div>
<div class="cor_menu">
<div class="" id="tags">
</div>
<div class="cor_footer">
<div class="" id="about">
<h2>The Site</h2>
<p>This site is a small slice of internet real-estate that I use for
occasional writing. Nothing I say is visionary or profound. I
will tend to focus on technology, gaming, and philosophy.</p>
<h2>The Vagabond</h2>
<p>My name is Bill Niblock. I'm a computer scientist by education, a
technologist by trade, a gamer by hobby, and a philosopher by
mistake.</p>
</div>
<div id="social">
<div class="">
<a href="https://github.com/VagabondAzulien">
<img src="{{ site.url }}/src/images/github_light.png"
width="32" height="32" alt="GitHub"
title="My GitHub Repos" />
</a>
</div>
<div class="">
<a href="https://twitter.com/Azulien">
<img src="{{ site.url }}/src/images/twitter_light.png"
width="32" height="32" alt="Twitter"
title="My Twitter Feed" />
</a>
</div>
<div class="">
<a href="https://www.twitch.tv/vagabondazulien/profile">
<img src="{{ site.url }}/src/images/twitch_light.png"
width="32" height="32" alt="Twitch"
title="My Twitch Profile" />
</a>
</div>
<div class="">
<a href="https://steamcommunity.com/id/azulien">
<img src="{{ site.url }}/src/images/steam_light.png"
width="32" height="32" alt="Steam"
title="My Steam Profile" />
</a>
</div>
</div>
</div>
</div>
{% include cor_menu.html %}
</div>
</body>
</html>

51
_layouts/corrupt_index.html
View file

@ -19,57 +19,12 @@
</div>
<div id="content">
{{ content }}
</div>
<div id="all_button">
<a href="/topics/all.html">All Posts</a>
</div>
</div>
<div class="cor_menu">
<div class="" id="tags">
</div>
<div class="cor_footer">
<div class="" id="about">
<h2>The Site</h2>
<p>This site is a small slice of internet real-estate that I use for
occasional writing. Nothing I say is visionary or profound. I
will tend to focus on technology, gaming, and philosophy.</p>
<h2>The Vagabond</h2>
<p>My name is Bill Niblock. I'm a computer scientist by education, a
technologist by trade, a gamer by hobby, and a philosopher by
mistake.</p>
</div>
<div id="social">
<div class="">
<a href="https://github.com/VagabondAzulien">
<img src="{{ site.url }}/src/images/github_light.png"
width="32" height="32" alt="GitHub"
title="My GitHub Repos" />
</a>
</div>
<div class="">
<a href="https://twitter.com/Azulien">
<img src="{{ site.url }}/src/images/twitter_light.png"
width="32" height="32" alt="Twitter"
title="My Twitter Feed" />
</a>
</div>
<div class="">
<a href="https://www.twitch.tv/vagabondazulien/profile">
<img src="{{ site.url }}/src/images/twitch_light.png"
width="32" height="32" alt="Twitch"
title="My Twitch Profile" />
</a>
</div>
<div class="">
<a href="https://steamcommunity.com/id/azulien">
<img src="{{ site.url }}/src/images/steam_light.png"
width="32" height="32" alt="Steam"
title="My Steam Profile" />
</a>
</div>
<div id="all_button">
<a href="/topics/all">All Posts</a>
</div>
</div>
</div>
{% include cor_menu.html %}
</div>
</body>
</html>

47
_layouts/corrupt_post.html
View file

@ -22,52 +22,7 @@
<h4>[{{ page.author }}][{{ page.pub }}][{{ page.tags }}]</h4>
</div>
</div>
<div class="cor_menu">
<div class="" id="tags">
</div>
<div class="cor_footer">
<div class="" id="about">
<h2>The Site</h2>
<p>This site is a small slice of internet real-estate that I use for
occasional writing. Nothing I say is visionary or profound. I
will tend to focus on technology, gaming, and philosophy.</p>
<h2>The Vagabond</h2>
<p>My name is Bill Niblock. I'm a computer scientist by education, a
technologist by trade, a gamer by hobby, and a philosopher by
mistake.</p>
</div>
<div id="social">
<div class="">
<a href="https://github.com/VagabondAzulien">
<img src="{{ site.url }}/src/images/github_light.png"
width="32" height="32" alt="GitHub"
title="My GitHub Repos" />
</a>
</div>
<div class="">
<a href="https://twitter.com/Azulien">
<img src="{{ site.url }}/src/images/twitter_light.png"
width="32" height="32" alt="Twitter"
title="My Twitter Feed" />
</a>
</div>
<div class="">
<a href="https://www.twitch.tv/vagabondazulien/profile">
<img src="{{ site.url }}/src/images/twitch_light.png"
width="32" height="32" alt="Twitch"
title="My Twitch Profile" />
</a>
</div>
<div class="">
<a href="https://steamcommunity.com/id/azulien">
<img src="{{ site.url }}/src/images/steam_light.png"
width="32" height="32" alt="Steam"
title="My Steam Profile" />
</a>
</div>
</div>
</div>
</div>
{% include cor_menu.html %}
</div>
</body>
</html>

2
index.html
View file

@ -10,7 +10,7 @@
<div class="" id="date">{{ post.pub }}</div>
<div class="" id="tags">
{% for topic in post.topics %}
<a href="/topics/{{topic}}.html">{{topic}}</a>
<a href="/topics/{{topic}}">{{topic}}</a>
{% endfor %}
</div>
</div>

38
src/styles/corrupt.css
View file

@ -66,6 +66,8 @@ a:hover {
display: flex;
background-color: #202020;
z-index: 2; width: 100%;
border-top: 1px solid var(--hilite);
box-shadow: 0px 0px 30px 0px var(--hilite);
}
.cor_menu a:link,a:visited,a:focus {
@ -78,11 +80,22 @@ a:hover {
color: white;
}
.cor_topics {
display: flex; flex-flow: row wrap; justify-content: center;
width: 100%;
font: 1.0em "Lucida Sans Unicode", "Lucida Grande", sans-serif;
text-align: center; color: darkgrey; letter-spacing: 0.6em; line-height: 2.0em;
padding: 10px;
}
.cor_topics div {
padding: 1em 1em 0em 1em;
}
.cor_footer {
display: flex; flex-flow: row wrap;
width: 100%;
text-align: center;
border-top: 1px solid var(--hilite);
box-shadow: 0px 0px 30px 0px var(--hilite);
}
.cor_footer #about {
@ -219,14 +232,16 @@ a:hover {
}
/* Mobile First */
@media only screen and (min-width: 1250px) and (min-height: 750px) {
.title div {
font: 1.2em "Lucida Sans Unicode", "Lucida Grande", sans-serif;
@media only screen and (min-width: 768px) {
.title div { font: 1.2em "Lucida Sans Unicode", "Lucida Grande", sans-serif;
color: darkgrey; letter-spacing: 1.2em;
}
.title div::first-letter {
font: 1.2em "Lucida Sans Unicode", "Lucida Grande", sans-serif;
}
}
@media only screen and (min-width: 1250px) and (min-height: 750px) {
.cor_content {
width: 80%;
}
@ -243,11 +258,16 @@ a:hover {
}
.cor_menu {
width: 20%;
}
.cor_footer {
position: fixed;
bottom: 0;
border: none;
box-shadow: unset;
}
.cor_topics {
position: fixed; top: 75px; right: 0px;
font: 1.0em "Lucida Sans Unicode", "Lucida Grande", sans-serif;
text-align: right; color: darkgrey; letter-spacing: 0.6em; line-height: 2.0em;
padding: 10px;
}
.cor_footer {
position: fixed; bottom: 0; width: unset;
}
}