Fixed header style again and added 'active' to navbar
This commit is contained in:
parent
7a018bd536
commit
074020ced7
@ -18,9 +18,9 @@
|
||||
|
||||
<div class="stuffarea">
|
||||
<ul class="navbar">
|
||||
<a href="/" id="about-link"><li><div class="button">About</div></li></a>
|
||||
<a href="/games" id="games-link"><li><div class="button">Games</div></li></a>
|
||||
<a href="#" id="blog-link"><li><div class="button">Blog</div></li></a>
|
||||
<a href="/" id="about-link"><li ><div class="button">About</div></li></a>
|
||||
<a href="/games" id="games-link"><li ><div class="button">Games</div></li></a>
|
||||
<a href="#" id="blog-link"><li class="active"><div class="button">Blog</div></li></a>
|
||||
</ul>
|
||||
<div id="about" class="hiddenarea" >
|
||||
<h1>Teascade</h1>
|
||||
|
@ -18,9 +18,9 @@
|
||||
|
||||
<div class="stuffarea">
|
||||
<ul class="navbar">
|
||||
<a href="/" id="about-link"><li><div class="button">About</div></li></a>
|
||||
<a href="/games" id="games-link"><li><div class="button">Games</div></li></a>
|
||||
<a href="/blog" id="blog-link"><li><div class="button">Blog</div></li></a>
|
||||
<a href="/" id="about-link"><li ><div class="button">About</div></li></a>
|
||||
<a href="/games" id="games-link"><li ><div class="button">Games</div></li></a>
|
||||
<a href="/blog" id="blog-link"><li ><div class="button">Blog</div></li></a>
|
||||
</ul>
|
||||
<div id="about" class="hiddenarea" >
|
||||
<h1>Teascade</h1>
|
||||
|
34
build.py
34
build.py
@ -35,32 +35,42 @@ def generate_page(template, page):
|
||||
rel_games = "/games"
|
||||
rel_blog = "/blog"
|
||||
|
||||
about_hidden = 'class="hiddenarea"'
|
||||
games_hidden = 'class="hiddenarea"'
|
||||
blog_hidden = 'class="hiddenarea"'
|
||||
blogtext_hidden = 'class="hiddenarea"'
|
||||
about_class = 'class="hiddenarea"'
|
||||
games_class = 'class="hiddenarea"'
|
||||
blog_class = 'class="hiddenarea"'
|
||||
blogtext_class = 'class="hiddenarea"'
|
||||
about_btn_class = ''
|
||||
games_btn_class = ''
|
||||
blog_btn_class = ''
|
||||
|
||||
if (page == "about"):
|
||||
rel_about = "#"
|
||||
about_hidden = ""
|
||||
about_class = ""
|
||||
about_btn_class = 'class="active"'
|
||||
elif (page == "games"):
|
||||
rel_games = "#"
|
||||
games_hidden = ""
|
||||
games_class = ""
|
||||
games_btn_class = 'class="active"'
|
||||
elif (page == "blog"):
|
||||
rel_blog = "#"
|
||||
blog_hidden = ""
|
||||
blog_class = ""
|
||||
blog_btn_class = 'class="active"'
|
||||
elif (page == "blogtext"):
|
||||
rel_blogtext = "#"
|
||||
blogtext_hidden = ""
|
||||
blogtext_class = ""
|
||||
|
||||
content = content.replace("$relative_about$", rel_about);
|
||||
content = content.replace("$relative_games$", rel_games);
|
||||
content = content.replace("$relative_blog$", rel_blog);
|
||||
|
||||
content = content.replace("$about_is_hidden$", about_hidden);
|
||||
content = content.replace("$games_is_hidden$", games_hidden);
|
||||
content = content.replace("$blog_is_hidden$", blog_hidden);
|
||||
content = content.replace("$blogtext_is_hidden$", blogtext_hidden);
|
||||
content = content.replace("$about_class$", about_class);
|
||||
content = content.replace("$games_class$", games_class);
|
||||
content = content.replace("$blog_class$", blog_class);
|
||||
content = content.replace("$blogtext_class$", blogtext_class);
|
||||
|
||||
content = content.replace("$about_btn_class$", about_btn_class);
|
||||
content = content.replace("$games_btn_class$", games_btn_class);
|
||||
content = content.replace("$blog_btn_class$", blog_btn_class);
|
||||
return content;
|
||||
|
||||
def build_blogposts():
|
||||
|
14
css/main.css
14
css/main.css
@ -78,21 +78,21 @@ body, html {
|
||||
.cont .stuffarea h6 {
|
||||
margin: 0;
|
||||
color: #ff0091; }
|
||||
.cont .stuffarea .blogpost {
|
||||
.cont .stuffarea h2.blogtitle {
|
||||
padding: 0.5em;
|
||||
color: #ff0091;
|
||||
transition: 0.2s;
|
||||
margin: 0; }
|
||||
.cont .stuffarea h2.blogtitle:hover {
|
||||
cursor: pointer;
|
||||
background-color: #191919;
|
||||
transition: 0.2s; }
|
||||
.cont .stuffarea a {
|
||||
color: #ff0091; }
|
||||
.cont .stuffarea .timestamp {
|
||||
color: #636363;
|
||||
vertical-align: middle;
|
||||
font-size: 15px; }
|
||||
.cont .stuffarea h2:hover {
|
||||
cursor: pointer;
|
||||
background-color: #191919;
|
||||
transition: 0.2s; }
|
||||
.cont .stuffarea p {
|
||||
color: #fff; }
|
||||
.cont .stuffarea li {
|
||||
@ -123,6 +123,10 @@ body, html {
|
||||
background-color: #303030;
|
||||
transition: 0.2s;
|
||||
cursor: pointer; }
|
||||
.cont .stuffarea ul.navbar li.active {
|
||||
background-color: #252525; }
|
||||
.cont .stuffarea ul.navbar li.active:hover {
|
||||
background-color: #363636; }
|
||||
|
||||
noscript {
|
||||
color: #fff; }
|
||||
|
@ -1,6 +1,6 @@
|
||||
{
|
||||
"version": 3,
|
||||
"mappings": "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",
|
||||
"mappings": "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",
|
||||
"sources": ["../scss/main.scss"],
|
||||
"names": [],
|
||||
"file": "main.css"
|
||||
|
@ -18,9 +18,9 @@
|
||||
|
||||
<div class="stuffarea">
|
||||
<ul class="navbar">
|
||||
<a href="/" id="about-link"><li><div class="button">About</div></li></a>
|
||||
<a href="#" id="games-link"><li><div class="button">Games</div></li></a>
|
||||
<a href="/blog" id="blog-link"><li><div class="button">Blog</div></li></a>
|
||||
<a href="/" id="about-link"><li ><div class="button">About</div></li></a>
|
||||
<a href="#" id="games-link"><li class="active"><div class="button">Games</div></li></a>
|
||||
<a href="/blog" id="blog-link"><li ><div class="button">Blog</div></li></a>
|
||||
</ul>
|
||||
<div id="about" class="hiddenarea" >
|
||||
<h1>Teascade</h1>
|
||||
|
@ -18,9 +18,9 @@
|
||||
|
||||
<div class="stuffarea">
|
||||
<ul class="navbar">
|
||||
<a href="#" id="about-link"><li><div class="button">About</div></li></a>
|
||||
<a href="/games" id="games-link"><li><div class="button">Games</div></li></a>
|
||||
<a href="/blog" id="blog-link"><li><div class="button">Blog</div></li></a>
|
||||
<a href="#" id="about-link"><li class="active"><div class="button">About</div></li></a>
|
||||
<a href="/games" id="games-link"><li ><div class="button">Games</div></li></a>
|
||||
<a href="/blog" id="blog-link"><li ><div class="button">Blog</div></li></a>
|
||||
</ul>
|
||||
<div id="about" >
|
||||
<h1>Teascade</h1>
|
||||
|
@ -28,10 +28,12 @@ function openPage(page, new_url, renew_history) {
|
||||
return;
|
||||
}
|
||||
slideOpacity(function () {
|
||||
document.getElementById(window.currPage + "-link").children[0].className = "";
|
||||
document.getElementById(window.currPage).className = "hiddenarea";
|
||||
window.currPage = page;
|
||||
document.getElementById(page).style.opacity = "0";
|
||||
document.getElementById(page).className = "";
|
||||
document.getElementById(page + "-link").children[0].className = "active";
|
||||
var target = new_url || page;
|
||||
var targetPg = "/" + target;
|
||||
if (target == "about") {
|
||||
|
@ -95,14 +95,17 @@ body, html {
|
||||
}
|
||||
}
|
||||
|
||||
.blogpost {
|
||||
h2.blogtitle {
|
||||
padding: 0.5em;
|
||||
color: $pink;
|
||||
transition: 0.2s;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
p {
|
||||
}
|
||||
h2.blogtitle:hover {
|
||||
cursor: pointer;
|
||||
background-color: $dark - #060606;
|
||||
transition: 0.2s;
|
||||
}
|
||||
|
||||
a {
|
||||
@ -115,12 +118,6 @@ body, html {
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
h2:hover {
|
||||
cursor: pointer;
|
||||
background-color: $dark - #060606;
|
||||
transition: 0.2s;
|
||||
}
|
||||
|
||||
p {
|
||||
color: $regular;
|
||||
}
|
||||
@ -164,6 +161,14 @@ body, html {
|
||||
transition: 0.2s;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
li.active {
|
||||
background-color: $dark + #060606;
|
||||
}
|
||||
|
||||
li.active:hover {
|
||||
background-color: $dark + #060606 + #111;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -18,20 +18,20 @@
|
||||
|
||||
<div class="stuffarea">
|
||||
<ul class="navbar">
|
||||
<a href="$relative_about$" id="about-link"><li><div class="button">About</div></li></a>
|
||||
<a href="$relative_games$" id="games-link"><li><div class="button">Games</div></li></a>
|
||||
<a href="$relative_blog$" id="blog-link"><li><div class="button">Blog</div></li></a>
|
||||
<a href="$relative_about$" id="about-link"><li $about_btn_class$><div class="button">About</div></li></a>
|
||||
<a href="$relative_games$" id="games-link"><li $games_btn_class$><div class="button">Games</div></li></a>
|
||||
<a href="$relative_blog$" id="blog-link"><li $blog_btn_class$><div class="button">Blog</div></li></a>
|
||||
</ul>
|
||||
<div id="about" $about_is_hidden$ >
|
||||
<div id="about" $about_class$ >
|
||||
$about_content$
|
||||
</div>
|
||||
<div id="games" $games_is_hidden$ >
|
||||
<div id="games" $games_class$ >
|
||||
$games_content$
|
||||
</div>
|
||||
<div id="blog" $blog_is_hidden$ >
|
||||
<div id="blog" $blog_class$ >
|
||||
$blog_content$
|
||||
</div>
|
||||
<div id="blogtext" $blogtext_is_hidden$ >
|
||||
<div id="blogtext" $blogtext_class$ >
|
||||
<noscript>
|
||||
<p>Oh sorry, it looks like someone sent you a link to a blogtext (or something), but you don't have javascript enabled!</p>
|
||||
<p>Sorry to be the one to break the bad news for you, but we don't take javascript-absolutists kindly this 'round 'o town. So if you could kindly just press that "About" button and forget this ever happened, yeah?</p>
|
||||
|
@ -41,10 +41,12 @@ function openPage(page: string, new_url: string = null, renew_history=true) {
|
||||
if (page == window.currPage) { return; }
|
||||
|
||||
slideOpacity(() => {
|
||||
document.getElementById(window.currPage + "-link").children[0].className = ""
|
||||
document.getElementById(window.currPage).className = "hiddenarea";
|
||||
window.currPage = page;
|
||||
document.getElementById(page).style.opacity = "0";
|
||||
document.getElementById(page).className = "";
|
||||
document.getElementById(page + "-link").children[0].className = "active"
|
||||
let target = new_url || page;
|
||||
let targetPg = "/" + target;
|
||||
if (target == "about") { target = ""; targetPg = ""; };
|
||||
|
Loading…
Reference in New Issue
Block a user