Skip to content

Commit 211ee37

Browse files
AdamJAdamJ
committed
Updates to navigation and theme changes
1 parent 0604892 commit 211ee37

File tree

38 files changed

+657
-326
lines changed

38 files changed

+657
-326
lines changed

‎docs/404.html‎

Lines changed: 72 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,6 @@
2424
<script type="module" src="https://cdn.jsdelivr.net/npm/[email protected]/dist/cdn/beer.min.js"></script>
2525
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@shoelace-style/[email protected]/cdn/themes/light.css" />
2626
<script type="module" src="https://cdn.jsdelivr.net/npm/@shoelace-style/[email protected]/cdn/shoelace-autoloader.js"></script>
27-
<link href="https:///[email protected]/themes/prism.css" rel="stylesheet" />
2827
<link type="text/css" href="/css/style.css" rel="stylesheet" />
2928
<meta
3029
name="og:title"
@@ -44,15 +43,77 @@
4443
/>
4544
</head>
4645
<body>
47-
<main class="max">
48-
<div style="display: flex; flex-direction: column; align-items: center;">
49-
<div style="margin: 24px 0;">
50-
<img src="/img/404_outdoors.svg" alt="Lost in the mountains" height="400" width="400" loading="lazy">
46+
<nav id="nav" class="l max top">
47+
<header>
48+
<nav>
49+
<a href="/" alt="Link to home">
50+
<span class="display-none">Link to home</span>
51+
<img src="/img/Jolicoeur_iOS.png" class="circle" alt="Site logo" />
52+
</a>
53+
</nav>
54+
</header>
55+
<div class="max"></div>
56+
<a href="/about" class="active secondary" alt="Link to my About page">
57+
<i>info</i>
58+
<span>About</span>
59+
</a>
60+
<a href="/designs" class="active secondary" alt="Link to my Design examples">
61+
<i>palette</i>
62+
<span>Designs</span>
63+
</a>
64+
<a href="/development" class="active secondary" alt="Link to my Development examples">
65+
<i>code</i>
66+
<span>Code</span>
67+
</a>
68+
<div class="medium-space"></div>
69+
<button class="fill circle" color-theme-toggle aria-label="Change theme">
70+
<i>light_mode</i>
71+
</button>
72+
</nav>
73+
<nav class="bottom s m max">
74+
<header>
75+
<nav>
76+
<a href="/" alt="Link to home">
77+
<img src="/img/Jolicoeur_iOS.png" class="circle" />
78+
</a>
79+
</nav>
80+
</header>
81+
<div class="max"></div>
82+
<a href="/about" class="active secondary" alt="Link to my About page">
83+
<i>info</i>
84+
<span>About</span>
85+
</a>
86+
<a href="/designs" class="active secondary" alt="Link to my Design examples">
87+
<i>palette</i>
88+
<span>Designs</span>
89+
</a>
90+
<a href="/development" class="active secondary" alt="Link to my Development examples">
91+
<i>code</i>
92+
<span>Code</span>
93+
</a>
94+
<div class="max"></div>
95+
<button class="fill circle" color-theme-toggle aria-label="Change theme">
96+
<i>light_mode</i>
97+
</button>
98+
</nav>
99+
100+
<main>
101+
<article class="absolute fill center middle">
102+
<div>
103+
<img src="/img/404_outdoors.svg" alt="Lost in the mountains" class="responsive" loading="lazy" />
104+
<h5 class="center-align">Looks like you lost your way...</h5>
105+
<p class="center-align">Go back to the home page by clicking the button below.</p>
106+
<div class="space"></div>
107+
<nav class="center-align">
108+
<a href="/" alt="Link to go back to the home page">
109+
<button class="responsive round large small-elevate primary">
110+
<i>home</i>
111+
<span>Go home</span>
112+
</button>
113+
</a>
114+
</nav>
51115
</div>
52-
<h1>Looks like you lost your way...</h1>
53-
<p>Go back to the home page by clicking the button below.</p>
54-
<sl-button variant="primary" size="large" href="/">Take me home</sl-button>
55-
</div>
116+
</article>
56117
</main>
57118
<script>
58119
if ('serviceWorker' in navigator) {
@@ -63,5 +124,7 @@ <h1>Looks like you lost your way...</h1>
63124
}
64125
}
65126
</script>
127+
<script src="https://kit.fontawesome.com/0ea2a7621c.js" crossorigin="anonymous"></script>
128+
<script type="application/javascript" src="/js/jolicoeur.js"></script>
66129
</body>
67130
</html>

