Added new widget "Multistream Alerts"
|
After Width: | Height: | Size: 54 KiB |
@@ -0,0 +1 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 24 24" width="20" height="20" aria-label="Icon" role="img"><path fill-rule="evenodd" d="M18 6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-1.959l2.75 1.588A1.5 1.5 0 0 0 23 16.33V7.67a1.5 1.5 0 0 0-2.25-1.3L18 7.96z" clip-rule="evenodd"></path></svg>
|
||||||
|
After Width: | Height: | Size: 343 B |
@@ -0,0 +1 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><!-- Icon from Material Design Icons by Pictogrammers - https://github.com/Templarian/MaterialDesign/blob/master/LICENSE --><path fill="currentColor" d="M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.62L12 2L9.19 8.62L2 9.24l5.45 4.73L5.82 21z"/></svg>
|
||||||
|
After Width: | Height: | Size: 333 B |
@@ -0,0 +1 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><!-- Icon from Material Design Icons by Pictogrammers - https://github.com/Templarian/MaterialDesign/blob/master/LICENSE --><path fill="currentColor" d="M6.92 5H5l9 9l1-.94m4.96 6.06l-.84.84a.996.996 0 0 1-1.41 0l-3.12-3.12l-2.68 2.66l-1.41-1.41l1.42-1.42L3 7.75V3h4.75l8.92 8.92l1.42-1.42l1.41 1.41l-2.67 2.67l3.12 3.12c.4.4.4 1.03.01 1.42"/></svg>
|
||||||
|
After Width: | Height: | Size: 432 B |
@@ -0,0 +1 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><!-- Icon from All by undefined - undefined --><path fill="currentColor" fill-rule="evenodd" d="M9.592 3.2a6 6 0 0 1-.495.399c-.298.2-.633.338-.985.408c-.153.03-.313.043-.632.068c-.801.064-1.202.096-1.536.214a2.71 2.71 0 0 0-1.655 1.655c-.118.334-.15.735-.214 1.536a6 6 0 0 1-.068.632c-.07.352-.208.687-.408.985c-.087.13-.191.252-.399.495c-.521.612-.782.918-.935 1.238c-.353.74-.353 1.6 0 2.34c.153.32.414.626.935 1.238c.208.243.312.365.399.495c.2.298.338.633.408.985c.03.153.043.313.068.632c.064.801.096 1.202.214 1.536a2.71 2.71 0 0 0 1.655 1.655c.334.118.735.15 1.536.214c.319.025.479.038.632.068c.352.07.687.209.985.408c.13.087.252.191.495.399c.612.521.918.782 1.238.935c.74.353 1.6.353 2.34 0c.32-.153.626-.414 1.238-.935c.243-.208.365-.312.495-.399c.298-.2.633-.338.985-.408c.153-.03.313-.043.632-.068c.801-.064 1.202-.096 1.536-.214a2.71 2.71 0 0 0 1.655-1.655c.118-.334.15-.735.214-1.536c.025-.319.038-.479.068-.632c.07-.352.209-.687.408-.985c.087-.13.191-.252.399-.495c.521-.612.782-.918.935-1.238c.353-.74.353-1.6 0-2.34c-.153-.32-.414-.626-.935-1.238a6 6 0 0 1-.399-.495a2.7 2.7 0 0 1-.408-.985a6 6 0 0 1-.068-.632c-.064-.801-.096-1.202-.214-1.536a2.71 2.71 0 0 0-1.655-1.655c-.334-.118-.735-.15-1.536-.214a6 6 0 0 1-.632-.068a2.7 2.7 0 0 1-.985-.408a6 6 0 0 1-.495-.399c-.612-.521-.918-.782-1.238-.935a2.71 2.71 0 0 0-2.34 0c-.32.153-.626.414-1.238.935m6.781 6.663a.814.814 0 0 0-1.15-1.15l-4.85 4.85l-1.596-1.595a.814.814 0 0 0-1.15 1.15l2.17 2.17a.814.814 0 0 0 1.15 0z" clip-rule="evenodd"/></svg>
|
||||||
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 32 KiB |
|
After Width: | Height: | Size: 13 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 3.9 KiB |
|
After Width: | Height: | Size: 8.4 KiB |
@@ -0,0 +1,28 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<link rel="shortcut icon" href="#" />
|
||||||
|
<link rel="stylesheet" href="./style.css" />
|
||||||
|
<script type="text/javascript" src="https://unpkg.com/@streamerbot/client/dist/streamerbot-client.js"></script>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div id="statusContainer">Connecting...</div>
|
||||||
|
<div id="mainContainer" class="slide-fade">
|
||||||
|
<div id="alertBox" class="highlightMessage">
|
||||||
|
<img id="avatar" src="https://static-cdn.jtvnw.net/jtv_user_pictures/272e643e-4d43-415f-9ee1-18916e825411-profile_image-300x300.png" class="square">
|
||||||
|
<div id="contents">
|
||||||
|
<span id="username">hotarubi_TA</span>
|
||||||
|
<br>
|
||||||
|
<span id="description">gifted a Tier 3 sub</span>
|
||||||
|
<br>
|
||||||
|
<span id="attribute">to nutty</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
<script src="./script.js"></script>
|
||||||
@@ -0,0 +1,64 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Settings</title>
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
/* Remove default body margin */
|
||||||
|
display: flex;
|
||||||
|
/* Use flexbox for layout */
|
||||||
|
background: #181818;
|
||||||
|
}
|
||||||
|
|
||||||
|
#settings-container {
|
||||||
|
width: 600px;
|
||||||
|
/* 50% of viewport width */
|
||||||
|
min-width: 600px;
|
||||||
|
/* 50% of viewport width */
|
||||||
|
height: 100vh;
|
||||||
|
/* 100% of viewport height */
|
||||||
|
border: none;
|
||||||
|
/* Remove default iframe border */
|
||||||
|
}
|
||||||
|
|
||||||
|
#widget-container {
|
||||||
|
flex-grow: 1;
|
||||||
|
/* Allow the content-container to take up remaining space */
|
||||||
|
height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
iframe {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-container {
|
||||||
|
width: 50vw;
|
||||||
|
height: 100vh;
|
||||||
|
background-color: #f0f0f0;
|
||||||
|
/* Example background for right side */
|
||||||
|
padding: 20px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
/* Include padding in width/height */
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<iframe id="settings-container"></iframe>
|
||||||
|
|
||||||
|
<div id="widget-container">
|
||||||
|
<iframe id="widget"></iframe>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="script.js"></script>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
@@ -0,0 +1,29 @@
|
|||||||
|
let settingsContainer = document.getElementById('settings-container');
|
||||||
|
settingsContainer.src = `../../.utilities/settings-page-builder?settingsJson=${window.location.href}/settings.json`
|
||||||
|
console.log(settingsContainer.src);
|
||||||
|
|
||||||
|
function reloadWidget(data) {
|
||||||
|
let widget = document.getElementById("widget");
|
||||||
|
widget.src = `${getParentUrl()}?${data}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
function getParentUrl() {
|
||||||
|
const currentUrl = window.location.href;
|
||||||
|
const urlParts = currentUrl.split('/');
|
||||||
|
|
||||||
|
// Remove the last part of the URL (the current page/file)
|
||||||
|
urlParts.pop();
|
||||||
|
|
||||||
|
// Remove the last part again to go one directory up
|
||||||
|
urlParts.pop();
|
||||||
|
|
||||||
|
// Reconstruct the URL
|
||||||
|
const parentUrl = urlParts.join('/');
|
||||||
|
|
||||||
|
// Ensure there's a trailing slash if necessary (if it was a directory)
|
||||||
|
if (urlParts.length > 2 && !parentUrl.endsWith('/')) {
|
||||||
|
return parentUrl + '/';
|
||||||
|
}
|
||||||
|
|
||||||
|
return parentUrl;
|
||||||
|
}
|
||||||
@@ -0,0 +1,359 @@
|
|||||||
|
{
|
||||||
|
"settings": [
|
||||||
|
{
|
||||||
|
"id": "showPlatform",
|
||||||
|
"label": "Show Platform",
|
||||||
|
"description": "",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Appearance"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showAvatar",
|
||||||
|
"label": "Show Avatar",
|
||||||
|
"description": "",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Appearance"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showTimestamps",
|
||||||
|
"label": "Show Timestamps",
|
||||||
|
"description": "",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Appearance"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showBadges",
|
||||||
|
"label": "Show Badges",
|
||||||
|
"description": "",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Appearance"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showPronouns",
|
||||||
|
"label": "Show Pronouns",
|
||||||
|
"description": "",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Appearance"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showUsername",
|
||||||
|
"label": "Show Username",
|
||||||
|
"description": "",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Appearance"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showMessage",
|
||||||
|
"label": "Show Message",
|
||||||
|
"description": "Honestly, if you turn this off, you're stupid lmao",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Appearance"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "font",
|
||||||
|
"label": "Font",
|
||||||
|
"description": "",
|
||||||
|
"type": "text",
|
||||||
|
"defaultValue": "",
|
||||||
|
"group": "Appearance"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "fontSize",
|
||||||
|
"label": "Font Size",
|
||||||
|
"description": "",
|
||||||
|
"type": "number",
|
||||||
|
"min": 1,
|
||||||
|
"max": 120,
|
||||||
|
"defaultValue": 30,
|
||||||
|
"group": "Appearance"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "lineSpacing",
|
||||||
|
"label": "Line Spacing",
|
||||||
|
"description": "",
|
||||||
|
"type": "number",
|
||||||
|
"min": 0,
|
||||||
|
"defaultValue": 1.7,
|
||||||
|
"step": ".1",
|
||||||
|
"group": "Appearance"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "background",
|
||||||
|
"label": "Background",
|
||||||
|
"description": "",
|
||||||
|
"type": "color",
|
||||||
|
"defaultValue": "#000000",
|
||||||
|
"group": "Appearance"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "opacity",
|
||||||
|
"label": "Background Opacity",
|
||||||
|
"description": "",
|
||||||
|
"type": "number",
|
||||||
|
"defaultValue": "0.85",
|
||||||
|
"min": 0,
|
||||||
|
"max": 1,
|
||||||
|
"step": ".01",
|
||||||
|
"group": "Appearance"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "hideAfter",
|
||||||
|
"label": "Hide After",
|
||||||
|
"description": "Messages fade after X seconds (0 to disable)",
|
||||||
|
"type": "number",
|
||||||
|
"min": 0,
|
||||||
|
"max": 120,
|
||||||
|
"defaultValue": 0,
|
||||||
|
"group": "General"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "excludeCommands",
|
||||||
|
"label": "Exclude Commands",
|
||||||
|
"description": "Hide messages starting with \"!\"",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "General"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "ignoreChatters",
|
||||||
|
"label": "Ignore Chatters",
|
||||||
|
"description": "Ignored chatters will not be shown",
|
||||||
|
"type": "text",
|
||||||
|
"defaultValue": "StreamElements,Streamlabs",
|
||||||
|
"group": "General"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "scrollDirection",
|
||||||
|
"label": "Scroll Direction",
|
||||||
|
"description": "",
|
||||||
|
"type": "select",
|
||||||
|
"options": [
|
||||||
|
{
|
||||||
|
"value": 1,
|
||||||
|
"label": "Normal"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"value": 2,
|
||||||
|
"label": "Reversed"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"defaultValue": 1,
|
||||||
|
"group": "General"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "inlineChat",
|
||||||
|
"label": "In-line Chat",
|
||||||
|
"description": "Remove the line space after the username",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": false,
|
||||||
|
"group": "General"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "imageEmbedPermissionLevel",
|
||||||
|
"label": "Embed Images",
|
||||||
|
"description": "Automatically embed images for these users",
|
||||||
|
"type": "select",
|
||||||
|
"options": [
|
||||||
|
{
|
||||||
|
"value": 40,
|
||||||
|
"label": "Broadcaster"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"value": 30,
|
||||||
|
"label": "Mods & Broadcaster"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"value": 20,
|
||||||
|
"label": "VIPs, Mods & Broadcaster"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"value": 15,
|
||||||
|
"label": "Subs, VIPs, Mods & Broadcaster"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"value": 10,
|
||||||
|
"label": "Everyone"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"value": 69420,
|
||||||
|
"label": "Nobody"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"defaultValue": 20,
|
||||||
|
"group": "General"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showTwitchMessages",
|
||||||
|
"label": "Chat Messages",
|
||||||
|
"description": "",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Which Twitch messages do you want to see?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showTwitchAnnouncements",
|
||||||
|
"label": "Announcements",
|
||||||
|
"description": "",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Which Twitch messages do you want to see?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showTwitchSubs",
|
||||||
|
"label": "New Subscribers",
|
||||||
|
"description": "",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Which Twitch messages do you want to see?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showTwitchChannelPointRedemptions",
|
||||||
|
"label": "Channel Point Redemptions",
|
||||||
|
"description": "",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Which Twitch messages do you want to see?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showTwitchRaids",
|
||||||
|
"label": "Raids",
|
||||||
|
"description": "",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Which Twitch messages do you want to see?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showTwitchSharedChat",
|
||||||
|
"label": "Shared Chat Messages",
|
||||||
|
"description": "",
|
||||||
|
"type": "select",
|
||||||
|
"options": [
|
||||||
|
{
|
||||||
|
"value": 2,
|
||||||
|
"label": "Show & Highlight"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"value": 1,
|
||||||
|
"label": "Show but do not highlight"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"value": 0,
|
||||||
|
"label": "Do not show"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"defaultValue": 2,
|
||||||
|
"group": "Which Twitch messages do you want to see?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showYouTubeMessages",
|
||||||
|
"label": "Chat Messages",
|
||||||
|
"description": "",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Which YouTube messages do you want to see?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showYouTubeSuperChats",
|
||||||
|
"label": "Super Chats",
|
||||||
|
"description": "",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Which YouTube messages do you want to see?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showYouTubeSuperStickers",
|
||||||
|
"label": "Super Stickers",
|
||||||
|
"description": "",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Which YouTube messages do you want to see?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showYouTubeMemberships",
|
||||||
|
"label": "Memberships",
|
||||||
|
"description": "",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Which YouTube messages do you want to see?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showStreamlabsDonations",
|
||||||
|
"label": "Streamlabs Tips",
|
||||||
|
"description": "<a href=\"https://docs.streamer.bot/guide/integrations/streamlabs\" target=\"_blank\">Click to connect</a>",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Which donation messages do you want to see?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showStreamElementsTips",
|
||||||
|
"label": "StreamElements Tips",
|
||||||
|
"description": "<a href=\"https://docs.streamer.bot/guide/integrations/streamelements\" target=\"_blank\">Click to connect</a>",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Which donation messages do you want to see?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showPatreonMemberships",
|
||||||
|
"label": "Patreon Memberships",
|
||||||
|
"description": "<a href=\"https://docs.streamer.bot/guide/integrations/patreon\" target=\"_blank\">Click to connect</a>",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Which donation messages do you want to see?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showKofiDonations",
|
||||||
|
"label": "Ko-fi Donations",
|
||||||
|
"description": "<a href=\"https://docs.streamer.bot/guide/integrations/ko-fi\" target=\"_blank\">Click to connect</a>",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Which donation messages do you want to see?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showTipeeeStreamDonations",
|
||||||
|
"label": "TipeeeStream Donations",
|
||||||
|
"description": "<a href=\"https://docs.streamer.bot/guide/integrations/tipeee-stream\" target=\"_blank\">Click to connect</a>",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Which donation messages do you want to see?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "showFourthwallAlerts",
|
||||||
|
"label": "Fourthwall Alerts",
|
||||||
|
"description": "<a href=\"https://docs.streamer.bot/guide/integrations/fourthwall\" target=\"_blank\">Click to connect</a>",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": true,
|
||||||
|
"group": "Which donation messages do you want to see?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "furryMode",
|
||||||
|
"label": "Furry Mode",
|
||||||
|
"description": "Meow",
|
||||||
|
"type": "checkbox",
|
||||||
|
"defaultValue": false,
|
||||||
|
"group": "Very Important Stuff"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "address",
|
||||||
|
"label": "Address",
|
||||||
|
"description": "Streamer.bot Websocket Server Address",
|
||||||
|
"type": "text",
|
||||||
|
"defaultValue": "127.0.0.1",
|
||||||
|
"group": "Advanced"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "port",
|
||||||
|
"label": "Port",
|
||||||
|
"description": "Streamer.bot Websocket Server Port",
|
||||||
|
"type": "text",
|
||||||
|
"defaultValue": "8080",
|
||||||
|
"group": "Advanced"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
@@ -0,0 +1,206 @@
|
|||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
--margin: 40px;
|
||||||
|
/* --border-radius: 20px; */
|
||||||
|
font-size: 30px;
|
||||||
|
/* --line-spacing: 1.7em; */
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
html {
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
scroll-behavior: smooth;
|
||||||
|
/* background: #000000d9; */
|
||||||
|
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
|
||||||
|
color: white;
|
||||||
|
text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
|
||||||
|
overflow-wrap: break-word;
|
||||||
|
}
|
||||||
|
|
||||||
|
#statusContainer {
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 30px;
|
||||||
|
text-align: center;
|
||||||
|
background-color: #D12025;
|
||||||
|
color: white;
|
||||||
|
padding: 10px;
|
||||||
|
border-radius: 10px;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
#mainContainer {
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
padding: var(--margin);
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
#alertBox {
|
||||||
|
display: flex;
|
||||||
|
padding: 0.5em;
|
||||||
|
border-radius: 0.75em;
|
||||||
|
filter: drop-shadow(15px 15px 7px rgba(0, 0, 0, 1));
|
||||||
|
position: relative;
|
||||||
|
align-items: center;
|
||||||
|
overflow: hidden;
|
||||||
|
/* text-align: center; */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* #alertBox::before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: -50px;
|
||||||
|
right: -50px;
|
||||||
|
bottom: -50px;
|
||||||
|
left: -50px;
|
||||||
|
background-image: url('https://static-cdn.jtvnw.net/jtv_user_pictures/272e643e-4d43-415f-9ee1-18916e825411-profile_image-300x300.png');
|
||||||
|
background-color: rgba(0, 0, 0, 0.6);
|
||||||
|
background-size: cover;
|
||||||
|
background-position: center;
|
||||||
|
background-blend-mode: multiply;
|
||||||
|
filter: blur(25px);
|
||||||
|
z-index: -1;
|
||||||
|
} */
|
||||||
|
|
||||||
|
#avatar {
|
||||||
|
display: inline;
|
||||||
|
max-width: 100%;
|
||||||
|
height: 4em;
|
||||||
|
filter: drop-shadow(0px 0px 7px rgba(0, 0, 0, 0.5));
|
||||||
|
object-fit: cover;
|
||||||
|
margin-right: 0.75em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#contents {
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
#username {
|
||||||
|
font-size: 1.2em;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
#description {
|
||||||
|
font-size: 1em;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
|
||||||
|
#attribute {
|
||||||
|
font-size: 0.8em;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
|
||||||
|
.profilePic {
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.square {
|
||||||
|
border-radius: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*****************/
|
||||||
|
/** CARD COLORS **/
|
||||||
|
/*****************/
|
||||||
|
|
||||||
|
.announcementBlue {
|
||||||
|
background: linear-gradient(#03d3d7BF, #8d49feBF) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.announcementGreen {
|
||||||
|
background: linear-gradient(#01da86BF, #55bee4BF) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.announcementOrange {
|
||||||
|
background: linear-gradient(#feb419BF, #e1df00BF) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.announcementPurple {
|
||||||
|
background: linear-gradient(#9548ffBF, #fc74e6BF) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.twitch {
|
||||||
|
background: linear-gradient(#6d5ca1bf, #9146ffBF) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.youtube {
|
||||||
|
background: linear-gradient(#FF6C60BF, #FF0707BF) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.streamlabs {
|
||||||
|
background: linear-gradient(#73dabbbf, #397765bf) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.streamelements {
|
||||||
|
background: linear-gradient(#263b8abf, #0a112abf) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.patreon {
|
||||||
|
background: linear-gradient(#c76633bf, #fd5e0abf) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.kofi {
|
||||||
|
background: linear-gradient(#54c7eebf, #08c2ffbf) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tipeeeStream {
|
||||||
|
background: linear-gradient(#120e23bf, #5d192abf) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fourthwall {
|
||||||
|
background: linear-gradient(#466edbbf, #1c56f5bf) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.blank {
|
||||||
|
background: #adadad00 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.highlightMessage {
|
||||||
|
background: #adadad46;
|
||||||
|
}
|
||||||
|
|
||||||
|
/****************/
|
||||||
|
/** ANIMATIONS **/
|
||||||
|
/****************/
|
||||||
|
|
||||||
|
.statusConnected {
|
||||||
|
animation-name: statusConnected;
|
||||||
|
animation-duration: 2s;
|
||||||
|
animation-fill-mode: forwards;
|
||||||
|
}
|
||||||
|
|
||||||
|
.statusDisconnected {
|
||||||
|
animation-name: statusDisconnected;
|
||||||
|
animation-duration: 0.5s;
|
||||||
|
animation-fill-mode: forwards;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes statusConnected {
|
||||||
|
0% {
|
||||||
|
opacity: 1;
|
||||||
|
background-color: #2FB774;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
opacity: 0;
|
||||||
|
background-color: #2FB774;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes statusDisconnected {
|
||||||
|
0% {
|
||||||
|
background-color: #D12025;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
background-color: #D12025;
|
||||||
|
}
|
||||||
|
}
|
||||||