-
- ( )
- ( )
- ( )
- ( )
- ) )
- ( ( /\
- (_) / \ /\
- ________[_]________ /\/ \/ \
- /\ /\ ______ \ / /\/\ /\/\
- / \ //_\ \ /\ \ /\/\/ \/ \
- /\ / /\/\ //___\ \__/ \ \/
- / \ /\/ \//_____\ \ |[]| \
- /\/\/\/ //_______\ \|__| \
- / \ /XXXXXXXXXX\ \
- \ /_I_II I__I_\__________________\
- I_I| I__I_____[]_|_[]_____I
- I_II I__I_____[]_|_[]_____I
- I II__I I XXXXXXX I
- ~~~~~" "~~~~~~~~~~~~~~~~~~~~~~~~
-
+
+ ( )
+ ( )
+ ( )
+ ( )
+ ) )
+ ( ( /\
+ (_) / \ /\
+ ________[_]________ /\/ \/ \
+ /\ /\ ______ \ / /\/\ /\/\
+ / \ //_\ \ /\ \ /\/\/ \/ \
+ /\ / /\/\ //___\ \__/ \ \/
+ / \ /\/ \//_____\ \ |[]| \
+ /\/\/\/ //_______\ \|__| \
+/ \ /XXXXXXXXXX\ \
+ \ /_I_II I__I_\__________________\
+ I_I| I__I_____[]_|_[]_____I
+ I_II I__I_____[]_|_[]_____I
+ I II__I I XXXXXXX I
+ ~~~~~" "~~~~~~~~~~~~~~~~~~~~~~~~
+
- Hello, welcome to my cozy personal website! -w-
+ Hello, welcome to my comfy personal website! (＾▽＾)
- I am a programmer and web developer from the Netherlands.
- I spend most of my time programming in PHP, and I run a Linux server in my
- free time as a hobby. It mainly runs the subcon.town services. I also enjoy
- retro video games.
+ I am Fristi, a programmer from the Netherlands. On this website you can find
+ more info about me, my server and my personal projects. If you'd like to chat,
+ ping me on the fediverse!
-
About me
+
About
- Hi, my name is Fristi.
- I am a programmer, web developer and server admin from the Netherlands.
- I'm an easy-going guy with a love for old electronics, games and food. If you wish
- to talk to me, hit me up on the fediverse!
+ Hi, my name is Fristi. I'm a PHP programmer and server hobbyist from the
+ Netherlands. I love old electronics, games and food. While I generally don't
+ program a lot in my spare time anymore, I do maintain a linux server
+ that hosts some of my private data and services. as well as this website.
Professional
- I am mainly a back-end web developer, specializing in PHP and the Laravel Framework.
- Besides that, I also do front-end work, usually focusing on creating simplistic
- user interfaces with pure Javascript (no frameworks or jQuery) and Sass/CSS. I believe
- that refraining from javascript frameworks results in cleaner, more optimized and more controllable code.
+ For a living, I mainly do backend programming in PHP, specializing in the
+ Laravel framework. I also do other bits and pieces of scripting where needed,
+ although I'm no expert in that. I also do a bit of front-end development where
+ needed, with experience in Bootstrap, although I prefer to make my own lighter
+ front-end solutions where possible.
- Besides programming, I also work a lot with Linux servers (and Linux in general).
- In a professional capacity, I mainly do devops work, administrating a development
- and production server, helping out with software deployments and maintenance. In
- my spare time, I run a hobby server that hosts my personal websites (including this one)
- and a couple of services I administrate.
+ Besides programming, I also work a lot with Linux systems, and use it as my
+ preferred operating system on my own computers. In my spare time I maintain a
+ personal hobby server that holds most of my private data and services, while
+ also acting as my development server.
- To get a better picture of what I've worked with, please view the projects page.
+ Please view the Websites and Projects
+ pages to get an idea of what I've worked
+ with. If you wish to know more, feel free to send an email to
+ fristi@subcon.town.
-
Websites & Blogs
+
My websites
I currently host the following websites:
+ - Subcon Town:
+ the main website of my personal server.
+ Source
- Comfiture:
my personal website, the one you're reading now.
Source
- - Something Comfy:
+ - Something Fresh:
a blog featuring my random thoughts on various things.
Source
- The Paperbin:
a blog where I rant about the things that annoy me.
- Source
- - Subcon Town:
- the main website of my personal server.
- Source
+ Source
Projects
@@ -132,18 +131,16 @@
please view the Subcon Town website.
-
Copyright notice
@@ -168,9 +165,17 @@
fristi@subcon.town.
-
Changelog
+
+ 1.4.0 Minor update:
+ - Added responsive sizing for mobile support
+ - Updated visual style of the "terminal"
+ - Removed a few lower-quality backgrounds
+ - Updated footer with direct link to source
+ - Refreshed content a bit
+ - Added randomized motd under version number
+
1.3.1 Patch:
- Set background image rendering to "crisp-edges"
@@ -209,8 +214,10 @@
diff --git a/script.js b/script.js
index a542b70..27f53d5 100644
--- a/script.js
+++ b/script.js
@@ -2,16 +2,29 @@
var comfiture = {};
var activeLink;
var activeContent;
+ var motds = [
+ "Made by Fristi",
+ "Made by a crocodile",
+ "Made by a Dutch potato",
+ "Fristi? Fristi habe ich nicht.",
+ "[Subject quote here]",
+ "Press R or Z twice to do a barrel roll",
+ "You wouldn't download a car.",
+ "The last metroid is in captivity.",
+ "Suavemente, bésame",
+ "What is love?",
+ "Justice in Spades",
+ "Let's get Volatile",
+ ];
var wallpapers = [
- '1.gif', '2.gif', '3.gif', '4.gif',
- '5.gif', '6.gif', '7.gif', '8.gif',
- '9.gif', '10.gif', '11.gif', '12.gif',
- '13.gif', '14.gif', '15.gif', '16.gif',
+ '1.gif', '3.gif', '4.gif',
+ '6.gif', '7.gif', '8.gif',
+ '9.gif', '10.gif', '12.gif',
+ '13.gif', '14.gif', '16.gif',
'17.gif', '18.gif', '19.gif', '20.gif',
- '21.gif', '22.gif', '23.gif',
+ '22.gif', '23.gif',
'1.png', '2.png', '3.png',
- '5.png', '6.png', '7.png', '8.png',
- '9.png',
+ '5.png', '6.png'
];
//Function to set the wallpaper
@@ -20,6 +33,11 @@
document.querySelector('.background').style.backgroundImage = 'url("backgrounds/'+wallpaper+'")';
};
+ comfiture.printMotd = function () {
+ let motd = motds[Math.floor(Math.random() * motds.length)];
+ document.write(motd);
+ }
+
//Onload
window.addEventListener('load', function(){
//Hide all content
diff --git a/style.css b/style.css
index 171b5d4..35f77b2 100644
--- a/style.css
+++ b/style.css
@@ -33,30 +33,22 @@ body {
.container {
position:absolute;
box-sizing: border-box;
- top:0;
- left:0;
- bottom:0;
- right:0;
- width: 880px;
- height: 652px;
+ height: 100%;
+ width: 100%;
- padding:30px 40px;
- margin:auto;
+ padding:8px;
+ margin:0;
- background-color: rgba(31, 37, 47, 0.9);
- color: rgba(90, 228, 70, 1);
+ background-color: rgba(45, 40, 35, 0.95);
+ color: rgb(210, 172, 97);
font-family: IBMVGA8, monospace;
font-size: 16px;
-
line-height: 16px;
- border-radius: 90px / 820px;
- border-style: outset;
- border-color: rgba(126, 126, 134, 1);
- border-width: 8px;
-
- box-shadow: 0 0 10px rgba(0, 0, 0, 1);
+ border: 2px solid rgb(0, 0, 0);
+ box-shadow: 5px 5px 0 rgb(0, 0, 0);
+ /*box-shadow: 0 0 10px rgba(0, 0, 0, 1);*/
}
header, main, footer {
@@ -68,24 +60,25 @@ header, main, footer {
}
header {
- height: 96px;
+ height: 112px;
overflow: hidden;
}
main {
- height: 448px;
+ height: calc(100% - 160px);
overflow-y: auto;
overflow-x: hidden;
- padding: 16px;
+ margin: 16px 0;
+ padding: 0 16px;
}
footer {
- height: 32px;
+ height: 16px;
overflow: hidden;
}
a {
- color: rgba(240,240,240, 1);
+ color: rgb(213, 209, 206);
text-decoration: none;
}
@@ -98,8 +91,8 @@ a:after {
}
a:hover, a:active {
- background-color: rgba(240,240,240, 1);
- color: rgba(31, 37, 47, 0.8);
+ background-color: rgb(234, 231, 227);
+ color: rgba(62, 51, 48, 0.95);
}
a.active {
@@ -149,6 +142,36 @@ pre {
font-family: IBMVGA8, monospace;
}
+#ascii {
+ text-align: center;
+}
+
+#ascii pre {
+ display: inline-block;
+ text-align: left;
+}
+
.content p:last-child {
margin:0;
+}
+
+@media only screen and (min-width: 864px) {
+ .container {
+ position:absolute;
+ left: 32px;
+ bottom: 32px;
+ width: 800px;
+ height: 596px;
+
+ padding:16px;
+ margin:auto;
+ }
+
+ header {
+ height: 96px;
+ }
+
+ main {
+ height: 416px;
+ }
}
\ No newline at end of file