Page about me and the website

A picture of me with messy hair doing a V sign with my fingers.

About me

Hey there, I'm Théo 👋

I guess that if you came here, it means you want to either know more about me, or about the website.

I am the proud parent of 3 pets, Matcha, Tsuki and Neko.

My cat Matcha yawning from up close. She's a tiny tabby cat. My cat Tsuki in a 0.5x lens laying on the cat tree. He's a tuxedo boy. My dog Neko in the park. She's coming towards the camera with her tongue sticking and a white feather on her nose. She's a medium size black and brown dog.
More about Matcha

Matcha (first picture) was adopted from Moustier, a small village near Charleroi. Alyssa and I knew for some time that we wanted a cat and had been looking online for a while.
On a sunday morning, Alyssa found Matcha on the website of INNI, we contacted the person keeping her and in the afternoon the same day, we were heading on a 2h train to go see her.

It really was love at first sight, out of all the cats that were there, Matcha is the one that directly jumped on my lap for cuddles, she was so tiny!
When we left the place, she went on top of the stairs to look at us go and a few days later, we picked her up an brought her home.

Ever since then, Matcha has been with us. She absolutely loves all humans and will always try to get some cuddles. She lost a bunch of her teeth when she was a tiny baby in the streets, because of that she eats really slowly and it's absolutely adorable.
Her favourite toys are small fake mice. She will bring them in her mouth then meow to ask you to throw them far away. Then she will run after it, grab it and bring it back for more playing.

More about Tsuki

Tsuki (second picture) is like a hungry ghost, you won't see him around, he'll be hiding somewhere, but as soon as his belly starts rumbling, he will haunt you until you give him food.

We actually got him thinking he was a girl, because we wanted another cat to keep Matcha company. But when we brought him home, we saw two balls between his legs. At first we weren't sure so we called a vet to check he didn't have some kind of tumor or whatever, but these balls really were just balls.

It was actually quite an adventure, because when we got him, Tsuki was a feral cat, and he wouldn't let anyone approach him. He'd just hide in a corner and hiss at you. So the vet we called had to go get some thick gloves in his car to be able to put him in the cage.
Since then, he has made progress, he still won't let you give him cuddles whenever you want, but when he's hungry, you can almost do whatever you want and he'll accept it in exchange for kibbles. He really just is a stomach on 4 legs.

More about Neko

Neko (third picture) is a Romanian dog. We actually didn't mean to get a dog from Romania, but it turned out the animal welfare organization we had contacted is one that brings dogs back from Romania.

The way they work is that they don't let you just choose any dog. Instead, they ask you plenty of questions and then tell you which dogs they think would do well in your situation and you pick from those.
For us, they recommended just one, Neko, and it really was a perfect match!

Well to be honest, not at first, but that's because we were widely unprepared.
The first few weeks were so intense! Neko wouldn't let us sleep very much, she would pee and poo everywhere in the house, she was scared of everything etc. And these are all perfectly understandable things, she was just a tiny baby discovering a Belgian city with cars, people, loud noises and everything when all she had known was the Romanian countryside.

Since then, she has grown so much. And the situation has settled really well, I couldn't imagine my life without her anymore!
She has grown into a cute highly energetic dog that loves to play as much as she loves to sleep. She's not really cuddly, but will never refuse a hug. And she will come everywhere with me and always act the nicest.

Her only problem is that she can't stay alone too long, it makes her freak out! But that's fine, we're working on it and I'm sure she'll figure it out :))

My main passion in life is designing websites and coding them. I got into this when I was in school to study infographics, initially I was mostly interested in the 2d and drawing side of things as I wanted to become an animator. But when I discovered you could write some code and make anything you want appear on your computer screen and share it with the world, it blew me away and I knew that's what I wanted to do with my life.
Ever since then I haven't stopped learning, trying and putting things out there for others to see. The web is such a wonderful platform for self expression and I'm glad to live in a time where it exists.

Another thing I like is reading. I've always loved reading books, ever since I could read. The first book I remember reading by myself is "La princesse et le dragon" by Robert Munsch.
Nowadays, I mostly read non-fiction books about environmentalism, sociology, animal rights, nature, anti-racism/anti-colonialism etc. I also sometimes read the odd novel, often Fantasy but not always. I have a liking for novels about cats for some reason.

Other than that, I also really like video games. I've always been more of a Nintendo person as this is the consoles my parents bought me as a kid. My first ever personal one was a red DS lite. At some point I had broken one side of the hinge, and my dad had managed to fix it using a blue circular K'nex piece. These days I'm really into Pokemon games, I've been re-doing a lot of the older ones on the DSi my friend Void gifted me. I've also always been a big fan of Mario Kart and I don't think I'll ever stop enjoying these games.