‎docs/about/index.html‎

Lines changed: 15 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@
6363
/>
6464
</head>
6565
<a rel="me" href="https://mastodon.world/@adamjol" aria-hidden="true" style="display: none !important;">Mastodon</a>
66-
<body class="light">
66+
<body class="dark" >
6767
<nav id="nav" class="l max top">
6868
<header>
6969
<nav>
@@ -74,20 +74,20 @@
7474
</nav>
7575
</header>
7676
<div class="max"></div>
77-
<a href="/about" class="nav-link active" alt="Link to my About page">
77+
<a href="/about" class="active secondary" alt="Link to my About page">
7878
<i>info</i>
7979
<span>About</span>
8080
</a>
81-
<a href="/designs" class="nav-link " alt="Link to my Designs examples">
81+
<a href="/designs" class="" alt="Link to my Design examples">
8282
<i>palette</i>
8383
<span>Designs</span>
8484
</a>
85-
<a href="/development" class="nav-link " alt="Link to my Development examples">
85+
<a href="/development" class="" alt="Link to my Development examples">
8686
<i>code</i>
8787
<span>Code</span>
8888
</a>
8989
<div class="medium-space"></div>
90-
<button class="circle" onclick="mode()">
90+
<button class="fill circle" color-theme-toggle aria-label="Change theme">
9191
<i>light_mode</i>
9292
</button>
9393
</nav>
@@ -99,18 +99,23 @@
9999
</a>
100100
</nav>
101101
</header>
102-
<a href="/about" class="nav-link active" alt="Link to my About page">
102+
<div class="max"></div>
103+
<a href="/about" class="active secondary" alt="Link to my About page">
103104
<i>info</i>
104105
<span>About</span>
105106
</a>
106-
<a href="/designs" class="nav-link " alt="Link to my Designs examples">
107+
<a href="/designs" class="" alt="Link to my Design examples">
107108
<i>palette</i>
108109
<span>Designs</span>
109110
</a>
110-
<a href="/development" class="nav-link " alt="Link to my Development examples">
111+
<a href="/development" class="" alt="Link to my Development examples">
111112
<i>code</i>
112113
<span>Code</span>
113114
</a>
115+
<div class="max"></div>
116+
<button class="fill circle" color-theme-toggle aria-label="Change theme">
117+
<i>light_mode</i>
118+
</button>
114119
</nav>
115120

116121
<main class="responsive">
@@ -134,7 +139,7 @@ <h5>
134139
z-index: 0 !important;
135140
}
136141
</style>
137-
<section class="responsive"><nav class="left max">
142+
<section class="responsive"><nav class="left max s-display-none">
138143
<!--<sl-details summary="Table of Contents">-->
139144
<div class="toc markdown-toc" >
140145
<ol><li><a href="#hello">Hello</a></li><li><a href="#career">Career</a></li><li><a href="#education">Education</a></li></ol>
@@ -167,9 +172,8 @@ <h2 id="education" tabindex="-1">Education <a class="anchor-link" href="#educati
167172
</div>
168173
</main>
169174
<footer>
170-
<div class="large-space"></div>
171-
<div class="large-space"></div>
172175
<section class="responsive">
176+
<div class="large-spacer"></div>
173177
<hr>
174178
<div class="large-spacer"></div>
175179
<div class="grid">

