initial commit
This commit is contained in:
commit
05e5cd3e51
|
|
@ -0,0 +1,2 @@
|
||||||
|
html/
|
||||||
|
site/
|
||||||
|
|
@ -0,0 +1,24 @@
|
||||||
|
SRC_DIR = src
|
||||||
|
OUT_DIR = site
|
||||||
|
|
||||||
|
ROOT_DIR = $(SRC_DIR)/root
|
||||||
|
INCLUDE_DIR = $(SRC_DIR)/include
|
||||||
|
|
||||||
|
PAGES = $(shell find $(ROOT_DIR) -wholename "$(ROOT_DIR)*.html")
|
||||||
|
HTML_INCLUDES = $(shell find $(INCLUDE_DIR) -name *.html)
|
||||||
|
HTML_TARGETS = $(PAGES:$(ROOT_DIR)/%.html=$(OUT_DIR)/%.html)
|
||||||
|
|
||||||
|
STYLES = $(shell find $(ROOT_DIR) -wholename "$(ROOT_DIR)*.css")
|
||||||
|
CSS_TARGETS = $(STYLES:$(ROOT_DIR)/%.css=$(OUT_DIR)/%.css)
|
||||||
|
|
||||||
|
run: $(HTML_TARGETS) $(CSS_TARGETS)
|
||||||
|
|
||||||
|
$(OUT_DIR)/%.html: $(ROOT_DIR)/%.html $(HTML_INCLUDES)
|
||||||
|
mkdir -p $(OUT_DIR)
|
||||||
|
python ppp.py $< $(HTML_INCLUDES) > $@
|
||||||
|
|
||||||
|
$(OUT_DIR)/%.css: $(ROOT_DIR)/%.css
|
||||||
|
cp $< $@
|
||||||
|
|
||||||
|
clean:
|
||||||
|
rm -r $(OUT_DIR)
|
||||||
|
|
@ -0,0 +1,66 @@
|
||||||
|
import sys
|
||||||
|
import os.path
|
||||||
|
|
||||||
|
err = False
|
||||||
|
paths = []
|
||||||
|
|
||||||
|
def print_usage():
|
||||||
|
print("\nusage: python ppp.py ROOT TEMPLATES [...]")
|
||||||
|
|
||||||
|
# check arguments
|
||||||
|
argc = len(sys.argv)
|
||||||
|
if argc < 3:
|
||||||
|
print_usage()
|
||||||
|
sys.exit(1)
|
||||||
|
|
||||||
|
# figure out src dir from first include shader path root argument
|
||||||
|
sep="/"
|
||||||
|
inc_start_idx = 2
|
||||||
|
inc_end_idx = argc - 1
|
||||||
|
src_dir = sep.join(sys.argv[2].split(sep)[:-1])
|
||||||
|
|
||||||
|
def preprocess_file(path):
|
||||||
|
lines=0
|
||||||
|
|
||||||
|
with open(path) as f:
|
||||||
|
content = f.readlines()
|
||||||
|
content = [x.strip() for x in content]
|
||||||
|
lines=len(content)
|
||||||
|
|
||||||
|
for line in content:
|
||||||
|
|
||||||
|
directive = "#include"
|
||||||
|
if line.startswith(directive):
|
||||||
|
include_path = line.split(" ")[1]
|
||||||
|
|
||||||
|
# prepend directory
|
||||||
|
include_path = "/".join([src_dir, include_path])
|
||||||
|
|
||||||
|
preprocess_file(include_path)
|
||||||
|
continue
|
||||||
|
|
||||||
|
print(line)
|
||||||
|
|
||||||
|
|
||||||
|
for i in range(1,argc):
|
||||||
|
path = sys.argv[i]
|
||||||
|
|
||||||
|
if not os.path.isfile(path):
|
||||||
|
|
||||||
|
print(path + " is not a file")
|
||||||
|
err = True
|
||||||
|
continue
|
||||||
|
|
||||||
|
if path in paths:
|
||||||
|
# ignore duplicates
|
||||||
|
continue
|
||||||
|
|
||||||
|
paths.append(path)
|
||||||
|
|
||||||
|
if err:
|
||||||
|
print_usage()
|
||||||
|
sys.exit(1)
|
||||||
|
|
||||||
|
preprocess_file(sys.argv[1])
|
||||||
|
|
||||||
|
sys.exit(0)
|
||||||
|
|
@ -0,0 +1,11 @@
|
||||||
|
# ideas
|
||||||
|
|
||||||
|
* [ ] software
|
||||||
|
* [ ] blog
|
||||||
|
* [ ] gallery
|
||||||
|
* [ ] images
|
||||||
|
* [ ] captions
|
||||||
|
|
||||||
|
* [ ] graphics
|
||||||
|
* [ ] a few planets orbit the cursor, or flat color otherwise
|
||||||
|
when you click on the planets they turn into a context menu !
|
||||||
|
|
@ -0,0 +1,13 @@
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1" />
|
||||||
|
<meta name="description" content="computer whisperer" />
|
||||||
|
<meta name="keywords" content="Cat Flynn, Ktyl, Portfolio, Showreel, Blog, Gallery"/> <!-- blog, gallery -->
|
||||||
|
<link rel="canonical" href="https://ktyl.dev/">
|
||||||
|
<link rel="stylesheet" href="main.css" />
|
||||||
|
|
||||||
|
<script src="https://kit.fontawesome.com/ad50bb2e16.js" crossorigin="anonymous"></script>
|
||||||
|
<!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> -->
|
||||||
|
<!-- <script src="main.js"></script> -->
|
||||||
|
</head>
|
||||||
|
|
@ -0,0 +1 @@
|
||||||
|
<div class="planets"></div>
|
||||||
|
|
@ -0,0 +1,20 @@
|
||||||
|
<div class="sidebar">
|
||||||
|
<div class="sidebarContent">
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li><a href="about.html" class="fsText">/about</a></li>
|
||||||
|
<li><a href="portfolio.html" class="fsText">/portfolio</a></li>
|
||||||
|
<li><a href="gallery.html" class="fsText">/gallery</a></li>
|
||||||
|
<li><a href="blog.html" class="fsText">/blog</a></li>
|
||||||
|
<li><a href="contact.html" class="fsText">/contact</a></li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="socials">
|
||||||
|
<a href="https://github.com/ktyldev/"><i class="fab fa-github"></i></a>
|
||||||
|
<a href="https://instragram.com/ktyldev"><i class="fab fa-instagram"></i></a>
|
||||||
|
<a href="https://twitter.com/ktyldev"><i class="fab fa-twitter"></i></a>
|
||||||
|
<a href="https://www.linkedin.com/in/cat-flynn-08751611b/"><i class="fab fa-linkedin"></i></a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
<!doctype html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
#include header.html
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="title">
|
||||||
|
<h1 class="fsText"><a href="index.html">ktyl@website</a>/about</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
#include sidebar.html
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
<!doctype html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
#include header.html
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="title">
|
||||||
|
<h1 class="fsText"><a href="index.html">ktyl@website</a>/blog</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
#include sidebar.html
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,14 @@
|
||||||
|
:root {
|
||||||
|
/* Special */
|
||||||
|
--background: #eee;
|
||||||
|
--foreground: #222;
|
||||||
|
--foreground-inactive: #777;
|
||||||
|
|
||||||
|
/* Colors */
|
||||||
|
--color0: #0000ff;
|
||||||
|
--color1: #00ff00;
|
||||||
|
--color2: #ff0000;
|
||||||
|
--color3: #ff00ff;
|
||||||
|
--color4: #ffff00;
|
||||||
|
--color5: #00ffff;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
<!doctype html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
#include header.html
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="title">
|
||||||
|
<h1 class="fsText"><a href="index.html">ktyl@website</a>/contact</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
#include sidebar.html
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
<!doctype html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
#include header.html
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="title">
|
||||||
|
<h1 class="fsText"><a href="index.html">ktyl@website</a>/contact</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
#include sidebar.html
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
<!doctype html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
#include header.html
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="title">
|
||||||
|
<h1 class="fsText"><a href="index.html">ktyl@website</a>/gallery</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
#include sidebar.html
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,23 @@
|
||||||
|
<!doctype html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
#include header.html
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<title>ktyl ~ home</title>
|
||||||
|
<div class="title">
|
||||||
|
<h1 class="fsText">ktyl@website</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
#include sidebar.html
|
||||||
|
|
||||||
|
<div class="column">
|
||||||
|
<h1>cats stuff</h1>
|
||||||
|
|
||||||
|
<p>hi, im cat and i do things and stuff. eventually i want to make this an actual, useful landing page for people interested in me and what i do. unfortunately, im very scatterbrained and not very organised! as a result, this is just one of myriad ongoing projects that i constantly try to chip away at, to varying degrees of success.</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
#include planets.html
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,164 @@
|
||||||
|
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@300&display=swap');
|
||||||
|
@import 'colors.css';
|
||||||
|
|
||||||
|
:root {
|
||||||
|
--title-height: min(20vmin, 90px);
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: 'Ubuntu', sans-serif;
|
||||||
|
|
||||||
|
background-color: var(--background);
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
margin-left: 80px;
|
||||||
|
font-size: 1.4em;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: var(--font-size);
|
||||||
|
color: var(--color1);
|
||||||
|
padding-bottom: 0;
|
||||||
|
margin-bottom:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
margin-top: 0;
|
||||||
|
list-style-type: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
li {
|
||||||
|
display:inline;
|
||||||
|
/*padding-left: 1em;*/
|
||||||
|
transition: transform 0.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
li:hover {
|
||||||
|
transform: translate(10px);
|
||||||
|
}
|
||||||
|
|
||||||
|
a.fsText {
|
||||||
|
position:relative;
|
||||||
|
text-decoration: none;
|
||||||
|
background-color: var(--background);
|
||||||
|
color: var(--foreground-inactive);
|
||||||
|
|
||||||
|
padding: 0 6px;
|
||||||
|
|
||||||
|
transform: scale(1);
|
||||||
|
transition: background-color 0.2s, color 0.2s, transform 0.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fsText a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: var(--foreground);
|
||||||
|
}
|
||||||
|
|
||||||
|
a.fsText:hover {
|
||||||
|
background-color: var(--background);
|
||||||
|
color: var(--foreground);
|
||||||
|
|
||||||
|
transform: scale(1.1, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.fsText {
|
||||||
|
--font-size: 1.6em;
|
||||||
|
font-size: var(--font-size);
|
||||||
|
color: var(--foreground);
|
||||||
|
}
|
||||||
|
|
||||||
|
.column {
|
||||||
|
position: absolute;
|
||||||
|
width: max(30vmax,500px);
|
||||||
|
left:50%;
|
||||||
|
top:var(--title-height);
|
||||||
|
bottom:0;
|
||||||
|
padding: 10px 0 0;
|
||||||
|
background-color: var(--color0);
|
||||||
|
opacity: 0.7;
|
||||||
|
|
||||||
|
transform: translate(-50%, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.column p {
|
||||||
|
margin: 0 40px;
|
||||||
|
padding-top: 20px;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.column h1 {
|
||||||
|
padding-left: 30px;
|
||||||
|
padding-top: 10px;
|
||||||
|
left: 50%;
|
||||||
|
font-size: 1.3em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar {
|
||||||
|
position: absolute;
|
||||||
|
left: 15px;
|
||||||
|
width: max(11vmax, 180px);
|
||||||
|
top:var(--title-height);
|
||||||
|
bottom:0;
|
||||||
|
|
||||||
|
background-color: var(--background);
|
||||||
|
color: var(--foreground);
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebarContent {
|
||||||
|
position: relative;
|
||||||
|
background-color: var(--background);
|
||||||
|
top: 50%;
|
||||||
|
transform: translate(0, -50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar ul {
|
||||||
|
position: relative;
|
||||||
|
background-color: var(--background);
|
||||||
|
padding-left: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar li {
|
||||||
|
display: block;
|
||||||
|
margin: 5px 0 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar li a {
|
||||||
|
padding: 0 0;
|
||||||
|
margin-left: -20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.socials {
|
||||||
|
margin-top: 16px;
|
||||||
|
margin-left: 10px;
|
||||||
|
background-color:var(--background);
|
||||||
|
}
|
||||||
|
|
||||||
|
.socials i {
|
||||||
|
font-size: 2em;
|
||||||
|
margin-left: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.socials a {
|
||||||
|
color: var(--foreground-inactive);
|
||||||
|
text-decoration: none;
|
||||||
|
|
||||||
|
transition: color 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.socials a:hover {
|
||||||
|
color: var(--foreground);
|
||||||
|
}
|
||||||
|
|
||||||
|
.planets {
|
||||||
|
position: absolute;
|
||||||
|
height: 60vmax;
|
||||||
|
width: 60vmax;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
z-index: -1;
|
||||||
|
|
||||||
|
background-color: var(--color2);
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
<!doctype html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
#include header.html
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="title">
|
||||||
|
<h1 class="fsText"><a href="index.html">ktyl@website</a>/portfolio</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
#include sidebar.html
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
Loading…
Reference in New Issue