UPlanet Zine & more
This commit is contained in:
parent
f9814e1cb4
commit
b273422f0d
|
|
@ -0,0 +1,60 @@
|
|||
.marker-cluster-small {
|
||||
background-color: rgba(181, 226, 140, 0.6);
|
||||
}
|
||||
.marker-cluster-small div {
|
||||
background-color: rgba(110, 204, 57, 0.6);
|
||||
}
|
||||
|
||||
.marker-cluster-medium {
|
||||
background-color: rgba(241, 211, 87, 0.6);
|
||||
}
|
||||
.marker-cluster-medium div {
|
||||
background-color: rgba(240, 194, 12, 0.6);
|
||||
}
|
||||
|
||||
.marker-cluster-large {
|
||||
background-color: rgba(253, 156, 115, 0.6);
|
||||
}
|
||||
.marker-cluster-large div {
|
||||
background-color: rgba(241, 128, 23, 0.6);
|
||||
}
|
||||
|
||||
/* IE 6-8 fallback colors */
|
||||
.leaflet-oldie .marker-cluster-small {
|
||||
background-color: rgb(181, 226, 140);
|
||||
}
|
||||
.leaflet-oldie .marker-cluster-small div {
|
||||
background-color: rgb(110, 204, 57);
|
||||
}
|
||||
|
||||
.leaflet-oldie .marker-cluster-medium {
|
||||
background-color: rgb(241, 211, 87);
|
||||
}
|
||||
.leaflet-oldie .marker-cluster-medium div {
|
||||
background-color: rgb(240, 194, 12);
|
||||
}
|
||||
|
||||
.leaflet-oldie .marker-cluster-large {
|
||||
background-color: rgb(253, 156, 115);
|
||||
}
|
||||
.leaflet-oldie .marker-cluster-large div {
|
||||
background-color: rgb(241, 128, 23);
|
||||
}
|
||||
|
||||
.marker-cluster {
|
||||
background-clip: padding-box;
|
||||
border-radius: 20px;
|
||||
}
|
||||
.marker-cluster div {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin-left: 5px;
|
||||
margin-top: 5px;
|
||||
|
||||
text-align: center;
|
||||
border-radius: 15px;
|
||||
font: 12px "Helvetica Neue", Arial, Helvetica, sans-serif;
|
||||
}
|
||||
.marker-cluster span {
|
||||
line-height: 30px;
|
||||
}
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
.leaflet-cluster-anim .leaflet-marker-icon, .leaflet-cluster-anim .leaflet-marker-shadow {
|
||||
-webkit-transition: -webkit-transform 0.3s ease-out, opacity 0.3s ease-in;
|
||||
-moz-transition: -moz-transform 0.3s ease-out, opacity 0.3s ease-in;
|
||||
-o-transition: -o-transform 0.3s ease-out, opacity 0.3s ease-in;
|
||||
transition: transform 0.3s ease-out, opacity 0.3s ease-in;
|
||||
}
|
||||
|
||||
.leaflet-cluster-spider-leg {
|
||||
/* stroke-dashoffset (duration and function) should match with leaflet-marker-icon transform in order to track it exactly */
|
||||
-webkit-transition: -webkit-stroke-dashoffset 0.3s ease-out, -webkit-stroke-opacity 0.3s ease-in;
|
||||
-moz-transition: -moz-stroke-dashoffset 0.3s ease-out, -moz-stroke-opacity 0.3s ease-in;
|
||||
-o-transition: -o-stroke-dashoffset 0.3s ease-out, -o-stroke-opacity 0.3s ease-in;
|
||||
transition: stroke-dashoffset 0.3s ease-out, stroke-opacity 0.3s ease-in;
|
||||
}
|
||||
|
|
@ -0,0 +1,133 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Compass</title>
|
||||
<style>
|
||||
#compass {
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
border: 2px solid black;
|
||||
border-radius: 50%;
|
||||
position: relative;
|
||||
margin: 50px auto;
|
||||
}
|
||||
.needle {
|
||||
width: 2px;
|
||||
height: 150px;
|
||||
background-color: red;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
transition: transform 0.5s ease;
|
||||
}
|
||||
#location-info {
|
||||
text-align: center;
|
||||
margin-top: 20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="compass">
|
||||
<div id="needle-1" class="needle"></div>
|
||||
<div id="needle-2" class="needle"></div>
|
||||
<div id="needle-3" class="needle"></div>
|
||||
<div id="needle-4" class="needle"></div>
|
||||
<div id="needle-5" class="needle"></div>
|
||||
<div id="needle-6" class="needle"></div>
|
||||
<div id="needle-7" class="needle"></div>
|
||||
<div id="needle-8" class="needle"></div>
|
||||
</div>
|
||||
<div id="location-info"></div>
|
||||
|
||||
<script>
|
||||
function degreesToRadians(degrees) {
|
||||
return degrees * (Math.PI/180);
|
||||
}
|
||||
|
||||
function distanceBetweenCoords(lat1, lon1, lat2, lon2) {
|
||||
var earthRadiusKm = 6371;
|
||||
|
||||
var dLat = degreesToRadians(lat2-lat1);
|
||||
var dLon = degreesToRadians(lon2-lon1);
|
||||
|
||||
var a =
|
||||
Math.sin(dLat/2) * Math.sin(dLat/2) +
|
||||
Math.cos(degreesToRadians(lat1)) * Math.cos(degreesToRadians(lat2)) *
|
||||
Math.sin(dLon/2) * Math.sin(dLon/2);
|
||||
var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a));
|
||||
var distance = earthRadiusKm * c;
|
||||
|
||||
return distance;
|
||||
}
|
||||
|
||||
function updateCompass(heading) {
|
||||
var needles = document.querySelectorAll('.needle');
|
||||
needles.forEach(function(needle) {
|
||||
needle.style.transform = `translateX(-50%) translateY(-50%) rotate(${heading}deg)`;
|
||||
});
|
||||
}
|
||||
|
||||
function showLocationInfo(latitude, longitude) {
|
||||
var infoElement = document.getElementById('location-info');
|
||||
infoElement.innerHTML = `Latitude: ${latitude.toFixed(5)}, Longitude: ${longitude.toFixed(5)}`;
|
||||
|
||||
// Calculate distances to key spots with different precisions
|
||||
var distances = {
|
||||
'Sector 1 (0.01°)': distanceBetweenCoords(latitude, longitude, latitude + 0.01, longitude),
|
||||
'Sector 2 (0.01°)': distanceBetweenCoords(latitude, longitude, latitude, longitude + 0.01),
|
||||
'Sector 3 (0.01°)': distanceBetweenCoords(latitude, longitude, latitude - 0.01, longitude),
|
||||
'Sector 4 (0.01°)': distanceBetweenCoords(latitude, longitude, latitude, longitude - 0.01),
|
||||
'Region 1 (0.1°)': distanceBetweenCoords(latitude, longitude, latitude + 0.1, longitude),
|
||||
'Region 2 (0.1°)': distanceBetweenCoords(latitude, longitude, latitude, longitude + 0.1),
|
||||
'Region 3 (0.1°)': distanceBetweenCoords(latitude, longitude, latitude - 0.1, longitude),
|
||||
'Region 4 (0.1°)': distanceBetweenCoords(latitude, longitude, latitude, longitude - 0.1)
|
||||
};
|
||||
|
||||
// Check proximity and open URL if less than 10 meters
|
||||
for (var key in distances) {
|
||||
var distance = distances[key];
|
||||
if (distance < 0.01) { // Less than 10 meters (0.01 in degrees is approximately 10 meters)
|
||||
window.open('https://example.com'); // Change URL to the desired one
|
||||
break; // Stop checking once a key spot within proximity is found
|
||||
}
|
||||
}
|
||||
|
||||
// Display distances
|
||||
for (var key in distances) {
|
||||
infoElement.innerHTML += `<br>${key}: ${distances[key].toFixed(2)} km`;
|
||||
}
|
||||
}
|
||||
|
||||
function getLocation() {
|
||||
if (navigator.geolocation) {
|
||||
navigator.geolocation.getCurrentPosition(function(position) {
|
||||
var latitude = position.coords.latitude;
|
||||
var longitude = position.coords.longitude;
|
||||
|
||||
showLocationInfo(latitude, longitude);
|
||||
|
||||
navigator.geolocation.watchPosition(function(position) {
|
||||
var newLatitude = position.coords.latitude;
|
||||
var newLongitude = position.coords.longitude;
|
||||
|
||||
var heading = Math.atan2(newLongitude - longitude, newLatitude - latitude) * (180 / Math.PI);
|
||||
updateCompass(heading);
|
||||
|
||||
showLocationInfo(newLatitude, newLongitude);
|
||||
|
||||
latitude = newLatitude;
|
||||
longitude = newLongitude;
|
||||
});
|
||||
});
|
||||
} else {
|
||||
alert("Geolocation is not supported by this browser.");
|
||||
}
|
||||
}
|
||||
|
||||
getLocation();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 696 B |
Binary file not shown.
|
After Width: | Height: | Size: 2.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 618 B |
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,661 @@
|
|||
/* required styles */
|
||||
|
||||
.leaflet-pane,
|
||||
.leaflet-tile,
|
||||
.leaflet-marker-icon,
|
||||
.leaflet-marker-shadow,
|
||||
.leaflet-tile-container,
|
||||
.leaflet-pane > svg,
|
||||
.leaflet-pane > canvas,
|
||||
.leaflet-zoom-box,
|
||||
.leaflet-image-layer,
|
||||
.leaflet-layer {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
.leaflet-container {
|
||||
overflow: hidden;
|
||||
}
|
||||
.leaflet-tile,
|
||||
.leaflet-marker-icon,
|
||||
.leaflet-marker-shadow {
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
user-select: none;
|
||||
-webkit-user-drag: none;
|
||||
}
|
||||
/* Prevents IE11 from highlighting tiles in blue */
|
||||
.leaflet-tile::selection {
|
||||
background: transparent;
|
||||
}
|
||||
/* Safari renders non-retina tile on retina better with this, but Chrome is worse */
|
||||
.leaflet-safari .leaflet-tile {
|
||||
image-rendering: -webkit-optimize-contrast;
|
||||
}
|
||||
/* hack that prevents hw layers "stretching" when loading new tiles */
|
||||
.leaflet-safari .leaflet-tile-container {
|
||||
width: 1600px;
|
||||
height: 1600px;
|
||||
-webkit-transform-origin: 0 0;
|
||||
}
|
||||
.leaflet-marker-icon,
|
||||
.leaflet-marker-shadow {
|
||||
display: block;
|
||||
}
|
||||
/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */
|
||||
/* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */
|
||||
.leaflet-container .leaflet-overlay-pane svg {
|
||||
max-width: none !important;
|
||||
max-height: none !important;
|
||||
}
|
||||
.leaflet-container .leaflet-marker-pane img,
|
||||
.leaflet-container .leaflet-shadow-pane img,
|
||||
.leaflet-container .leaflet-tile-pane img,
|
||||
.leaflet-container img.leaflet-image-layer,
|
||||
.leaflet-container .leaflet-tile {
|
||||
max-width: none !important;
|
||||
max-height: none !important;
|
||||
width: auto;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.leaflet-container img.leaflet-tile {
|
||||
/* See: https://bugs.chromium.org/p/chromium/issues/detail?id=600120 */
|
||||
mix-blend-mode: plus-lighter;
|
||||
}
|
||||
|
||||
.leaflet-container.leaflet-touch-zoom {
|
||||
-ms-touch-action: pan-x pan-y;
|
||||
touch-action: pan-x pan-y;
|
||||
}
|
||||
.leaflet-container.leaflet-touch-drag {
|
||||
-ms-touch-action: pinch-zoom;
|
||||
/* Fallback for FF which doesn't support pinch-zoom */
|
||||
touch-action: none;
|
||||
touch-action: pinch-zoom;
|
||||
}
|
||||
.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
|
||||
-ms-touch-action: none;
|
||||
touch-action: none;
|
||||
}
|
||||
.leaflet-container {
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
.leaflet-container a {
|
||||
-webkit-tap-highlight-color: rgba(51, 181, 229, 0.4);
|
||||
}
|
||||
.leaflet-tile {
|
||||
filter: inherit;
|
||||
visibility: hidden;
|
||||
}
|
||||
.leaflet-tile-loaded {
|
||||
visibility: inherit;
|
||||
}
|
||||
.leaflet-zoom-box {
|
||||
width: 0;
|
||||
height: 0;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
z-index: 800;
|
||||
}
|
||||
/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
|
||||
.leaflet-overlay-pane svg {
|
||||
-moz-user-select: none;
|
||||
}
|
||||
|
||||
.leaflet-pane { z-index: 400; }
|
||||
|
||||
.leaflet-tile-pane { z-index: 200; }
|
||||
.leaflet-overlay-pane { z-index: 400; }
|
||||
.leaflet-shadow-pane { z-index: 500; }
|
||||
.leaflet-marker-pane { z-index: 600; }
|
||||
.leaflet-tooltip-pane { z-index: 650; }
|
||||
.leaflet-popup-pane { z-index: 700; }
|
||||
|
||||
.leaflet-map-pane canvas { z-index: 100; }
|
||||
.leaflet-map-pane svg { z-index: 200; }
|
||||
|
||||
.leaflet-vml-shape {
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
}
|
||||
.lvml {
|
||||
behavior: url(#default#VML);
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
|
||||
/* control positioning */
|
||||
|
||||
.leaflet-control {
|
||||
position: relative;
|
||||
z-index: 800;
|
||||
pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
|
||||
pointer-events: auto;
|
||||
}
|
||||
.leaflet-top,
|
||||
.leaflet-bottom {
|
||||
position: absolute;
|
||||
z-index: 1000;
|
||||
pointer-events: none;
|
||||
}
|
||||
.leaflet-top {
|
||||
top: 0;
|
||||
}
|
||||
.leaflet-right {
|
||||
right: 0;
|
||||
}
|
||||
.leaflet-bottom {
|
||||
bottom: 0;
|
||||
}
|
||||
.leaflet-left {
|
||||
left: 0;
|
||||
}
|
||||
.leaflet-control {
|
||||
float: left;
|
||||
clear: both;
|
||||
}
|
||||
.leaflet-right .leaflet-control {
|
||||
float: right;
|
||||
}
|
||||
.leaflet-top .leaflet-control {
|
||||
margin-top: 10px;
|
||||
}
|
||||
.leaflet-bottom .leaflet-control {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.leaflet-left .leaflet-control {
|
||||
margin-left: 10px;
|
||||
}
|
||||
.leaflet-right .leaflet-control {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
|
||||
/* zoom and fade animations */
|
||||
|
||||
.leaflet-fade-anim .leaflet-popup {
|
||||
opacity: 0;
|
||||
-webkit-transition: opacity 0.2s linear;
|
||||
-moz-transition: opacity 0.2s linear;
|
||||
transition: opacity 0.2s linear;
|
||||
}
|
||||
.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
|
||||
opacity: 1;
|
||||
}
|
||||
.leaflet-zoom-animated {
|
||||
-webkit-transform-origin: 0 0;
|
||||
-ms-transform-origin: 0 0;
|
||||
transform-origin: 0 0;
|
||||
}
|
||||
svg.leaflet-zoom-animated {
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
.leaflet-zoom-anim .leaflet-zoom-animated {
|
||||
-webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);
|
||||
-moz-transition: -moz-transform 0.25s cubic-bezier(0,0,0.25,1);
|
||||
transition: transform 0.25s cubic-bezier(0,0,0.25,1);
|
||||
}
|
||||
.leaflet-zoom-anim .leaflet-tile,
|
||||
.leaflet-pan-anim .leaflet-tile {
|
||||
-webkit-transition: none;
|
||||
-moz-transition: none;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.leaflet-zoom-anim .leaflet-zoom-hide {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
|
||||
/* cursors */
|
||||
|
||||
.leaflet-interactive {
|
||||
cursor: pointer;
|
||||
}
|
||||
.leaflet-grab {
|
||||
cursor: -webkit-grab;
|
||||
cursor: -moz-grab;
|
||||
cursor: grab;
|
||||
}
|
||||
.leaflet-crosshair,
|
||||
.leaflet-crosshair .leaflet-interactive {
|
||||
cursor: crosshair;
|
||||
}
|
||||
.leaflet-popup-pane,
|
||||
.leaflet-control {
|
||||
cursor: auto;
|
||||
}
|
||||
.leaflet-dragging .leaflet-grab,
|
||||
.leaflet-dragging .leaflet-grab .leaflet-interactive,
|
||||
.leaflet-dragging .leaflet-marker-draggable {
|
||||
cursor: move;
|
||||
cursor: -webkit-grabbing;
|
||||
cursor: -moz-grabbing;
|
||||
cursor: grabbing;
|
||||
}
|
||||
|
||||
/* marker & overlays interactivity */
|
||||
.leaflet-marker-icon,
|
||||
.leaflet-marker-shadow,
|
||||
.leaflet-image-layer,
|
||||
.leaflet-pane > svg path,
|
||||
.leaflet-tile-container {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.leaflet-marker-icon.leaflet-interactive,
|
||||
.leaflet-image-layer.leaflet-interactive,
|
||||
.leaflet-pane > svg path.leaflet-interactive,
|
||||
svg.leaflet-image-layer.leaflet-interactive path {
|
||||
pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* visual tweaks */
|
||||
|
||||
.leaflet-container {
|
||||
background: #ddd;
|
||||
outline-offset: 1px;
|
||||
}
|
||||
.leaflet-container a {
|
||||
color: #0078A8;
|
||||
}
|
||||
.leaflet-zoom-box {
|
||||
border: 2px dotted #38f;
|
||||
background: rgba(255,255,255,0.5);
|
||||
}
|
||||
|
||||
|
||||
/* general typography */
|
||||
.leaflet-container {
|
||||
font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
|
||||
font-size: 12px;
|
||||
font-size: 0.75rem;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
|
||||
/* general toolbar styles */
|
||||
|
||||
.leaflet-bar {
|
||||
box-shadow: 0 1px 5px rgba(0,0,0,0.65);
|
||||
border-radius: 4px;
|
||||
}
|
||||
.leaflet-bar a {
|
||||
background-color: #fff;
|
||||
border-bottom: 1px solid #ccc;
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
line-height: 26px;
|
||||
display: block;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
color: black;
|
||||
}
|
||||
.leaflet-bar a,
|
||||
.leaflet-control-layers-toggle {
|
||||
background-position: 50% 50%;
|
||||
background-repeat: no-repeat;
|
||||
display: block;
|
||||
}
|
||||
.leaflet-bar a:hover,
|
||||
.leaflet-bar a:focus {
|
||||
background-color: #f4f4f4;
|
||||
}
|
||||
.leaflet-bar a:first-child {
|
||||
border-top-left-radius: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
}
|
||||
.leaflet-bar a:last-child {
|
||||
border-bottom-left-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
border-bottom: none;
|
||||
}
|
||||
.leaflet-bar a.leaflet-disabled {
|
||||
cursor: default;
|
||||
background-color: #f4f4f4;
|
||||
color: #bbb;
|
||||
}
|
||||
|
||||
.leaflet-touch .leaflet-bar a {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
}
|
||||
.leaflet-touch .leaflet-bar a:first-child {
|
||||
border-top-left-radius: 2px;
|
||||
border-top-right-radius: 2px;
|
||||
}
|
||||
.leaflet-touch .leaflet-bar a:last-child {
|
||||
border-bottom-left-radius: 2px;
|
||||
border-bottom-right-radius: 2px;
|
||||
}
|
||||
|
||||
/* zoom control */
|
||||
|
||||
.leaflet-control-zoom-in,
|
||||
.leaflet-control-zoom-out {
|
||||
font: bold 18px 'Lucida Console', Monaco, monospace;
|
||||
text-indent: 1px;
|
||||
}
|
||||
|
||||
.leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
|
||||
/* layers control */
|
||||
|
||||
.leaflet-control-layers {
|
||||
box-shadow: 0 1px 5px rgba(0,0,0,0.4);
|
||||
background: #fff;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.leaflet-control-layers-toggle {
|
||||
background-image: url(images/layers.png);
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
}
|
||||
.leaflet-retina .leaflet-control-layers-toggle {
|
||||
background-image: url(images/layers-2x.png);
|
||||
background-size: 26px 26px;
|
||||
}
|
||||
.leaflet-touch .leaflet-control-layers-toggle {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
}
|
||||
.leaflet-control-layers .leaflet-control-layers-list,
|
||||
.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
|
||||
display: none;
|
||||
}
|
||||
.leaflet-control-layers-expanded .leaflet-control-layers-list {
|
||||
display: block;
|
||||
position: relative;
|
||||
}
|
||||
.leaflet-control-layers-expanded {
|
||||
padding: 6px 10px 6px 6px;
|
||||
color: #333;
|
||||
background: #fff;
|
||||
}
|
||||
.leaflet-control-layers-scrollbar {
|
||||
overflow-y: scroll;
|
||||
overflow-x: hidden;
|
||||
padding-right: 5px;
|
||||
}
|
||||
.leaflet-control-layers-selector {
|
||||
margin-top: 2px;
|
||||
position: relative;
|
||||
top: 1px;
|
||||
}
|
||||
.leaflet-control-layers label {
|
||||
display: block;
|
||||
font-size: 13px;
|
||||
font-size: 1.08333em;
|
||||
}
|
||||
.leaflet-control-layers-separator {
|
||||
height: 0;
|
||||
border-top: 1px solid #ddd;
|
||||
margin: 5px -10px 5px -6px;
|
||||
}
|
||||
|
||||
/* Default icon URLs */
|
||||
.leaflet-default-icon-path { /* used only in path-guessing heuristic, see L.Icon.Default */
|
||||
background-image: url(images/marker-icon.png);
|
||||
}
|
||||
|
||||
|
||||
/* attribution and scale controls */
|
||||
|
||||
.leaflet-container .leaflet-control-attribution {
|
||||
background: #fff;
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
margin: 0;
|
||||
}
|
||||
.leaflet-control-attribution,
|
||||
.leaflet-control-scale-line {
|
||||
padding: 0 5px;
|
||||
color: #333;
|
||||
line-height: 1.4;
|
||||
}
|
||||
.leaflet-control-attribution a {
|
||||
text-decoration: none;
|
||||
}
|
||||
.leaflet-control-attribution a:hover,
|
||||
.leaflet-control-attribution a:focus {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.leaflet-attribution-flag {
|
||||
display: inline !important;
|
||||
vertical-align: baseline !important;
|
||||
width: 1em;
|
||||
height: 0.6669em;
|
||||
}
|
||||
.leaflet-left .leaflet-control-scale {
|
||||
margin-left: 5px;
|
||||
}
|
||||
.leaflet-bottom .leaflet-control-scale {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.leaflet-control-scale-line {
|
||||
border: 2px solid #777;
|
||||
border-top: none;
|
||||
line-height: 1.1;
|
||||
padding: 2px 5px 1px;
|
||||
white-space: nowrap;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
text-shadow: 1px 1px #fff;
|
||||
}
|
||||
.leaflet-control-scale-line:not(:first-child) {
|
||||
border-top: 2px solid #777;
|
||||
border-bottom: none;
|
||||
margin-top: -2px;
|
||||
}
|
||||
.leaflet-control-scale-line:not(:first-child):not(:last-child) {
|
||||
border-bottom: 2px solid #777;
|
||||
}
|
||||
|
||||
.leaflet-touch .leaflet-control-attribution,
|
||||
.leaflet-touch .leaflet-control-layers,
|
||||
.leaflet-touch .leaflet-bar {
|
||||
box-shadow: none;
|
||||
}
|
||||
.leaflet-touch .leaflet-control-layers,
|
||||
.leaflet-touch .leaflet-bar {
|
||||
border: 2px solid rgba(0,0,0,0.2);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
|
||||
/* popup */
|
||||
|
||||
.leaflet-popup {
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.leaflet-popup-content-wrapper {
|
||||
padding: 1px;
|
||||
text-align: left;
|
||||
border-radius: 12px;
|
||||
}
|
||||
.leaflet-popup-content {
|
||||
margin: 13px 24px 13px 20px;
|
||||
line-height: 1.3;
|
||||
font-size: 13px;
|
||||
font-size: 1.08333em;
|
||||
min-height: 1px;
|
||||
}
|
||||
.leaflet-popup-content p {
|
||||
margin: 17px 0;
|
||||
margin: 1.3em 0;
|
||||
}
|
||||
.leaflet-popup-tip-container {
|
||||
width: 40px;
|
||||
height: 20px;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
margin-top: -1px;
|
||||
margin-left: -20px;
|
||||
overflow: hidden;
|
||||
pointer-events: none;
|
||||
}
|
||||
.leaflet-popup-tip {
|
||||
width: 17px;
|
||||
height: 17px;
|
||||
padding: 1px;
|
||||
|
||||
margin: -10px auto 0;
|
||||
pointer-events: auto;
|
||||
|
||||
-webkit-transform: rotate(45deg);
|
||||
-moz-transform: rotate(45deg);
|
||||
-ms-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
.leaflet-popup-content-wrapper,
|
||||
.leaflet-popup-tip {
|
||||
background: white;
|
||||
color: #333;
|
||||
box-shadow: 0 3px 14px rgba(0,0,0,0.4);
|
||||
}
|
||||
.leaflet-container a.leaflet-popup-close-button {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
border: none;
|
||||
text-align: center;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
font: 16px/24px Tahoma, Verdana, sans-serif;
|
||||
color: #757575;
|
||||
text-decoration: none;
|
||||
background: transparent;
|
||||
}
|
||||
.leaflet-container a.leaflet-popup-close-button:hover,
|
||||
.leaflet-container a.leaflet-popup-close-button:focus {
|
||||
color: #585858;
|
||||
}
|
||||
.leaflet-popup-scrolled {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.leaflet-oldie .leaflet-popup-content-wrapper {
|
||||
-ms-zoom: 1;
|
||||
}
|
||||
.leaflet-oldie .leaflet-popup-tip {
|
||||
width: 24px;
|
||||
margin: 0 auto;
|
||||
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
|
||||
filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);
|
||||
}
|
||||
|
||||
.leaflet-oldie .leaflet-control-zoom,
|
||||
.leaflet-oldie .leaflet-control-layers,
|
||||
.leaflet-oldie .leaflet-popup-content-wrapper,
|
||||
.leaflet-oldie .leaflet-popup-tip {
|
||||
border: 1px solid #999;
|
||||
}
|
||||
|
||||
|
||||
/* div icon */
|
||||
|
||||
.leaflet-div-icon {
|
||||
background: #fff;
|
||||
border: 1px solid #666;
|
||||
}
|
||||
|
||||
|
||||
/* Tooltip */
|
||||
/* Base styles for the element that has a tooltip */
|
||||
.leaflet-tooltip {
|
||||
position: absolute;
|
||||
padding: 6px;
|
||||
background-color: #fff;
|
||||
border: 1px solid #fff;
|
||||
border-radius: 3px;
|
||||
color: #222;
|
||||
white-space: nowrap;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
pointer-events: none;
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,0.4);
|
||||
}
|
||||
.leaflet-tooltip.leaflet-interactive {
|
||||
cursor: pointer;
|
||||
pointer-events: auto;
|
||||
}
|
||||
.leaflet-tooltip-top:before,
|
||||
.leaflet-tooltip-bottom:before,
|
||||
.leaflet-tooltip-left:before,
|
||||
.leaflet-tooltip-right:before {
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
border: 6px solid transparent;
|
||||
background: transparent;
|
||||
content: "";
|
||||
}
|
||||
|
||||
/* Directions */
|
||||
|
||||
.leaflet-tooltip-bottom {
|
||||
margin-top: 6px;
|
||||
}
|
||||
.leaflet-tooltip-top {
|
||||
margin-top: -6px;
|
||||
}
|
||||
.leaflet-tooltip-bottom:before,
|
||||
.leaflet-tooltip-top:before {
|
||||
left: 50%;
|
||||
margin-left: -6px;
|
||||
}
|
||||
.leaflet-tooltip-top:before {
|
||||
bottom: 0;
|
||||
margin-bottom: -12px;
|
||||
border-top-color: #fff;
|
||||
}
|
||||
.leaflet-tooltip-bottom:before {
|
||||
top: 0;
|
||||
margin-top: -12px;
|
||||
margin-left: -6px;
|
||||
border-bottom-color: #fff;
|
||||
}
|
||||
.leaflet-tooltip-left {
|
||||
margin-left: -6px;
|
||||
}
|
||||
.leaflet-tooltip-right {
|
||||
margin-left: 6px;
|
||||
}
|
||||
.leaflet-tooltip-left:before,
|
||||
.leaflet-tooltip-right:before {
|
||||
top: 50%;
|
||||
margin-top: -6px;
|
||||
}
|
||||
.leaflet-tooltip-left:before {
|
||||
right: 0;
|
||||
margin-right: -12px;
|
||||
border-left-color: #fff;
|
||||
}
|
||||
.leaflet-tooltip-right:before {
|
||||
left: 0;
|
||||
margin-left: -12px;
|
||||
border-right-color: #fff;
|
||||
}
|
||||
|
||||
/* Printing */
|
||||
|
||||
@media print {
|
||||
/* Prevent printers from removing background-images of controls. */
|
||||
.leaflet-control {
|
||||
-webkit-print-color-adjust: exact;
|
||||
print-color-adjust: exact;
|
||||
}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Binary file not shown.
|
|
@ -0,0 +1,109 @@
|
|||
<!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="en">
|
||||
<!-- TODO: Add a title for your zine -->
|
||||
<title>[TW5 and TiddlyWiki]</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/QmTSfxH1kG12JooZ3TG8eGkoYqjcbxy29ejqiVworuBFro" />
|
||||
<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">
|
||||
<h1>TiddlyWiki</h1>
|
||||
<p>Welcome, Traveler, to the innovative world of TW5—a TiddlyWiki postit-based personal data store designed to empower you on your journey through UPlanet.</p>
|
||||
<!-- TODO: Your front cover content goes here, so you probably want a good title and maybe some kind of image -->
|
||||
<img class="full-img" src="/ipfs/QmSM1XmD7gcH2sjGBicya9nzTh5TdA8s7AksbYbQZ4t5JY">
|
||||
<h2>🌐 online and 🌴 offline<br>
|
||||
<button class="print-button">📃 ️Print</button> ✂️ cut 🙏 fold 📘 share 💜</h2>
|
||||
</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! -->
|
||||
<p>Your personalized TW5 dashboard awaits, ready to serve as your digital hub for storing and managing your data freely and securely.</p>
|
||||
<hr>
|
||||
<p>Organize Your Data with Tiddlers: Within TW5, information is stored in bite-sized units called Tiddlers. Each Tiddler represents a specific piece of data—whether it's a note, a document, an ipfs cid.</p>
|
||||
<hr>
|
||||
<h2>Use Tiddlers to share your thoughts, ideas, and information in a way that makes sense to you.</h2>
|
||||
</section>
|
||||
<section class="zine-page page-3">
|
||||
<!-- TODO: Page 3 content here -->
|
||||
<p>Customize Your Workspace: Tailor your TW5 experience to suit your unique needs. Customize your workspace with themes, plugins, and extensions to enhance functionality and streamline your workflow. Whether you're a minimalist or a power user, TW5 adapts to your preferences.</p>
|
||||
<hr>
|
||||
<p>Embrace Continuous Improvement: TW5 is constantly evolving to meet the needs of its users. Participate in the development process by providing feedback, suggesting improvements, and contributing to the open-source community. Together, we can shape the future of TW5 and make it even more powerful and intuitive.</p>
|
||||
</section>
|
||||
<section class="zine-page page-4">
|
||||
<!-- TODO: Page 4 - that's the halfway point, you're nearly there! -->
|
||||
<p>Collaborate and Share: TW5 isn't just a personal data store—it's a collaborative platform where ideas are born and shared. Collaborate with fellow travelers by sharing Tiddlers, collaborating on projects, and contributing to communal knowledge bases. With TW5, the possibilities for collaboration are endless.</p>
|
||||
</section>
|
||||
|
||||
|
||||
<section class="zine-page page-5">
|
||||
<!-- TODO: You guessed it, page 5 content now -->
|
||||
<p>With TW5 as your personal data store, the possibilities are limitless. Organize your thoughts, collaborate with others, and unlock the full potential of your data on UPlanet. Welcome to a new era of digital empowerment—welcome to TW5.</p>
|
||||
<hr>
|
||||
<p>Happy exploring!</p>
|
||||
|
||||
</section>
|
||||
<section class="zine-page page-6">
|
||||
<!-- TODO: Page 6, this is the last "page" but you can still keep going -->
|
||||
<table class="zine-instructions">
|
||||
<tr>
|
||||
<td><b>Step 1:</b> Print, cut, fold MULTIPASS. Crease all the lines then fold in half. Cut across the fold halfway through the page. Unfold and there should be a little hole. Fold lengthways. Gently fold the centre until you form a + shape. Now - magic! Fold all the pages around. Page 1 is the front cover, page 8 is the back.</td>
|
||||
<td><img class="mini-img" src="/ipfs/QmRQeE5XsYXAd32inVsWRFWqDCiMqkbU3txxdQwDqBRRLn">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><b>Step 2:</b> Open TW5. Delete AstroID.</td>
|
||||
<td><img class="mini-img" src="/ipfs/QmcqciKy23cETr7G8mkLPjnLWuRQbBtsj6RcKd9WiU849x">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><b>Step 3:</b> Add tiddlers. Take control. </td>
|
||||
<td><img class="mini-img" src="/ipfs/QmRTMzb3WYNgaNtqFoeQZMX7MFqpa6teDaNnqWA96gTEAi">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
</section>
|
||||
<section class="zine-page page-7">
|
||||
<!-- TODO: Page 7, this is the inside of the back cover -->
|
||||
<table class="zine-instructions">
|
||||
<tr>
|
||||
<td><b>Step 4:</b> Customize your email Tiddler: Each traveler have a Tiddler within their TW5 titled with their email address. This serves as a unique signature—a digital calling card that identifies them across the cosmos.</td>
|
||||
<td><img class="mini-img" src="/ipfs/QmaDPopWqTZMPQYwv3Tt7kJAttWjg9JS2btE3EGmP91Hnj">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><b>Step 5:</b> Copy and Connect: To connect with others, copy their email title Tiddler into your own TW5, signaling your interest in sharing information and establishing connections.</td>
|
||||
<td><img class="mini-img" src="https://cdn.glitch.com/c10b2617-5888-415b-b574-42e2ab8f3484%2Fzine-fold-07.png">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</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 -->
|
||||
<table class="zine-instructions">
|
||||
<tr>
|
||||
<td><b>Step 6:</b> Explore Shared Tiddlers: Access Tiddlers shared by connected travelers, exploring a wealth of knowledge, notes, and collaborations.</td>
|
||||
<td><img class="mini-img" src="https://cdn.glitch.com/c10b2617-5888-415b-b574-42e2ab8f3484%2Fzine-fold-06.png">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><b>Step 7:</b> Collaborate and Grow: Utilize shared Tiddlers to collaborate on projects, exchange ideas, and foster connections with fellow travelers, enriching the collective knowledge of the UPlanet community.</td>
|
||||
<td><img class="mini-img" src="https://cdn.glitch.com/c10b2617-5888-415b-b574-42e2ab8f3484%2Fzine-fold-07.png">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</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 -->
|
||||
|
|
@ -0,0 +1,87 @@
|
|||
<!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="en">
|
||||
<!-- TODO: Add a title for your zine -->
|
||||
<title>[_PLAYER_ 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">
|
||||
<h2><button class="print-button">🖨️Print</button> <a href='https://qo-op.com'>MULTIPASS</a> ☼☼☼☼☼</h2>
|
||||
<!-- TODO: Your front cover content goes here, so you probably want a good title and maybe some kind of image -->
|
||||
<img class="full-img" src="/ipfs/QmRQeE5XsYXAd32inVsWRFWqDCiMqkbU3txxdQwDqBRRLn">
|
||||
<pre><code class="language-css">_ASTRODID_</code></pre>
|
||||
</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! -->
|
||||
MULTIPASS is your gateway to a decentralized universe of data and exploration. With MULTIPASS, 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 MULTIPASS 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 MULTIPASS 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 MULTIPASS 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.
|
||||
🚀🌠
|
||||
</section>
|
||||
<section class="zine-page page-5">
|
||||
<!-- TODO: You guessed it, page 5 content now -->
|
||||
Secure your MULTIPASS 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="full-img" src='/ipfs/QmdmeZhD8ncBFptmD5VSJoszmu41edtT265Xq3HVh8PhZP'\></a><br>
|
||||
<br>CODE : 0448
|
||||
<h3> /--> SECTOR : <a
|
||||
href='_EARTHCID_/map_render.html?southWestLat=_SLAT_&southWestLon=_SLON_°=0.1'>_SECTOR_</a></h3>
|
||||
<hr>
|
||||
</section>
|
||||
<section class="zine-page page-6">
|
||||
<!-- TODO: Page 6, this is the last "page" but you can still keep going -->
|
||||
We are thrilled to unveil your ZenCard—a tangible symbol of empowerment and financial sovereignty in our decentralized cosmos.
|
||||
<hr>
|
||||
<h1><a target='TW' href='/ipns/_ASTRONAUTENS_#ZenCard' title='_G1PUB_'>ZenCard</a> + "<a target='TW' href='/ipns/_ASTRONAUTENS_'>TW5</a>"</h1>
|
||||
<img class="full-img" src='/ipfs/QmTL7VDgkYjpYC2qiiFCfah2pSqDMkTANMeMtjMndwXq9y'\><br><hr>
|
||||
<pre><code class="language-css">_PLAYER_
|
||||
_G1PUB_
|
||||
<a href='/ipns/_IPFSNODEID_'>_IPFSNODEID_</a></code></pre>
|
||||
</section>
|
||||
<section class="zine-page page-7">
|
||||
<!-- TODO: Page 7, this is the inside of the back cover -->
|
||||
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 ♥ 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 ♥ 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!
|
||||
🌌💰
|
||||
|
||||
</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 -->
|
||||
Loading…
Reference in New Issue