marko/cwsvJudo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

WIP: parallax template

Browse Source
This commit is contained in:
marko
2025-03-22 14:43:17 +01:00
parent 2ad05796cd
commit 24c07e29d8
8 changed files with 68 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
homepage/cwsvJudo/Makefile
View File

@@ -1,5 +1,7 @@
include Makefile.local
PANDOC_TEMPLATE=materialize-parallax.html
CSSO = node_modules/csso-cli/bin/csso
RES_LIST = 64 128 256 512
@@ -53,12 +55,12 @@ INSTALL_DEPENDENCIES:
build/css/cwsvJudo.css: $(cssFiles)
cat $^ | $(CSSO) -o $@
build/%.php: src/md/%.md build/yaml/%.yaml pandocTemplate/cwsvJudo.html5.pandocTemplate
build/%.php: src/md/%.md build/yaml/%.yaml pandocTemplate/$(PANDOC_TEMPLATE)
mkdir -p build
pandoc \
--standalone \
--css="ressourcen/css/cwsvJudo.css" \
--template=pandocTemplate/cwsvJudo.html5.pandocTemplate \
--template=pandocTemplate/$(PANDOC_TEMPLATE) \
--to=html \
--output=$@ \
$< $(word 2,$^)

13
homepage/cwsvJudo/Makefile.heliohost
View File

@@ -12,11 +12,15 @@ configFiles = $(wildcard config/*.php)
LN = ln -f
.PHONY: all
all: build/css/cwsvJudo.css pages
all: build/css/cwsvJudo.css pages images
# @todo This should only be temporary. Better outsource the graphics to it's own Makefile.
make -j graphiken
make build/css/cwsvJudo.css
.PHONY: images
images:
cp -r graphiken/wallpapers build/graphiken
.PHONY: clean
clean:
$(RM) -rf build
@@ -80,6 +84,9 @@ dist: all
# - wappen
mkdir -p $(distDir)/httpdocs/ressourcen/graphiken/logos
find ./build/graphiken/cwsvJudoLogoWappen -type f -exec $(LN) {} $(distDir)/httpdocs/ressourcen/graphiken/logos \;
# - wallpapers
mkdir -p $(distDir)/httpdocs/ressourcen/graphiken/wallpapers
find ./build/graphiken/wallpapers -type f -exec $(LN) {} $(distDir)/httpdocs/ressourcen/graphiken/wallpapers \;
# - icons
mkdir -p $(distDir)/httpdocs/ressourcen/graphiken/icons
find ./graphiken/icons -type f -exec $(LN) {} $(distDir)/httpdocs/ressourcen/graphiken/icons \;
@@ -93,8 +100,8 @@ dist: all
# - others
$(LN) ./res/IntegrationDurchSport2018.250x.png $(distDir)/httpdocs/ressourcen/graphiken/logos
# - api
mkdir -p $(distDir)/httpdocs/api
find ./src/api -type f -exec $(LN) {} $(distDir)/httpdocs/api \;
# mkdir -p $(distDir)/httpdocs/api
# find ./src/api -type f -exec $(LN) {} $(distDir)/httpdocs/api \;
# css
mkdir -p $(distDir)/httpdocs/ressourcen/css
$(LN) ./build/css/cwsvJudo.css $(distDir)/httpdocs/ressourcen/css/cwsvJudo.css

3
homepage/cwsvJudo/Makefile.heliohost.config
View File

@@ -8,7 +8,8 @@ VERSION_GOOGLE_MATERIAL_ICONS = 4.0.0
# where to put the distribution
distDir = ./build/dist/heliohost
# which pandoc template to use
pandocTemplate = pandocTemplate/materialize-fromScratch.html
pandocTemplate = pandocTemplate/materialize-parallax.html
# css optimizer to use
CSSO = node_modules/csso-cli/bin/csso

3
homepage/cwsvJudo/docker-compose.yaml
View File

@@ -7,7 +7,8 @@ services:
context: .
dockerfile: PHP.dockerfile
ports:
- "8080:80" #this line maps your pc port to the container port
# this line maps your pc port to the container port
- "8080:80"
depends_on:
# this line links this container to the db container
- db

BIN
homepage/cwsvJudo/graphiken/wallpapers/judo-4454835.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.3 MiB

BIN
homepage/cwsvJudo/graphiken/wallpapers/judo-4454836.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.6 MiB

BIN
homepage/cwsvJudo/graphiken/wallpapers/youth-864663.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 MiB

50
homepage/cwsvJudo/pandocTemplate/materialize-parallax.html Normal file
View File

@@ -0,0 +1,50 @@
<!DOCTYPE html>
<html>
<head>
<!--Import Google Icon Font-->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!--Import materialize.css-->
<link type="text/css" rel="stylesheet" href="ressourcen/css/materialize.min.css" media="screen,projection" />
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body>
<div class="parallax-container">
<div class="parallax"><img style="width:100%" src="/ressourcen/graphiken/wallpapers/judo-4454835.jpg"></div>
</div>
<div class="section">
Lorem Ipsum
</div>
<div class="parallax-container">
<div class="parallax"><img style="width:100%" src="/ressourcen/graphiken/wallpapers/judo-4454836.jpg"></div>
</div>
<div class="section">
Lorem Ipsum
</div>
<div class="parallax-container">
<div class="parallax"><img style="width:100%" src="/ressourcen/graphiken/wallpapers/youth-864663.jpg"></div>
</div>
<div class="section">
Lorem Ipsum
</div>
<!--JavaScript at end of body for optimized loading-->
<script type="text/javascript" src="ressourcen/js/materialize.min.js"></script>
<script>
document.addEventListener('DOMContentLoaded', function () {
const elems = document.querySelectorAll('.parallax');
const instances = M.Parallax.init(elems, {
// specify options here
});
});
</script>
</body>
</html>