My favourite movie is Shrek. No matter how many times I watch it, I always find it hilarious. The music choice is absolutely epic, my brother even gifted me a vinyl of the soundtrack last Christmas.
Another movie to mention is Coraline. I remember watching it as a kid and not thinking too much of it, the ending drags a bit long and I had clearly stopped paying attention by the end. But Alyssa is a big fan of it and when she showed it to me again, I got blown away by how good of a movie it actually was. Again, the soundtrack is so amazing, it might even be one of my favourite piece of music of all time! And the visuals are stunning of course, Laïka really are the kings of stop motion.
As you can see, I'm not a very big fan of non-animated movies, I rarely watch any at all.

Another fact about me is that I am vegan. I was actually pescetarian for about 8 years before that. At first I had not stopped eating meat for animal welfare or for environmental questions, but simply because I was fed up with how much meat we ate in my home as a child. Then as the years went by I learned a little bit about the animal cause but not much. At some point, I randomly listened to a book that explained how the food industry treats animals, it prompted me to do some research and I decided to leave animals alone and stop condoning killing them.


About the website

Enough about me, now let me tell you a bit about this website.

The website is built on Laravel. I think PHP is the best language for the web cause it was literally created and grown for 31 years specifically for it. And Laravel is a great framework all around, providing easy tools and vast community with free and open source packages for anything you may need.
PHP is also incredibly easy to deploy, just point your server to index.php and you're good to go.

For styling I use SCSS, mostly because I'm used to it. But also because even though CSS has made great progress in its syntax in the last few years, it is still not on par with SCSS, and your compiled SCSS is much more widely supported than modern CSS.
I like the BEM methodology, I think it keeps my code clean.

You will find a little bit of JS in some places, but I used it very sparingly. I believe that a website should work without JS most of the time and the JS should only be used to enhance the user experience on top of the available HTML and CSS.

On the admin side of things, I used Filament. I was skeptical of them for the longest time, but the v5 really sold it for me. It has everything I need and most importantly its fully responsive so I can edit my website from my phone in a comfortable way.
Everything is stored in a sqlite DB. I like that I can simply copy paste a file and bring all my data with me.

The website is hosted at Infomaniak, mostly because they say they do stuff for sustainability. I don't know how much of it is green washing and how much of it is real, but I guess it's still better than nothing right?

Now let's get into the design details.

Each page has it's own design. I tried for like 8 month to unify everything, but I kept running into unideal cases or missing some design I liked. In the end I decided to make a very simple navigation that can adapt anywhere and design each page or group of page specifically for its purpose.

The homepage was built with the idea of having a playful entry on my site. It uses comic sans MS because I genuinely love this font. The background and link colors are chosen at random from an array of 8 possibilities, reflecting most of the colors you can find in the bendy title text.
The text on the page serves as an introduction, leading you to different parts of the site as a gentle nudge to explore more.

The menu is its own separate page. Each link has a color and an icon of its own, it was loosely based on this picture I found on the linear app store page.

Screenshot of a presentation screen on the app store for the linear app

The notes pages were inspired by the light and shadows cast through the roof window in my living room.
On the previous iteration of this site, the backdrop colors would change smoothly throughout the days as to reflect the real world day-night cycle. But it wasn't always the most readable, and for most of the day, you had a very flat light that made the rustling leaves in the background almost invisible. So this time I instead chose to leave it stuck at 6:00AM, it was my favourite time of the day with the bright orange morning light.

My living room wall highlighted by orange rectangles of light coming from the roof window.

For the font, I used Junicode. I think it looks legible and has the same feeling as types you find in books.
To push the book like effect even further, I added some small text details like leading the text with a large capital letter fading into some small caps or adding an indent for each paragraph. This picture that was on the homepage of Bix for a while inspired me a great deal, that's where I got the yellow highlight for links from.

A page of a book, written in bold typography with indents. A bunch of the text is highlighted in yellow.

The feed page is simply my interpretation of what a one person only chat could look like. It's mostly based on the iPhone message app as I think it has some great UI/UX. I would like to implement emoji reactions in the future, but it isn't so easy to build and will probably take a lot of time.

The links page was initially going to be a long table of links with some badges to signify the category. But I thought it was boring and in the end I built a (imo) much cooler accordion based page.
Each section is collapsible using the details HTML element.
I really like the effect I put on hover where the background color shows up instantly on enter but lingers a little on leave. This gives a sort of trailing effect when you move your mouse between links.