include ppp as submodule, planet boye

wip planets
This commit is contained in:
ktyl 2021-09-13 21:43:55 +01:00
parent 05e5cd3e51
commit 4a639f5b63
6 changed files with 52 additions and 75 deletions

3
.gitmodules vendored Normal file
View File

@ -0,0 +1,3 @@
[submodule "ppp"]
path = ppp
url = https://github.com/ktyldev/ppp

View File

@ -15,7 +15,7 @@ run: $(HTML_TARGETS) $(CSS_TARGETS)
$(OUT_DIR)/%.html: $(ROOT_DIR)/%.html $(HTML_INCLUDES) $(OUT_DIR)/%.html: $(ROOT_DIR)/%.html $(HTML_INCLUDES)
mkdir -p $(OUT_DIR) mkdir -p $(OUT_DIR)
python ppp.py $< $(HTML_INCLUDES) > $@ python ppp/ppp.py $< $(HTML_INCLUDES) > $@
$(OUT_DIR)/%.css: $(ROOT_DIR)/%.css $(OUT_DIR)/%.css: $(ROOT_DIR)/%.css
cp $< $@ cp $< $@

1
ppp Submodule

@ -0,0 +1 @@
Subproject commit e50671d1cddd6f109c4a1a14dae0a9dffb29d290

66
ppp.py
View File

@ -1,66 +0,0 @@
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)

View File

@ -1 +1,3 @@
<div class="planets"></div> <div class="planets">
<span id="earth" class="planet"></span>
</div>

View File

@ -73,10 +73,8 @@ a.fsText:hover {
width: max(30vmax,500px); width: max(30vmax,500px);
left:50%; left:50%;
top:var(--title-height); top:var(--title-height);
bottom:0; padding: 10px 0 50px;
padding: 10px 0 0; background-color: var(--foreground);
background-color: var(--color0);
opacity: 0.7;
transform: translate(-50%, 0); transform: translate(-50%, 0);
} }
@ -84,7 +82,8 @@ a.fsText:hover {
.column p { .column p {
margin: 0 40px; margin: 0 40px;
padding-top: 20px; padding-top: 20px;
color: #ffffff; color: var(--background);
opacity: 1.0;
} }
.column h1 { .column h1 {
@ -159,6 +158,44 @@ a.fsText:hover {
z-index: -1; z-index: -1;
background-color: var(--color2); background-color: var(--color2);
}
@-webkit-keyframes orbit {
from { -webkit-transform: rotate(0deg) translateX(150px) rotate(0deg); }
to { -webkit-transform: rotate(360deg) translateX(150px) rotate(360deg); }
}
@-moz-keyframes orbit {
from { -moz-transform: rotate(0deg) translateX(150px) rotate(0deg); }
to { -moz-transform: rotate(360deg) translateX(150px) rotate(360deg); }
}
@-o-keyframes orbit {
from { -o-transform: rotate(0deg) translateX(150px) rotate(0deg); }
to { -o-transform: rotate(360deg) translateX(150px) rotate(360deg); }
}
@keyframes orbit {
from { transform: rotate(0deg) translateX(150px) rotate(0deg); }
to { transform: rotate(360deg) translateX(150px) rotate(360deg); }
}
.planet {
position: absolute;
width: 25px;
height: 25px;
border-radius: 50%;
display: inline-block;
-moz-animation: orbit 4s linear infinite;
animation: orbit 4s linear infinite;
}
#earth {
background-color: var(--color4);
left: 150px;
top: 150px;
/* first rotate is orbital angle, second rotation undoes it to keep the planet upright */
transform: rotate(45deg) translateX(100px) rotate(-45deg);
} }