‎docs/apps/collectsomemore/index.html‎

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@
6363
/>
6464
</head>
6565
<a rel="me" href="https://mastodon.world/@adamjol" aria-hidden="true" style="display: none !important;">Mastodon</a>
66-
<body class="light">
66+
<body class="dark" >
6767
<nav id="nav" class="l max top">
6868
<header>
6969
<nav>
@@ -74,20 +74,20 @@
7474
</nav>
7575
</header>
7676
<div class="max"></div>
77-
<a href="/about" class="nav-link " alt="Link to my About page">
77+
<a href="/about" class="" alt="Link to my About page">
7878
<i>info</i>
7979
<span>About</span>
8080
</a>
81-
<a href="/designs" class="nav-link " alt="Link to my Designs examples">
81+
<a href="/designs" class="" alt="Link to my Design examples">
8282
<i>palette</i>
8383
<span>Designs</span>
8484
</a>
85-
<a href="/development" class="nav-link " alt="Link to my Development examples">
85+
<a href="/development" class="" alt="Link to my Development examples">
8686
<i>code</i>
8787
<span>Code</span>
8888
</a>
8989
<div class="medium-space"></div>
90-
<button class="circle" onclick="mode()">
90+
<button class="fill circle" color-theme-toggle aria-label="Change theme">
9191
<i>light_mode</i>
9292
</button>
9393
</nav>
@@ -99,18 +99,23 @@
9999
</a>
100100
</nav>
101101
</header>
102-
<a href="/about" class="nav-link " alt="Link to my About page">
102+
<div class="max"></div>
103+
<a href="/about" class="" alt="Link to my About page">
103104
<i>info</i>
104105
<span>About</span>
105106
</a>
106-
<a href="/designs" class="nav-link " alt="Link to my Designs examples">
107+
<a href="/designs" class="" alt="Link to my Design examples">
107108
<i>palette</i>
108109
<span>Designs</span>
109110
</a>
110-
<a href="/development" class="nav-link " alt="Link to my Development examples">
111+
<a href="/development" class="" alt="Link to my Development examples">
111112
<i>code</i>
112113
<span>Code</span>
113114
</a>
115+
<div class="max"></div>
116+
<button class="fill circle" color-theme-toggle aria-label="Change theme">
117+
<i>light_mode</i>
118+
</button>
114119
</nav>
115120

116121
<main class="responsive">
@@ -144,9 +149,8 @@ <h3 id="privacy-policy" tabindex="-1">Privacy Policy <a class="anchor-link" href
144149
</div>
145150
</main>
146151
<footer>
147-
<div class="large-space"></div>
148-
<div class="large-space"></div>
149152
<section class="responsive">
153+
<div class="large-spacer"></div>
150154
<hr>
151155
<div class="large-spacer"></div>
152156
<div class="grid">

‎docs/apps/collectsomemore/releases/index.html‎

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@
6363
/>
6464
</head>
6565
<a rel="me" href="https://mastodon.world/@adamjol" aria-hidden="true" style="display: none !important;">Mastodon</a>
66-
<body class="light">
66+
<body class="dark" >
6767
<nav id="nav" class="l max top">
6868
<header>
6969
<nav>
@@ -74,20 +74,20 @@
7474
</nav>
7575
</header>
7676
<div class="max"></div>
77-
<a href="/about" class="nav-link " alt="Link to my About page">
77+
<a href="/about" class="" alt="Link to my About page">
7878
<i>info</i>
7979
<span>About</span>
8080
</a>
81-
<a href="/designs" class="nav-link " alt="Link to my Designs examples">
81+
<a href="/designs" class="" alt="Link to my Design examples">
8282
<i>palette</i>
8383
<span>Designs</span>
8484
</a>
85-
<a href="/development" class="nav-link " alt="Link to my Development examples">
85+
<a href="/development" class="" alt="Link to my Development examples">
8686
<i>code</i>
8787
<span>Code</span>
8888
</a>
8989
<div class="medium-space"></div>
90-
<button class="circle" onclick="mode()">
90+
<button class="fill circle" color-theme-toggle aria-label="Change theme">
9191
<i>light_mode</i>
9292
</button>
9393
</nav>
@@ -99,18 +99,23 @@
9999
</a>
100100
</nav>
101101
</header>
102-
<a href="/about" class="nav-link " alt="Link to my About page">
102+
<div class="max"></div>
103+
<a href="/about" class="" alt="Link to my About page">
103104
<i>info</i>
104105
<span>About</span>
105106
</a>
106-
<a href="/designs" class="nav-link " alt="Link to my Designs examples">
107+
<a href="/designs" class="" alt="Link to my Design examples">
107108
<i>palette</i>
108109
<span>Designs</span>
109110
</a>
110-
<a href="/development" class="nav-link " alt="Link to my Development examples">
111+
<a href="/development" class="" alt="Link to my Development examples">
111112
<i>code</i>
112113
<span>Code</span>
113114
</a>
115+
<div class="max"></div>
116+
<button class="fill circle" color-theme-toggle aria-label="Change theme">
117+
<i>light_mode</i>
118+
</button>
114119
</nav>
115120

