andrew/asimonson1125.github.io
1
0
Fork 0
mirror of https://github.com/asimonson1125/asimonson1125.github.io.git synced 2026-02-25 05:09:49 -06:00
Code Issues Packages Projects Releases Wiki Activity

nav box size/toggle patch

Browse Source
This commit is contained in:
Andrew Simonson
2023-02-01 21:56:03 -06:00
parent 3474891c2c
commit 8193a6109e
6 changed files with 30 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/static/css/App.css
View File

@@ -149,6 +149,7 @@ a {
font-size: 1.2rem;
font-size: 1rem;
background-color: rgb(156, 49, 45, .4);
cursor: pointer;
}
.navElement:hover {

2
src/static/js/checkbox.js
View File

@@ -1,4 +1,4 @@
function toggle(dir) {
function toggleCheckbox(dir) {
let toggles = document.querySelectorAll(
".checkbox-wrapper input[type=checkbox]"
);

21
src/static/js/responsive.js
View File

@@ -4,13 +4,6 @@ window.onload = function () {
function onLoaded() {
document.body.scrollTop = 0; // For Safari
document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
let navs = document.querySelectorAll(".navElement");
navs.forEach(function (element) {
element.onclick = function () {
window.scrollTo(0, 0);
toggleMenu();
};
});
window.onresize = function () {
resizer();
@@ -88,11 +81,9 @@ function toggleMenu() {
}
}
const loc = "https://asimonson.com"
// const loc = 'http://127.0.0.1:5000'
async function goto(location, push=true) {
let a = await fetch(loc + "/api/goto/" + location, {
async function goto(location, {push=true, toggle=true}={}) {
console.log(toggle)
let a = await fetch("/api/goto/" + location, {
credentials: "include",
method: "GET",
mode: "cors",
@@ -106,6 +97,10 @@ async function goto(location, push=true) {
eval(x.innerHTML);
});
document.querySelector("title").textContent = metadata['title'];
window.scrollTo(0, 0);
if(toggle){
toggleMenu();
}
if(push){
history.pushState(null, null, metadata['canonical']);
}
@@ -113,5 +108,5 @@ async function goto(location, push=true) {
function backButton() {
const location = window.location.pathname;
goto(location.substring(1), push=false); // remove slash, goto already does that
goto(location.substring(1), {push:false}); // remove slash, goto already does that
}

10
src/templates/about.html
View File

@@ -90,7 +90,7 @@
<input
type="checkbox"
id="pinned"
onClick='toggle("up")'
onClick='toggleCheckbox("up")'
checked
/>
<div class="slider round"></div>
@@ -99,20 +99,20 @@
</div>
<div class="flex start">
<label class="switch" htmlFor="education">
<input type="checkbox" id="education" onClick="toggle('up')" />
<input type="checkbox" id="education" onClick="toggleCheckbox('up')" />
<div class="slider round"></div>
<strong>Education</strong>
</label>
</div>
<div class="flex start">
<label class="switch" htmlFor="experience" onClick="toggle('up')">
<label class="switch" htmlFor="experience" onClick="toggleCheckbox('up')">
<input type="checkbox" id="experience" />
<div class="slider round"></div>
<strong>Work Experience</strong>
</label>
</div>
<div class="flex start">
<label class="switch" htmlFor="technical" onClick="toggle('up')">
<label class="switch" htmlFor="technical" onClick="toggleCheckbox('up')">
<input type="checkbox" id="technical" />
<div class="slider round"></div>
<strong>Technical</strong>
@@ -125,7 +125,7 @@
{{ timeitem(i, var["timeline"][i]["classes"], var["timeline"][i]["date"], var["timeline"][i]["content"])}}
{% endfor %}
</div>
<script>toggle('up')</script>
<script>toggleCheckbox('up')</script>
</div>
</div>
{% endblock %}

21
src/templates/header.html
View File

@@ -65,8 +65,7 @@
<noscript>You need to enable JavaScript to run this app.</noscript>
<div class="App">
<div class="header">
<div id="name-container" onclick="goto('home')">
<div id="name-container" onclick="goto('home', {toggle:false})">
<div class="glitch">
{% for i in range(9) %}
<div class="line name">
@@ -84,18 +83,18 @@
/>
<div class="navControl">
<div class="navBar">
<div class="navElement">
<p onclick="goto('home')">Home</p>
<div onClick="goto('home')" class="navElement">
<p>Home</p>
</div>
<div class="navElement">
<a href="Resume.pdf" target="_blank"> Resume </a>
</div>
<div class="navElement">
<p onclick="goto('projects')">Projects</p>
<a href="Resume.pdf" target="_blank" class="navElement">
<span>Resume</span>
</a>
<div onclick="goto('projects')" class="navElement">
<p>Projects</p>
</div>
<!-- <a href="/activities">Activities</a> -->
<div class="navElement">
<p onclick="goto('about')">About Me</p>
<div onclick="goto('about')" class="navElement">
<p>About Me</p>
</div>
</div>
</div>

8
src/templates/projects.html
View File

@@ -15,20 +15,20 @@
<div class="checkbox-wrapper">
<div class="flex start">
<label class="switch" htmlFor="pinned">
<input type="checkbox" id="pinned" onClick="toggle('')" checked/>
<input type="checkbox" id="pinned" onClick="toggleCheckbox('')" checked/>
<div class="slider round"></div>
<strong>Pinned</strong>
</label>
</div>
<div class="flex start">
<label class="switch" htmlFor="programming">
<input type="checkbox" id="programming" onClick="toggle('')" />
<input type="checkbox" id="programming" onClick="toggleCheckbox('')" />
<div class="slider round"></div>
<strong>Programming</strong>
</label>
</div>
<div class="flex start">
<label class="switch" htmlFor="geospacial" onClick="toggle('')">
<label class="switch" htmlFor="geospacial" onClick="toggleCheckbox('')">
<input type="checkbox" id="geospacial" />
<div class="slider round"></div>
<strong>Geospacial</strong>
@@ -42,5 +42,5 @@
{% endfor %}
</div>
</div>
<script>toggle('')</script>
<script>toggleCheckbox('')</script>
{% endblock %}