diff --git a/client/Terminal-00-Multiuser.user.js b/client/Terminal-00-Multiuser.user.js
index b6d3a20..895814f 100644
--- a/client/Terminal-00-Multiuser.user.js
+++ b/client/Terminal-00-Multiuser.user.js
@@ -1,7 +1,7 @@
// ==UserScript==
// @name MultiProbe
// @namespace https://*.angusnicneven.com/*
-// @version 20241012.0
+// @version 20241013.0
// @description Probe with friends!
// @author tgpholly
// @match https://*.angusnicneven.com/*
@@ -55,7 +55,7 @@ console.log("[MP] MultiProbe init");
'use strict';
// Make sure to change the userscript version too!!!!!!!!!!
- const USERSCRIPT_VERSION_RAW = "20241012.0";
+ const USERSCRIPT_VERSION_RAW = "20241013.0";
const USERSCRIPT_VERSION = parseInt(USERSCRIPT_VERSION_RAW.replace(".", ""));
if (!continueRunningScript) {
@@ -284,54 +284,59 @@ kbd {
@keyframes badgepop {
0% {
- top: -4rem;
+ transform: translate(-50%, -125%);
}
100% {
- top: 0rem;
+ transform: translate(-50%, 0%);
}
}
@keyframes badgepopout {
0% {
- top: 0rem;
+ transform: translate(-50%, 0%);
}
100% {
- top: -4rem;
+ transform: translate(-50%, -125%);
}
}
.badgepopout {
- top: -4rem;
+ transform: translate(-50%, -125%);
+ visibility: visible!important;
animation: badgepopout .35s ease-in-out !important;
}
.badgepopin {
- top: 0rem;
+ transform: translate(-50%, 0%);
+ visibility: visible!important;
animation: badgepop .35s ease-in-out !important;
animation-iteration-count: 1;
}
.badgepopcreate {
- top: -4rem;
+ transform: translate(-50%, -125%);
}
.badgepop {
position: absolute;
margin-top: .5rem;
- width: 15rem;
+ visibility: hidden;
+ width: calc(15.0rem + 4vw);
background-color: black;
-
text-align: start!important;
-
padding: .5rem;
-
border: 1px solid white;
+ pointer-events: none;
+}
+
+.badgepop mp_col_auto {
+ padding-right: 0;
}
.badgepop mp_text {
- font-size: 8px;
+ font-size: calc(0.5rem + 0.1vw);
color: white;
padding: 0;
margin: 0;
@@ -346,6 +351,32 @@ mp_container {
display: block;
}
+mp_row {
+ display: flex;
+ flex-wrap: wrap;
+ margin-top: calc(-1 * 0);
+ margin-right: calc(-0.5 * 1.5rem);
+ margin-left: calc(-0.5 * 1.5rem);
+}
+
+mp_row > * {
+ flex-shrink: 0;
+ width: 100%;
+ max-width: 100%;
+ padding-right: calc(1.5rem * 0.5);
+ padding-left: calc(1.5rem * 0.5);
+ margin-top: 0;
+}
+
+mp_col {
+ flex: 1 0 0%;
+}
+
+mp_col_auto {
+ flex: 0 0 auto;
+ width: auto;
+}
+
.badgepop * {
text-align: unset!important;
text-shadow: none!important;
@@ -476,10 +507,6 @@ mp_button {
buttonBox.classList.add("buttons");
user.appendChild(buttonBox);
- /*const followButton = document.createElement("mp_button");
- followButton.innerText = "F";
- buttonBox.appendChild(followButton);*/
-
const gotoButton = document.createElement("mp_button");
gotoButton.innerText = "Go To";
const gotoLoc = location;
@@ -981,7 +1008,6 @@ mp_button {
}
} else {
localStorage["mpconnectonload"] = true;
- //doConnect(localStorage["mpapikey"]);
}
disconnectButton.innerText = localStorage["mpconnectonload"] === "true" ? "Disconnect" : "Connect";
@@ -1112,7 +1138,12 @@ mp_button {
const popup = document.createElement("mp_badge");
popup.classList.add("badgepop");
popup.classList.add("badgepopcreate");
- popup.style = "transform:translateX(-50%)";
+
+ const baseRow = document.createElement("mp_row");
+ popup.appendChild(baseRow);
+
+ const imageCol = document.createElement("mp_col_auto");
+ baseRow.appendChild(imageCol);
const badgeImage = new Image(32, 32);
badgeImage.src = image;
@@ -1122,17 +1153,18 @@ mp_button {
popup.classList.add("badgepopin");
setTimeout(() => popupSound.play(), 100);
};
- popup.appendChild(badgeImage);
+ imageCol.appendChild(badgeImage);
+
+ const textRowCol = document.createElement("mp_col");
+ baseRow.appendChild(textRowCol);
const badgeTitle = document.createElement("mp_text");
badgeTitle.innerHTML = `${title}`;
- badgeTitle.style = "position:absolute;top:.5rem;left:calc(1rem + 32px)";
- popup.appendChild(badgeTitle);
+ textRowCol.appendChild(badgeTitle);
const badgeDescription = document.createElement("mp_text");
- badgeDescription.innerHTML = description;
- badgeDescription.style = "position:absolute;top:1.1rem;left:calc(1rem + 32px)";
- popup.appendChild(badgeDescription);
+ badgeDescription.innerHTML = description.replaceAll("\r", "").replaceAll("\n", "
");
+ textRowCol.appendChild(badgeDescription);
popupRoot.appendChild(popup);