164 lines
4.2 KiB
Plaintext
164 lines
4.2 KiB
Plaintext
# fpc-sitegen example template
|
|
# labels (e.g. head-format) can be taken as plain-text when prefixed with a back-slash
|
|
|
|
title-format:
|
|
$$CONTENT$$
|
|
head-format:
|
|
$$CONTENT$$
|
|
sub-head-format:
|
|
$$CONTENT$$
|
|
text-format:
|
|
$$CONTENT$$
|
|
section-format:
|
|
<div class ="card">
|
|
<div class="card-inner" style="background: url('img/$$SECTION_NAME$$.png') no-repeat center center; background-size: cover">
|
|
<a href="img/$$SECTION_NAME$$.png" class="card-image"></a>
|
|
</div>
|
|
<div class="card-text">
|
|
$$CONTENT$$
|
|
</div>
|
|
</div>
|
|
root-section-format:
|
|
<div class="graphics-grid">
|
|
$$CONTENT$$
|
|
</div>
|
|
output-format:
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>$$DOCUMENT_TITLE$$</title>
|
|
<link rel="icon" type="image/x-icon" href="/todo.fav.jpg">
|
|
<style>
|
|
body {
|
|
background-image: url("pics/background.png");
|
|
background-repeat: repeat;
|
|
background-size: 200pt;
|
|
|
|
font-family: Monospace;
|
|
font-size: 30pt;
|
|
font-weight: bold;
|
|
|
|
color: white;
|
|
|
|
text-shadow: 2pt 2pt 4pt black;
|
|
}
|
|
|
|
footer {
|
|
margin: 1rem;
|
|
padding: 1rem;
|
|
|
|
background: black;
|
|
|
|
font-size: 14pt;
|
|
|
|
text-shadow: none;
|
|
}
|
|
|
|
a {
|
|
color: white;
|
|
|
|
text-decoration: none;
|
|
}
|
|
|
|
a:hover {
|
|
color: pink;
|
|
}
|
|
|
|
a:active {
|
|
color: white;
|
|
}
|
|
|
|
footer a {
|
|
background:
|
|
radial-gradient(circle at 8%, transparent, transparent calc(4% - 1px), purple 4%, purple 6%, transparent calc(6% + 1px)),
|
|
conic-gradient(from -45deg at 20%, transparent, transparent 270deg, yellow 270deg, yellow),
|
|
conic-gradient(from -45deg at 26%, transparent, transparent 270deg, white 270deg, white),
|
|
conic-gradient(from -45deg at 32%, transparent, transparent 270deg, pink 270deg, pink),
|
|
conic-gradient(from -45deg at 38%, transparent, transparent 270deg, skyblue 270deg, skyblue),
|
|
conic-gradient(from -45deg at 44%, transparent, transparent 270deg, brown 270deg, brown),
|
|
conic-gradient(from -45deg , transparent, transparent 270deg, black 270deg, black),
|
|
linear-gradient(red, red 16.6%, orange 16.6%, orange 33.2%, yellow 33.2%, yellow 49.8%, green 49.8%, green 66.4%, blue 66.4%, blue 83%, purple 83%);
|
|
background-size: 100%;
|
|
-webkit-background-clip: text;
|
|
-moz-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
-moz-text-fill-color: transparent;
|
|
}
|
|
|
|
.title {
|
|
width: 100%;
|
|
|
|
text-align: center;
|
|
}
|
|
|
|
.gif {
|
|
height: 40pt;
|
|
}
|
|
|
|
.graphics-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(1, 1fr);
|
|
|
|
gap: 1rem;
|
|
|
|
max-width: 1400px;
|
|
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.card {
|
|
padding: 1rem;
|
|
}
|
|
|
|
.card-inner {
|
|
aspect-ratio: 4/3;
|
|
|
|
margin-bottom: 1rem;
|
|
|
|
background: white;
|
|
|
|
border-radius: 30pt;
|
|
box-shadow: 2pt 2pt 10pt black;
|
|
}
|
|
|
|
.card-image {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: block;
|
|
}
|
|
|
|
.card-text {
|
|
width: 100%;
|
|
height: 7rem;
|
|
}
|
|
|
|
@media (min-width: 1200px) {
|
|
.graphics-grid { grid-template-columns: repeat(2, 1fr); }
|
|
}
|
|
|
|
@media (min-width: 1500px) {
|
|
.graphics-grid { grid-template-columns: repeat(3, 1fr); }
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="title">
|
|
<img src="pics/peachcat.gif" class="gif">
|
|
<img src="pics/cat-spinning.gif" class="gif">
|
|
<img src="pics/peachcat.gif" class="gif">
|
|
my 4k exegfx
|
|
<img src="pics/peachcat.gif" class="gif">
|
|
<img src="pics/cat-spinning.gif" class="gif">
|
|
<img src="pics/peachcat.gif" class="gif">
|
|
</div>
|
|
|
|
$$CONTENT$$
|
|
|
|
<footer>
|
|
Generated with fpc-sitegen written in 100% freepascal by marie from <a href="https://marie.software">marie.software</a> and kindly hosted and taken care for by tila from <a href="https://heroin.trade">heroin.trade </a> :3.</div>
|
|
|
|
Last generated @ $$DATE$$, $$TIME$$ ; source <a href="https://git.heroin.trade/juvi/website/src/branch/$$BRANCH$$/$$SOURCE$$">$$SOURCE$$</a> @ commit <a href="https://git.heroin.trade/juvi/website/commit/$$COMMIT$$">$$COMMIT$$</a>
|
|
</footer>
|
|
</body>
|
|
</html>
|