116121
<main class="responsive">
@@ -141,9 +146,8 @@ <h2 id="releases" tabindex="-1">Releases <a class="anchor-link" href="#releases"
141146
</div>
142147
</main>
143148
<footer>
144-
<div class="large-space"></div>
145-
<div class="large-space"></div>
146149
<section class="responsive">
150+
<div class="large-spacer"></div>
147151
<hr>
148152
<div class="large-spacer"></div>
149153
<div class="grid">

‎docs/apps/index.html‎

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@
6363
/>
6464
</head>
6565
<a rel="me" href="https://mastodon.world/@adamjol" aria-hidden="true" style="display: none !important;">Mastodon</a>
66-
<body class="light">
66+
<body class="dark" >
6767
<nav id="nav" class="l max top">
6868
<header>
6969
<nav>
@@ -74,20 +74,20 @@
7474
</nav>
7575
</header>
7676
<div class="max"></div>
77-
<a href="/about" class="nav-link " alt="Link to my About page">
77+
<a href="/about" class="" alt="Link to my About page">
7878
<i>info</i>
7979
<span>About</span>
8080
</a>
81-
<a href="/designs" class="nav-link " alt="Link to my Designs examples">
81+
<a href="/designs" class="" alt="Link to my Design examples">
8282
<i>palette</i>
8383
<span>Designs</span>
8484
</a>
85-
<a href="/development" class="nav-link " alt="Link to my Development examples">
85+
<a href="/development" class="" alt="Link to my Development examples">
8686
<i>code</i>
8787
<span>Code</span>
8888
</a>
8989
<div class="medium-space"></div>
90-
<button class="circle" onclick="mode()">
90+
<button class="fill circle" color-theme-toggle aria-label="Change theme">
9191
<i>light_mode</i>
9292
</button>
9393
</nav>
@@ -99,18 +99,23 @@
9999
</a>
100100
</nav>
101101
</header>
102-
<a href="/about" class="nav-link " alt="Link to my About page">
102+
<div class="max"></div>
103+
<a href="/about" class="" alt="Link to my About page">
103104
<i>info</i>
104105
<span>About</span>
105106
</a>
106-
<a href="/designs" class="nav-link " alt="Link to my Designs examples">
107+
<a href="/designs" class="" alt="Link to my Design examples">
107108
<i>palette</i>
108109
<span>Designs</span>
109110
</a>
110-
<a href="/development" class="nav-link " alt="Link to my Development examples">
111+
<a href="/development" class="" alt="Link to my Development examples">
111112
<i>code</i>
112113
<span>Code</span>
113114
</a>
115+
<div class="max"></div>
116+
<button class="fill circle" color-theme-toggle aria-label="Change theme">
117+
<i>light_mode</i>
118+
</button>
114119
</nav>
115120

116121
<main class="responsive">
@@ -151,9 +156,8 @@ <h2 id="webapps" tabindex="-1">WebApps <a class="anchor-link" href="#webapps">#<
151156
</div>
152157
</main>
153158
<footer>
154-
<div class="large-space"></div>
155-
<div class="large-space"></div>
156159
<section class="responsive">
160+
<div class="large-spacer"></div>
157161
<hr>
158162
<div class="large-spacer"></div>
159163
<div class="grid">

0 commit comments

Comments
 (0)