Public/carya.software
1
0
Fork 0
Code Issues 3 Pull requests Projects Releases Packages Wiki Activity

Compare commits

base: Public:e0a72a9a2c5e2aace242ba772fbabfba16a17ff4
Branches Tags
Public:master
..
compare: Public:3f0f14aa38cba4492c93012a6ac9989ff8055308
Branches Tags
Public:master

No commits in common. "e0a72a9a2c5e2aace242ba772fbabfba16a17ff4" and "3f0f14aa38cba4492c93012a6ac9989ff8055308" have entirely different histories.
e0a72a9a2c ... 3f0f14aa38

4 changed files with 23 additions and 50 deletions
Show stats Expand all files Collapse all files

2
.gitignore vendored
View file

@ -1,3 +1 @@
*~
theme-compiled.css
font/*.ttf

8
README.md
View file

@ -1,12 +1,10 @@
This repository contains the code for my personal site, hosted at [carya.software](https://www.carya.software).
# Building
"Building" the site such that it can be deployed is simple. Clone the repository, add the relevant font(s), and compile the tailwindCSS.
"Building" the site such that it can be deployed is simple. Clone the repository, add the relevant font .ttf files, and compile the tailwindCSS.
## Fonts
Obtain the file [ioseevka_ter_regular.ttf](https://typeof.net/Iosevka/)and put it in the fonts folder.
Obtain the files [ioseevka_ter_regular.ttf](https://typeof.net/Iosevka/) and [OFLGoudyStMTT.ttf](https://www.1001fonts.com/ofl-sorts-mill-goudy-font.html) and put them in the fonts folder.
## Tailwind
[Install TailwindCSS](https://tailwindcss.com/docs/installation) (site most recently built with v3.3.3) with npm if you haven't already. Compile the CSS with the following terminal command.
npx tailwindcss -i ./css/theme.css -o ./css/theme-compiled.css
Open index.html and the site should look as it does at [carya.software](https://www.carya.software).
npx tailwindcss -i ./www/css/theme.css -o ./www/css/theme-compiled.css

3
css/theme.css
View file

@ -9,7 +9,7 @@
@font-face {
font-family: 'TitleFont';
src: url('../font/ioseevka_term_regular.ttf') format('truetype');
src: url('../font/OFLGoudyStMTT.ttf') format('truetype');
}
body {
@ -20,6 +20,7 @@ body {
.title {
font-family: TitleFont;
font-feature-settings: "c2sc", "smcp";
font-size: 72px;
}

60
index.html
View file

@ -11,7 +11,7 @@
<!-- <div class="mx-4 order-last"> -->
<!-- <img class="logo" src="img/logo.svg" alt="carya.software logo"> -->
<!-- </div> -->
<div class="mx-4 self-center mt-16 max-w-xl min-w-xl">
<div class="mx-4 self-center mt-16 max-w-3xl min-w-2xl">
<h1 class="title text-center">carya.software</h1>
<div class="justify-center">
<div class="flex justify-center">
@ -19,28 +19,25 @@
<button onclick="toggleSections(this)" class="text-xl text-[#14591e] p-2 mx-14">projects</button>
<button onclick="toggleSections(this)" class="text-xl text-[#14591e] p-2 mx-14">contact</button>
</div>
<div id="about" class="hidden p-2">
<div id="about" class="hidden">
<h2 class="font-semibold text-[#0a210f] p-2">What is this site?</h2>
<div class="text-left">
<p class="p-2">
<p class="p-1">
This is my personal website.
</p>
<p class="p-2">
<p class="p-1">
I do not use my real name here for privacy reasons — <br> and because I like <span class="italic">carya.software</span> a lot more than <span class="italic">first-last.tld</span>.
</p>
<p class="p-2">
If you got here from my resume you may want to look at the projects tab or head to my <a class="underline" href="https://forge.carya.software/explore/repos">Forgejo instance</a> (a lightweight FOSS git software forge) directly.
</p>
<p class="p-2">
If you need to contact me you can find my various account addresses in the contact tab. I would be happy to chat once I know you aren't a web scraper!
<p class="p-1">
If you got here from my resume you may want to look at the projects tab <span class="line-through">(or head straight to my <a class="underline" href="https://forge.carya.software">Forgejo instance</a> (a fork of Gitea, a lightweight DevOps platform) to see open-source projects I've worked on</span>[coming soon™]. If you need to contact me for any reason you can find my various account addresses in the contact tab. I would be happy to chat once I know you aren't a web scraper!
</p>
</div>
<h2 class="font-semibold text-[#0a210f] p-2">Who are you?</h2>
<div class="text-left">
<p class="p-2">
<p class="p-1">
I am a software engineer based on the East Coast of the USA. Professionally I have mostly worked with microsoft technology (.NET, SQL Server, et al) but for personal use I prefer <a class="underline text-[#4e2a8e]" href="https://elixir-lang.org/">Elixir</a>.
</p>
<p class="p-2">
<p class="p-1">
Outside of spending time with family and community I garden, work on personal projects, read, and attempt to catalogue the various fungi I find growing in my yard.
</p>
</div>
@ -52,40 +49,16 @@
</div>
</div>
<div id="projects" class="hidden">
<ul class="p-2 list-disc">
<li>
<a class="underline font-semibold" href="https://forge.carya.software/Public/carya.software">Carya.software</a> — the source code for this site.
<ul class="p-2 list-disc">
<li>Built using basic HTML, TailwindCSS, and vanilla JavaScript. Hosted on a VPS with Nginx running on Debian.</li>
<li>I have additional services running on subdomains on the same server. For example, I host my public repositories at forge.carya.software, and I have a pleroma instance on pleroma.carya.software</li>
<li>SSL certificates managed using Certbot</li>
</ul>
</li>
<ul class="p-2">
<li>TBD<li>
</ul>
</div>
<div id="contact" class="hidden">
<div class="">
<table class="table-auto mx-auto my-8 font-[#0a210f]">
<tbody>
<tr>
<td class="p-2">
<label class="font-semibold text-[#0a210f]">Email:</label>
</td>
<td class="p-2">
TBD, redacted due to spambots.
</td>
</tr>
<tr>
<td class="p-2">
<label class="font-semibold text-[#0a210f]">Matrix:</label>
</td>
<td class="p-2">
TBD
</td>
</tr>
</tbody>
</table>
</div>
<ul class="p-2">
<li>Email: TBD</li>
<li>Matrix: TBD</li>
<!-- <li>Fediverse: <a class="underline" href="https://pleroma.carya.software/users/TeO3">@TeO3@pleroma.carya.software</a></li> -->
</ul>
</div>
</div>
</div>
@ -97,6 +70,8 @@
hiddenClass = "hidden";
revealedClass = "visible";
function switchClasses(element, toRemove, toInsert){
console.log(toRemove);
console.log(element.classList);
element.classList.remove(toRemove);
element.classList.add(toInsert);
}
@ -109,6 +84,7 @@
id = button.textContent;
ids = ["about", "projects", "contact"];
ids.filter(i => i !== id).forEach(hide);
console.log("All hidden!");
element = document.getElementById(id);
if(element.classList.contains(revealedClass)){
switchClasses(element, revealedClass, hiddenClass);