UPlanetZine.html "UPlanet DID it or NOT"

This commit is contained in:
fred 2024-03-28 20:43:58 +01:00
parent 77f298ed11
commit 99f62a58c4
5 changed files with 325 additions and 47 deletions

View File

@ -529,9 +529,28 @@ echo
echo "%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%"
echo ""
#####################################################################"
####tools##########################################getUMAP_ENV.sh
$(${MY_PATH}/../tools/getUMAP_ENV.sh "${LAT}" "${LON}" | tail -n 1)
####################################################### EMAIL
#####################################################################"
##UPlanetZine::QmeegmN4shouhnzvnDYpbSEJtdRsyy39SpL9XqYVHgtN44
cat ${MY_PATH}/../templates/UPlanetZine/index.html \
| sed -e "s~_ASTROQR_~${ASTROQR}~g" \
-e "s~_IASTRO_~${IASTRO}~g" \
-e "s~_MOATS_~${MOATS}~g" \
-e "s~_G1PUB_~${G1PUB}~g" \
-e "s~_ASTRONAUTENS_~${ASTRONAUTENS}~g" \
-e "s~_PASS_~${PASS}~g" \
-e "s~_IPFSNODEID_~${IPFSNODEID}~g" \
-e "s~_EARTHCID_~${EARTHCID}~g" \
-e "s~_SECTOR_~${SECTOR}~g" \
-e "s~_SLAT_~${SLAT}~g" \
-e "s~_SLON_~${SLON}~g" \
> ~/.zen/tmp/${MOATS}/UPlanetZine.html
$MY_PATH/../tools/mailjet.sh "${PLAYER}" ~/.zen/tmp/${MOATS}/UPlanetZine.html "UPlanet DID it or NOT"
#####################################################################"_EARTHCID_
echo "<html><head>
<style>

View File

