pp-covidcert

Vaccination Certificate fpor the EU
git clone https://src.jayvii.de/pub/pp-covidcert.git
Log | Files | Refs

commit 8553091eada8ce110ad3e2f60ba705c111b6422d
parent ce5e5015a3b716a320b633990fad8a1cdddb72be
Author: JayVii <jayvii@posteo.de>
Date:   Mon,  4 Oct 2021 10:36:52 +0200

HTML version

Diffstat:
MMakefile | 5+++--
Aindex.html | 222+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Amake_install.sh | 25+++++++++++++++++++++++++
3 files changed, 250 insertions(+), 2 deletions(-)

diff --git a/Makefile b/Makefile @@ -1,5 +1,6 @@ install: mkdir -p ${HOME}/.local/share/pp-covidcert - mkdir -p ${HOME}/.local/bin + mkdir -p ${HOME}/.local/share/applications + install -m 755 ./index.html ${HOME}/.local/share/pp-covidcert/ install -m 644 ./icon.png ${HOME}/.local/share/pp-covidcert/ - install -m 755 ./pp-covidcert.sh ${HOME}/.local/bin/ + #install -m 755 ./pp-covidcert.desktop ${HOME}/.local/share/applications/ diff --git a/index.html b/index.html @@ -0,0 +1,222 @@ +<html lang="en"> + <head> + <title>Covid19 Vaccination Certificate</title> + <meta charset="utf-8" /> + <meta name="viewport" content="width=device-width, initial-scale=1" /> + <link rel="icon" href="/images/icons/favicon.ico" type="image/x-icon" sizes="16x16 32x32" /> + <link rel="icon" href="/images/icons/favicon.png" type="image/png" sizes="96x96" /> + <link rel="apple-touch-icon-precomposed" href="/images/icons/apple.png" /> + <link rel="stylesheet" href="/assets/css/main.css" /> + </head> + + <body> + + <h1>Certificates</h1> + + <div id="certinfo"> + <h2>Digital COVID-Zertificate for the EU</h2> + <h3><!--NAME--></h3> + <!-- Certificates --> + <div id="certcontainer"> + <div class="mySlides fade" style="display: block;"> + <img src="<!--CERT1-->" style="width:100%"> + </div> + <div class="mySlides fade" style="display: none;"> + <img src="<!--CERT2-->" style="width:100%"> + </div> + <br> + <!--<a class="prev" onclick="plusSlides(-1)">❮</a> + <a class="next" onclick="plusSlides(1)">❯</a>--> + <div style="text-align:center"> + <span class="dot active" onclick="currentSlide(1)"></span> + <span class="dot" onclick="currentSlide(2)"></span> + </div> + <p style="text-align:center;">Full Vaccination protection</p> + </div> + <h3>Name, Vorname / Name, First Name</h3> + <p style="color: #DDD;"><!--NAME--></p> + <h3>Geburtsdatum / Date of Birth</h3> + <p style="color: #DDD;"><!--DOB--></p> + <h3>Datum der Erstimpfung / Date of first Vaccination</h3> + <p style="color: #DDD;"><!--FIRSTVAC--></p> + <h3>Datum der Zweitimpfung / Date of second Vaccincation</h3> + <p style="color: #DDD;"><!--SECONDVAC--></p> + </div> + + </body> + + <style> + + body { + width: 100%; + max-width: 720px; + margin-left: auto; + margin-right: auto; + background: #fff; + color: #000; + } + + #certinfo { + background-image: linear-gradient(135deg, #4674bf, #1550b5); + color: #fff; + border-radius: 10px; + border: 2px solid #222; + width: 98%; + margin-left: auto; + margin-right: auto; + padding-top: 5px; + padding-left: 15px; + padding-right: 15px; + padding-bottom: 5px; + box-shadow: 5px 5px 5px #AAA; + } + + #certcontainer { + width: 95%; + margin-left: auto; + margin-right:auto; + background: #fff; + padding-left: 10px; + padding-right: 10px; + padding-top: 5px; + padding-bottom: 5px; + color: #666; + border-radius: 10px; + box-shadow: 3px 3px 5px #000; + } + + </style> + <style> + * {box-sizing:border-box} + + /* Slideshow container */ + .slideshow-container { + width: 100%; + position: relative; + margin: auto; + } + + /* Hide the images by default */ + .mySlides { + display: none; + } + + /* Next & previous buttons */ + .prev, .next { + cursor: pointer; + position: absolute; + top: 50%; + width: auto; + margin-top: -22px; + padding: 16px; + color: #fff; + font-weight: bold; + font-size: 18px; + transition: 0.5s ease; + border-radius: 0 3px 3px 0; + user-select: none; + } + + /* Position the "next button" to the right */ + .next { + right: 20; + border-radius: 3px 0 0 3px; + } + + /* On hover, add a black background color with a little bit see-through */ + .prev:hover, .next:hover { + background-color: rgba(0,0,0,0.6); + } + + /* Caption text */ + .text { + color: #fff; + font-size: 1.5em; + padding: 8px 12px; + position: absolute; + bottom: 8px; + width: 100%; + text-align: center; + } + + .text > a { + color: #fff; + } + + /* Number text (1/3 etc) */ + .numbertext { + color: #fff; + font-size: 1.5em; + padding: 8px 12px; + position: absolute; + top: 0; + display: none; + } + + /* The dots/bullets/indicators */ + .dot { + cursor: pointer; + height: 15px; + width: 15px; + margin: 0 2px; + background-color: #bbb; + border-radius: 50%; + display: inline-block; + transition: background-color 0.6s ease; + } + + .active, .dot:hover { + background-color: #e4b660; + } + + /* Fading animation */ + .fade { + -webkit-animation-name: fade; + -webkit-animation-duration: 1s; + animation-name: fade; + animation-duration: 1s; + } + + @-webkit-keyframes fade { + from {opacity: .5} + to {opacity: 1} + } + + @keyframes fade { + from {opacity: .4} + to {opacity: 1} + } + </style> + <script> + var slideIndex = 1; + showSlides(slideIndex); + autoSlides(slideIndex); + + // Next/previous controls + function plusSlides(n) { + showSlides(slideIndex += n); + } + + // Thumbnail image controls + function currentSlide(n) { + showSlides(slideIndex = n); + } + + function showSlides(n) { + var i; + var slides = document.getElementsByClassName("mySlides"); + var dots = document.getElementsByClassName("dot"); + if (n > slides.length) {slideIndex = 1} + if (n < 1) {slideIndex = slides.length} + for (i = 0; i < slides.length; i++) { + slides[i].style.display = "none"; + } + for (i = 0; i < dots.length; i++) { + dots[i].className = dots[i].className.replace(" active", ""); + } + slides[slideIndex-1].style.display = "block"; + dots[slideIndex-1].className += " active"; + } + </script> + +</html> diff --git a/make_install.sh b/make_install.sh @@ -0,0 +1,25 @@ +#!/usr/bin/env bash + +HTML_PATH="$HOME/.local/share/pp-covidcert" + +make install + +# replace variables in script +echo "What's your Name?" +read name +echo "What's your Date of Birth?" +read dob +echo "When was your first vaccination?" +read firstvac +echo "When was your second vaccination?" +read secondvac + +sed -e "s/<!--NAME-->/$name/g" \ + -e "s/<!--DOB-->/$dob/g" \ + -e "s/<!--FIRSTVAC-->/$firstvac/g" \ + -e "s/<!--SECONDVAC-->/$secondvac/g" \ + -i "$HTML_PATH/index.html" + +sed -e "s#<!--CERT1-->#$HTML_PATH/cert1.png#g" \ + -e "s#<!--CERT2-->#$HTML_PATH/cert2.png#g" \ + -i "$HTML_PATH/index.html"