@ -0,0 +1,96 @@
<!DOCTYPE html>
<!-- TODO: Update the language if you're not writing in English! Hey, maybe remix this project and translate the instructions for other people? -->
<html lang="fr">
<!-- TODO: Add a title for your zine -->
<title>[UPlanet MultiPass]</title>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!-- TODO: Update the icon image if you want to get fancy! -->
<link rel="icon" type="image/png" href="/ipfs/QmU8XZpK2rGGJC8ZCFrKRo5cdDWr78vCgx68mCXDcXUpiv" />
<link rel="stylesheet"
href="/ipfs/QmeegmN4shouhnzvnDYpbSEJtdRsyy39SpL9XqYVHgtN44/style.css" />
<!-- TODO: Add a description for your zine -->
<meta name="Description" content="[UPlanet ZERO no secret key UPlanet Visa]" />
<!-- TODO: Update the theme color to match if you change the styles -->
<meta name="theme-color" content="#741b47" />
<main class="zine">
<header class="zine-page page-1">
<!-- TODO: Your front cover content goes here, so you probably want a good title and maybe some kind of image -->
<h3><a href='https://qo-op.com'>Libre UPlanet DID it or NOT</a></h3>
<img class="full-img" src="/ipfs/QmRQeE5XsYXAd32inVsWRFWqDCiMqkbU3txxdQwDqBRRLn">
<button class="print-button">🖨Print</button>
<h1>"<a target='TW' href='/ipns/_ASTRONAUTENS_'>TW5</a>"</h1>
did:ipns:_ASTRONAUTENS_
<hr>
<h3> /-> ASTROPORT : <a href='/ipns/_IPFSNODEID_'>/ipns/_IPFSNODEID_</a></h3>
<h3> /--> SECTOR : <a
href='_EARTHCID_/map_render.html?southWestLat=_SLAT_&southWestLon=_SLON_&deg=0.1'>_SECTOR_</a></h3>
</header>
<section class="zine-page page-2">
<!-- TODO: Page 2 content goes here. This is also the inside of the front cover, so you can be minimal or fit in as much content as possible! -->
UPlanet Passport is your gateway to a decentralized universe of data and exploration. With UPlanet Passport, you hold the key to accessing a vast network of interconnected information stored securely on the InterPlanetary File System (IPFS). As you embark on your journey through this boundless realm, your passport serves as your digital identity, granting you access to unique experiences, communities, and opportunities within UPlanet.
</section>
<section class="zine-page page-3">
<!-- TODO: Page 3 content here -->
Attention, Citizens of UPlanet!
In our decentralized cosmos, your AstroID Passport is your most valuable possession. It is not merely a document; it is your entry ticket to the boundless opportunities and adventures that await within UPlanet.
As your government, we implore you to treat your AstroID QR Code and accompanying CODE with the utmost care and responsibility. Safeguard them as you would your most cherished treasures, for they are the keys to your identity and access to the wonders of our decentralized realm.
</section>
<section class="zine-page page-4">
<!-- TODO: Page 4 - that's the halfway point, you're nearly there! -->
Your AstroID Passport is more than just a symbol—it is a testament to your citizenship in the ever-expanding universe of UPlanet. With it, you gain the privilege to securely navigate our digital frontier, engage with fellow citizens, and contribute to the flourishing ecosystem of innovation and collaboration.
Remember, fellow travelers, your AstroID Passport is your connection to the heart of UPlanet's governance, culture, and progress. Keep it close, and embark on your journey with confidence, knowing that you hold the power to shape the destiny of our decentralized cosmos.
Signed,
The UPlanet Government 🚀🌠
</section>
<section class="zine-page page-5">
<!-- TODO: You guessed it, page 5 content now -->
Secure your AstroID Passport today, and join us in forging a brighter future for all inhabitants of UPlanet!
<hr><a target='TW' href='/ipns/_ASTRONAUTENS_#AstroID'>AstroID<br>
<img class="mini-img" src='_ASTROQR_'\></a><br>
<h2>SECRET1="_SALT_"<br>SECRET2="_PEPPER_"</h2>
<h2> CODE : _PASS_ </h2>
<hr>
</section>
<section class="zine-page page-6">
<!-- TODO: Page 6, this is the last "page" but you can still keep going -->
<hr>
<a target='TW' href='/ipns/_ASTRONAUTENS_#ZenCard' title='_G1PUB_'>ZenCard</a><br>
<img src='_IASTRO_'\><br><hr>
_G1PUB_
</section>
<section class="zine-page page-7">
<!-- TODO: Page 7, this is the inside of the back cover -->
We are thrilled to unveil your ZenCard—a tangible symbol of empowerment and financial sovereignty in our decentralized cosmos.
Your ZenCard is more than just a piece of paper—it is your gateway to send and receive Zen, the universal currency of UPlanet. With your ZenCard in hand, you have the power to engage in transactions, support local economies, and participate in the vibrant ecosystem of our decentralized realm.
As a paper wallet, your ZenCard embodies the principles of security and accessibility. It allows you to store your Zen offline, protecting your assets from digital threats while ensuring easy access whenever you need them.
</section>
<footer class="zine-page page-8">
<!-- TODO: You made it! Page 8, the back cover. Feel free to use this for attributions. Hey, let me know if you want a review. I'll give you ★★★★★ and an amazing quote -->
Whether you're sending Zen to a friend across the cosmos or making a purchase from a local vendor, your ZenCard empowers you to transact with confidence and ease. Embrace the freedom of financial self-reliance and join us in building a thriving economy within UPlanet.
So, fellow citizens, hold your ZenCard high and embrace the opportunities it brings. Let us pave the way to a future where prosperity knows no bounds, and every individual has the opportunity to thrive.
Welcome to a new era of financial freedom on UPlanet—where your ZenCard is your key to unlocking limitless possibilities!
Signed,
The UPlanet Financial Authority 🌌💰
</footer>
</main>
<script src="/ipfs/QmeegmN4shouhnzvnDYpbSEJtdRsyy39SpL9XqYVHgtN44/script.js" async defer></script>
<!-- I know it says you need a closing </html> tag, but you actually don't! Feel free to add one though if it seems cleaner -->

View File

@ -1,45 +0,0 @@
<!DOCTYPE html>
<!-- TODO: Update the language if you're not writing in English! Hey, maybe remix this project and translate the instructions for other people? -->
<html lang="fr">
<!-- TODO: Add a title for your zine -->
<title>[Astroport Pass Card]</title>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!-- TODO: Update the icon image if you want to get fancy! -->
<link rel="icon" type="image/png" href="https://cdn.glitch.com/c10b2617-5888-415b-b574-42e2ab8f3484%2Fzine-machine-32.png" />
<link rel="stylesheet" href="/style.css" />
<!-- TODO: Add a description for your zine -->
<meta name="Description" content="[Add your zine description]" />
<!-- TODO: Update the theme color to match if you change the styles -->
<meta name="theme-color" content="#741b47" />
<main class="zine">
<header class="zine-page page-1">
<!-- TODO: Your front cover content goes here, so you probably want a good title and maybe some kind of image -->
</header>
<section class="zine-page page-2">
<!-- TODO: Page 2 content goes here. This is also the inside of the front cover, so you can be minimal or fit in as much content as possible! -->
</section>
<section class="zine-page page-3">
<!-- TODO: Page 3 content here -->
</section>
<section class="zine-page page-4">
<!-- TODO: Page 4 - that's the halfway point, you're nearly there! -->
</section>
<section class="zine-page page-5">
<!-- TODO: You guessed it, page 5 content now -->
</section>
<section class="zine-page page-6">
<!-- TODO: Page 6, this is the last "page" but you can still keep going -->
</section>
<section class="zine-page page-7">
<!-- TODO: Page 7, this is the inside of the back cover -->
</section>
<footer class="zine-page page-8">
<!-- TODO: You made it! Page 8, the back cover. Feel free to use this for attributions. Hey, let me know if you want a review. I'll give you ★★★★★ and an amazing quote -->
</footer>
</main>
<!-- I know it says you need a closing </html> tag, but you actually don't! Feel free to add one though if it seems cleaner -->

View File

@ -0,0 +1,4 @@
// This script just adds a little print button to the page. It's not needed for the zine, unless you want to add one too!
document.querySelector(".print-button").addEventListener("click", () => {
window.print();
});

View File

@ -0,0 +1,204 @@
/* These are just the article styles, so change these to whatever fits your theme! */
/* Probably keep this one bit as is though, it's going to make arranging things in print easier for you! */
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body {
font-family: sans-serif;
}
h1 {
color: #1c4587;
text-align: center;
font-style: italic;
font-size: 180%;
}
h2 {
background: #ead1dc;
color: #741b47;
font-family: monospace;
text-align: center;
font-size: 140%;
font-weight: normal;
margin: 0.2rem 0 0 0;
padding: 0.2rem 0 0.2rem;
}
th {
text-align: left;
background: #c9daf8;
color: #073763;
}
p {
padding: 0.2rem;
padding-top: 0.5rem;
font-size: 105%;
}
ul {
padding-left: 2rem;
list-style: none;
}
.zine-li:before {
content: '\21D2';
margin-left: -20px;
margin-right: 10px;
}
.zine-link {
font-family: monospace;
background: #c9daf8;
color: #073763;
}
.captioned-img {
object-fit: contain;
max-height: 100%;
max-width: 100%;
padding: 0 2rem 0 2rem;
}
figcaption {
font-family: monospace;
font-size: 80%;
font-style: italic;
background: #c9daf8;
color: #073763;
margin: 0 1rem 0 1rem;
}
.full-img {
object-fit: contain;
max-height: 100%;
max-width: 100%;
padding: 1rem;
}
.mini-img {
max-width: 10rem;
}
.glitchButton {
float: left;
padding: 1rem 0.5rem 0 0.5rem;
}
.cc-licence {
float: right;
margin: 1rem 0.5rem 0 0.5rem;
}
/* Any styles that you **only** want to appear on a device should go in here! */
@media screen {
body {
max-width: 30rem;
background: #ead1dc;
margin: auto;
}
.zine {
background: white;
padding: 10px;
border-left: 4px solid #741b47;
border-bottom: 4px solid #741b47;
}
.zine-page {
margin-top: 10px;
}
}
/* Any styles that you want to apply **just** when the zine is printed go in here! */
@media print {
body {
font-size: 69%;
}
a {
color: inherit;
text-decoration: none;
}
.mini-img {
max-width: 4.4rem;
}
/* The styles below here are specifically for creating the page layout.
* -> DON'T CHANGE THESE <- unless you know what you're doing!
*/
@page {
size: landscape;
margin: 0;
bleed: 0;
}
.zine {
width: 100vw;
height: 100vh;
display: grid;
gap: 1.5px;
background: lightgrey;
grid-template-areas:
"page-5 page-4 page-3 page-2"
"page-6 page-7 page-8 page-1";
grid-template-columns: repeat(4, 25%);
grid-template-rows: repeat(2, 50%);
}
.zine-page {
background: white;
padding: .2rem;
overflow: hidden;
}
.page-5, .page-4, .page-3, .page-2 {
transform: rotate(180deg) translateX(-0.1px);
}
.page-1 {
grid-area: page-1;
}
.page-2 {
grid-area: page-2;
}
.page-3 {
grid-area: page-3;
}
.page-4 {
grid-area: page-4;
}
.page-5 {
grid-area: page-5;
}
.page-6 {
grid-area: page-6;
}
.page-7 {
grid-area: page-7;
}
.page-8 {
grid-area: page-8;
}
}