gamepop

game customization script for gpop.io

目前為 2022-12-28 提交的版本,檢視 最新版本

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name         gamepop 
// @namespace    http://tampermonkey.net/
// @version      1.6.1
// @description  game customization script for gpop.io
// @author       osuGamer93843
// @match        https://gpop.io/play/*
// @match        https://gpop.io/create/
// @match        https://gpop.io/room/*
// @match        https://gpop.io/
// @require      https://code.jquery.com/jquery-3.6.0.js
// @icon         https://www.google.com/s2/favicons?domain=gpop.io
// @require      https://openuserjs.org/src/libs/sizzle/GM_config.js
// @grant        GM_addStyle
// @grant        GM_getValue
// @grant        GM_setValue
// @run-at       document-start
// ==/UserScript==


//dim
let darken = new GM_configStruct(
    {
        'events':
        {
            'open': function()
            {
                $("#darken").contents().find("#darken").css("background","rgba(0,0,0,0.5)");
                $("#darken").css("max-height","999%");
                $("#darken").css("max-width","999%");
                $("#darken").css("height","999%");
                $("#darken").css("width","999%");
                $("#darken").css("inset","0");
                $("#darken").css("z-index","9998");
            },
        },
        'id': 'darken',
        'fields':
        {
            'nothing':
            {
                'label': '',
                'type': 'hidden',
                'default': ''
            }
        }

    });

//settings menu
GM_config.init({
    'events':
    {
        'open': function()
        {
            $("#darken").show();
            //css
            {$("#MyConfig").contents().find('head > style').replaceWith(`<style type="text/css">
             #MyConfig * @font-face {
	font-family: redalert1;
	src: url(https://gpop.io/fonts/redalert1.ttf) format("truetype");
}

::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background: rgba(0,0,0,0);
}
::-webkit-scrollbar-thumb {
  background: rgba(72, 67, 86, 1);
  border-radius: 10px
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(72, 67, 86, 0.9);
}

#MyConfig {
	font-family: Arial
	background: #FFF;
}

#MyConfig input[type='radio'] {
	margin-right: 8px;
}

#MyConfig .indent40 {
	margin-left: 40%;
}

#MyConfig .field_label {
	font-family: Arial;
	color: rgb(192,192,192);
	font-size: 12px;
	font-weight: bold;
	margin-right: 6px;
}

#MyConfig .radio_label {
	font-size: 12px;
}

#MyConfig .block {
	display: block;
}

#MyConfig .saveclose_buttons {
	color: #fff;
	background: rgba(255, 255, 255, 0.2);
	border: 0;
	border-bottom: 3px solid rgba(255, 255, 255, 0.3);
	font-size: 17px;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	/* letter-spacing: 2px; */
	letter-spacing: 1px;
	cursor: pointer;
    border-radius: 2px;
	background-clip: padding-box !important;
}

#MyConfig .reset,
#MyConfig .reset a,
#MyConfig_buttons_holder {
	color: #000;
	text-align: center;
}

#MyConfig .config_header {
	font-size: 20pt;
	margin: 0;
}

#MyConfig .config_desc,
#MyConfig .section_desc,
#MyConfig .reset {
	font-size: 9pt;
}

#MyConfig .center {
	text-align: center;
}

#MyConfig .section_header_holder {
	margin-top: 8px;
}

#MyConfig .config_var {
	margin: 0 0 4px;
}

#MyConfig .section_header {
	background: #414141;
	border: 1px solid #000;
	color: #FFF;
	font-size: 13pt;
	margin: 0;
}

#MyConfig .section_desc {
	background: #EFEFEF;
	border: 1px solid #CCC;
	color: #575757;
	font-size: 9pt;
	margin: 0 0 6px;
}
#MyConfig .rainbowbg {
  background-color: rgb(0, 0, 0);
  /* Fallback color */
  background-color: rgba(0, 0, 0, 0.2);
  /* Black w/opacity/see-through */
  border: 3px solid;
}

#MyConfig .rainbow {
  text-align: center;
  font-size: 20px;
  font-family: monospace;
  animation: colorRotate 4.5s linear 0s infinite;
}

@keyframes colorRotate {
  from {
    color: #6666ff;
  }
  10% {
    color: #0099ff;
  }
  50% {
    color: #00ff00;
  }
  75% {
    color: #ff3399;
  }
  100% {
    color: #6666ff;
  }
}

iframe#MyConfig {
  --angle: 0deg;
  width: 1vmin;
  height: 1vmin;
  border: 2px solid;
  border-image: conic-gradient(from var(--angle), red, yellow, lime, aqua, blue, magenta, red) 1;

  animation: 100s rotate linear infinite;
}

@keyframes rotate {
  to {
    --angle: 360deg;
  }
}

@property --angle {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}

.dimmer {
  /* display: none; */
  background: #000;
  opacity: 0.5;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
}

input:not([type]), input[type="text"] {
  width: 90px;
  border: solid 1px rgb(72 67 86);
  border-radius: 2px;
  background-color: rgb(72 67 86);
  color: rgb(190,200,185);
  text-align: center;
}

             </style>`);
            }
            $("#MyConfig").contents().find("#MyConfig_saveBtn").attr('onClick', 'window.top.location.reload()');
            $("#MyConfig").contents().find("#MyConfig_wrapper").css("margin","30");
            $("#MyConfig").contents().find("#MyConfig_buttons_holder").css("position","relative");
            $("#MyConfig").contents().find("#MyConfig_buttons_holder").css("bottom","-30");
            $("#MyConfig").contents().find("#MyConfig_closeBtn").css("margin","3");
            $("#MyConfig").contents().find("html").css("overflow","overlay");
            $("#MyConfig").contents().find("#MyConfig_resetLink").attr("style","border: rgba(255, 255, 255, 0.2);border-radius: 2px;background-color: #46454a;text-decoration: none;color: rgb(248 255 253 / 81%);font-family: Arial;border-bottom: 3px solid rgba(255, 255, 255, 0.3);text-align: center;padding: 1px 3px;");

            $("#MyConfig").contents().find("#MyConfig_field_note-a-color").css("width","90px");
            $("#MyConfig").contents().find("#MyConfig_field_note-s-color").css("width","90px");
            $("#MyConfig").contents().find("#MyConfig_field_note-d-color").css("width","90px");
            $("#MyConfig").contents().find("#MyConfig_field_note-f-color").css("width","90px");

            $("#MyConfig").contents().find("#MyConfig_note-transparency_var").css("margin-right","6.5px");
            $("#MyConfig").contents().find("#MyConfig_field_circle").attr('style','max-width: 30%; background-color: rgb(72 67 86);border: solid 2px rgb(72 67 86);border-radius: 5px;color: rgb(253 262 231);');
            /*
            $("#MyConfig").contents().find("#MyConfig_borderToggle_var").css("margin-left", "-23px");
            $("#MyConfig").contents().find("#MyConfig_edge_var").css("margin-left", "-16px");
            $("#MyConfig").contents().find("#MyConfig_hideLines_var").css("margin-left", "-32px");
         */
            $("#MyConfig").contents().find("#MyConfig_fpsInfoLabel_field_label").css("color", "#767676");
            $("#MyConfig").contents().find("#MyConfig_fpsInfoLabel_field_label").css("font-size", "9px");

            $("#MyConfig").contents().find("#MyConfig_FirstInfoLabel0_field_label").css("color", "#767676");
            $("#MyConfig").contents().find("#MyConfig_FirstInfoLabel0_field_label").css("font-size", "9px");

            $("#MyConfig").contents().find("#MyConfig_FirstInfoLabel_field_label").css("color", "#767676");
            $("#MyConfig").contents().find("#MyConfig_FirstInfoLabel_field_label").css("font-size", "9px");

            $("#MyConfig").contents().find("#MyConfig_FirstInfoLabel2_field_label").css("color", "#767676");
            $("#MyConfig").contents().find("#MyConfig_FirstInfoLabel2_field_label").css("font-size", "9px");

            $("#MyConfig").contents().find("#MyConfig_RdIntInfoLabel_field_label").css("color", "#767676");
            $("#MyConfig").contents().find("#MyConfig_RdIntInfoLabel_field_label").css("font-size", "9px");

            $("#MyConfig").contents().find("#MyConfig").css("background","rgb(24,22,29)");
            $("#MyConfig").contents().find("#MyConfig").css("text-align", "center");
            $("#MyConfig").contents().find("#MyConfig").css("margin-bottom","40px");

            GM_config.frame.setAttribute('style','left: 40.6%;top: 10%;font-family:monospace;height: 80%;margin: 0px;max-height: 95%;max-width: 95%;opacity: 1;position: fixed;width: 21%;z-index: 9999;display: block;border: solid 6px #18161d;border-radius: 10px;');
            GM_config.frame.setAttribute('class','rainbow-border');

        },
        'close': function()
        {
            $("#darken").hide();
        },
    },
    'id': 'MyConfig',
    'title': ' ',
    'fields':
    {
        'spacing21a':
        {
            'label': '<p class="rainbow rainbowbg"> Settings </p> ',
            'type': 'hidden',
            'options': ['b','a'],
            'default': 'a'
        },
        'spacing1a':
        {
            'label': '<p style="text-align:center;color:gray;"> </p> ',
            'type': 'hidden',
            'options': ['b','a'],
            'default': 'a'
        },
        /*
             'hitsound':
            {
                'label': 'Hitsounds:',
                'type': 'checkbox',
                'default': true
            },
            */
        'noteHeight':
        {
            'label': 'Note Height',
            'type': 'float',
            'default': '29.4'
        },
        'noteWidth':
        {
            'label': 'Note Width',
            'type': 'float',
            'default': '25.98'
        },
        'noteRadius':
        {
            'label': 'Note Radius',
            'type': 'float',
            'default': '30'
        },
        'centerpx':
        {
            'label': 'Playfield vertical position',
            'type': 'float',
            'default': '0'
        },
        'FirstInfoLabel0':
        {
            'label': 'negative = right, positive = left, only change if your notes are not centered.',
            'type': 'hidden',
            'options': ['b','a'],
            'default': 'a'
        },
        'FirstInfoLabel':
        {
            'label': '[!] Use periods (.) as decimal points, not commas (,). ',
            'type': 'hidden',
            'options': ['b','a'],
            'default': 'a'
        },
        'spacetoggle':
        {
            'label': 'Hide UI on level start',
            'type': 'checkbox',
            'default': true
        },
        'defaultPpSquare':
        {
            'label': 'Default receptor size',
            'type': 'checkbox',
            'default': true
        },
        'FirstInfoLabel2':
        {
            'label': 'On is recommended if not you are not changing note height/width/radius',
            'type': 'hidden',
            'options': ['b','a'],
            'default': 'a'
        },
        'hideLines':
        {
            'label': 'Hide lines',
            'type': 'checkbox',
            'default': true
        },
        'notehitdisappear':
        {
            'label': 'Notes disappear on hit',
            'type': 'checkbox',
            'default': true
        },
        'staticReceptor':
        {
            'label': 'Static Receptor',
            'type': 'checkbox',
            'default': false
        },
        'fadeInLn':
        {
            'label': 'Fade In LN',
            'type': 'checkbox',
            'default': false
        },
        'noStreakTxt':
        {
            'label': 'Remove streak text',
            'type': 'checkbox',
            'default': false
        },
        'spacing1':
        {
            'label': ' &#8205; ',
            'type': 'hidden',
            'options': ['b','a'],
            'default': 'a'
        },
        'spacing2':
        {
            'label': '<p class="rainbow rainbowbg"> Note Colors </p> ',
            'type': 'hidden',
            'options': ['b','a'],
            'default': 'a'
        },
        'spacing3':
        {
            'label': `
                         <div style="text-align:center">Color picker: <input type="color" id="colorpicker" value="#0000ff" style="background-color: rgba(0,0,0,0);border: none;width: 40px;margin: 0;height: 27px;padding: 6px;"></div>
                         `,
            'type': 'hidden',
            'options': ['b','a'],
            'default': 'a'
        },
        'note-a-color':
        {
            'label': 'Note 1',
            'type': 'Text',
            'default': '255, 114, 114'
        },
        'note-s-color':
        {
            'label': 'Note 2',
            'type': 'Text',
            'default': '68, 240, 255'
        },
        'note-d-color':
        {
            'label': 'Note 3',
            'type': 'Text',
            'default': '90, 255, 98'
        },
        'note-f-color':
        {
            'label': 'Note 4',
            'type': 'Text',
            'default': '255, 247, 68'
        },
        'note-transparency':
        {
            'label': 'Opacity',
            'type': 'text',
            'default': '20'
        },
        'spacing1c':
        {
            'label': ' &#8205; ',
            'type': 'hidden',
            'options': ['b','a'],
            'default': 'a'
        },
        'spacing2c':
        {
            'label': '<p class="rainbow rainbowbg"> Tokyo Settings </p> ',
            'type': 'hidden',
            'options': ['b','a'],
            'default': 'a'
        },
        'tokyo2d':
        {
            'label': '2D mode',
            'type': 'checkbox',
            'default': false
        },
        'tokyoHideLines':
        {
            'label': 'Hide Lines',
            'type': 'checkbox',
            'default': false
        },
        'tokyoUpscroll':
        {
            'label': 'Upscroll',
            'type': 'checkbox',
            'default': false
        },
        'spacing1d':
        {
            'label': ' &#8205; ',
            'type': 'hidden',
            'options': ['b','a'],
            'default': 'a'
        },
        'spacing2d':
        {
            'label': '<p class="rainbow rainbowbg"> Experimental settings </p> ',
            'type': 'hidden',
            'options': ['b','a'],
            'default': 'a'
        },
        'zoom':
        {
            'label': 'Playfield zoom ',
            'type': 'int',
            'default': '100'
        },
        'fpsInfoLabel':
        {
            'label': 'Needs "Hide UI on level start" on',
            'type': 'hidden',
            'options': ['b','a'],
            'default': 'a'
        },
        'fps':
        {
            'label': '240 fps cap',
            'type': 'checkbox',
            'default': false
        },
        'visualOffset':
        {
            'label': 'Visual Offset',
            'type': 'float',
            'default': '0'
        },
        'RdIntInfoLabel':
        {
            'label': 'Changes where the notes are seen in the screen (default 0 recommended).\n Values are in percent (0 = 0%). Negative (0<) = early, positive (>0) = late.',
            'type': 'hidden',
            'options': ['b','a'],
            'default': 'a'
        },
    }
});
let url = window.location.href;

window.addEventListener('load', function() {

    //MAP INFO
    $(".playpage-a12-block-c").empty()
    $(".playpage-a12-block-c").css({"background": "rgba(255,255,255, 0.1)", "border-radius": "3px", "padding": "10px", "border-color": "gray", "opacity":"1"})
    $('<button class="gbutton" id="mapinfobutton" style="height: 28px;font-family:redalert1;left: 0%;position:relative;font-size:16px;/* margin-top: -3; */line-height: 26px;margin: 10px;">Show map info</button>').appendTo(".playpage-a12-block-c").click(function() {

        let startTime = Date.now() / 1000

        let serverData = $("script:eq(3)").text()
        let notedata = (serverData.split("}},")[1]).split("],")[0]
        let notes = notedata.split(',')

        let streak = 0
        let score = 0

        let LN = [1,3,5,7]
        let N = [0,2,4,6]

        let LNamount = 0
        let Namount = 0

        console.log(notes)
        for (let i = 0; i<notes.length; i++)
        {
            let note = notes[i] * 1

            if (N.includes(note)) {

                let multiplier = 1.005**streak
                if (multiplier>3000) { multiplier=3000 }

                score += 10*multiplier

                streak++
                Namount++

            }

            if (LN.includes(note)) {

                let multiplier = 1.005**streak
                if (multiplier>3000) { multiplier=3000 }

                let noteLength = notes[i+2] * 1
                let LNscore = (noteLength*40)
                LNscore = LNscore*multiplier

                streak++
                score += (10*multiplier)+(LNscore)

                LNamount++
            }
        }

        let totalTime = ((Date.now() / 1000)-startTime).toFixed(3)

        // console.log(`Total notes: ${Namount+LNamount}\nNs: ${Namount}\nLNs: ${LNamount}\nMax score: ${score.toFixed(2)}\nTime: ${totalTime}`)

        $(".playpage-a12-block-c").append(`
        <p class="mapinfoc">Total notes: ${Namount+LNamount}
        <br>Notes: ${Namount}
        <br>Long notes: ${LNamount}
        <br>Max score: ${score.toFixed(2)}
        </p>
        <p class="smallinfo">time: ${totalTime}</p>
       `)

        $("#mapinfobutton").hide()

    });

    $("#topbar-discord").removeAttr('href');
    $("#topbar").attr("style","background: rgba(11,11,11,0.9);");

    //random stuff
    if (url == 'https://gpop.io/create/')
    {
        $('<div class="gamespeed-choice">2.5x</div>').appendTo('.createpage-left-gamespeed');
    }
    if (url == 'https://gpop.io/') {
        $(".topbar2-c").attr("style","background: rgba(11,11,11,0.9); border-radius: 0px 0px 10px 10px;");
        $("#topbar").attr("style","background: rgba(11,11,11,0.9);");
        $(".menu-levels-container").attr("style","background: rgba(11,11,11,0.9); border-radius: 10px;");

    }
    //GUI button
    if (url != 'https://gpop.io/')
    {
        $('<button id = "scriptGUI" class="gbutton" style="height: 28px;font-family:redalert1;left: 0%;position:relative;font-size:16px;/* margin-top: -3; */line-height: 26px;margin: 12px 5px 0;">Settings</button>').appendTo(".topbar").click(function() {
            GM_config.open();
            darken.open();

        });
    }
    if (url != 'https://gpop.io/create/') {
        console.log(url)
        if (GM_config.get('spacetoggle') == true) {
            function a(){
                try {
                    this.window.scrollTo(0, screen.height/2.5);
                    if ($( ".pp-container" ).hasClass("pp-showoverlay" ) == false) {
                        $('.pp-container').attr("style", "z-index: 2; background:rgba(0,0,0,0.0)");
                        $('#main > div > div').hide();
                        $('.pp-info').hide();
                        $(".playpage-nolag").attr("style","zoom:"+GM_config.get('zoom')+"%");
                        if (GM_config.get('zoom') != 100) {$(".pp-streak").attr("style","top: 20%; position: fixed; opacity: 1; font-size: 15px; font-family: cursive;")};
                        $("#main").attr("style","top:-"+GM_config.get('notepos')+"%");
                        $("#topbar").hide();
                        //TODO: ADD ACC ON TOP LEFT OF SCREEN, ADD SMALL STREAK COUNTER ON TOP LEFT. $(".pp-score2").css({"position": "fixed", "margin-top": "70%", "margin-left":"270%"})

                    }
                    else if ($( ".pp-container" ).hasClass( "pp-showoverlay" ) == true)
                    {
                        $('.pp-container').attr("style", "z-index: 2; background:rgba(11,11,11,0.6))");
                        $('#main > div > div').show();
                        $('.pp-info').show();
                        $("body").attr("style","zoom:100%");
                        $("#main").attr("style","top:0%");
                        $("#topbar").show();
                    } } catch (p) {};
            }
            setInterval((function()
                         {a();}),100);
        }
    }
});

if (url != 'https://gpop.io/create/' && url != 'https://gpop.io/') {
    let hide_line = '';
    let pp_square_style = '';
    let notehitdisappear = '';
    let staticReceptor = '';
    let nocombotext = '';
    let fadeInLn = '';
    let a_rgb = GM_config.get('note-a-color');
    let s_rgb = GM_config.get('note-s-color');
    let d_rgb = GM_config.get('note-d-color');
    let f_rgb = GM_config.get('note-f-color');
    let opacity = GM_config.get('note-transparency')/100;
    let width = GM_config.get('noteWidth');
    let height = GM_config.get('noteHeight');
    let radius = GM_config.get('noteRadius');
    let offset = GM_config.get('visualOffset');
    let centernotes = GM_config.get('centerpx');
    let playfieldscale = GM_config.get('zoom');



    if (!(GM_config.get('defaultPpSquare'))) { pp_square_style = `
    width:  ${width} !important;
    border-radius: ${radius} !important;
    height: ${height} !important;
    `}
    if (GM_config.get('hideLines')) { hide_line = "display: none !important;" };
    if (GM_config.get('notehitdisappear')) { notehitdisappear = 'display: none !important' }
    if (GM_config.get('staticReceptor')) {staticReceptor = `
.pp-lane-click .pp-square {
    transform: scale(1) !important;
    opacity: 0.4 !important;
}`}
    if (GM_config.get('noStreakTxt')) {nocombotext = `
.pp-streak:not(:empty):before {
    content: "" !important;
}
`}
    if (GM_config.get('fadeInLn')) {fadeInLn = `
.pp-noteextended {background:linear-gradient(black, transparent);}
.createpage-left .ppnolag .pp-noteextended-hitting {background:linear-gradient(0deg, rgba(243, 165, 255, 0.2), transparent) !important}
`}

    GM_addStyle ( `
    .playpage-nolag {zoom: 100% !important}
    ${nocombotext}

    /*.playpage-nolag {
    zoom: ${playfieldscale}% !important;
    }*/
    ${staticReceptor}

    .pp-note-hit { ${notehitdisappear} }

    /*background*/

    .pp-notes-container {
    z-index: -1 !important;
    background-color: black !important;
    border: 1px solid #3e3e3e !important;
    border-radius: 10px !important;
    top: ${offset} !important;
    left: ${centernotes}px !important;
    }

    #topbar { z-index: 3 }
    .pp-container {z-index: 2;}

    .pp-square {
    ${pp_square_style}
    }

    .pp-line { ${hide_line} }

    .pp-note {
    min-height: 0px !important;
    left: 8.73px !important;}

    .pp-note-a {
    background-color:  rgba(${a_rgb}, ${opacity}) !important;
    width:  ${width} !important;
    border-radius: ${radius}px !important;
    border: 0px !important;
    font-size: 0px !important;
    }

    .pp-note-s {
    background-color:  rgba(${s_rgb}, ${opacity}) !important;
    width:  ${width} !important;
    border-radius: ${radius}px !important;
    border: 0px !important;
    font-size: 0px !important;
    }

    .pp-note-d {
    background-color:  rgba(${d_rgb}, ${opacity}) !important;
    width:  ${width} !important;
    border-radius: ${radius}px !important;
    border: 0px !important;
    font-size: 0px !important;
    }

    .pp-note-f {
    background-color:  rgba(${f_rgb}, ${opacity}) !important;
    width:  ${width} !important;
    border-radius: ${radius}px !important;
    border: 0px !important;
    font-size: 0px !important;
    }

    /* LNs */
    pp-noteextended-hitting {
   animation: x !important;
   background:  x !important;
}
    .pp-noteextended:before { display:none !important }
    ${fadeInLn}

    .pp-note-a:not(.pp-noteextended) {
    height: ${height} !important;
    }
    .pp-note-s:not(.pp-noteextended) {
    height: ${height} !important;
    }
    .pp-note-d:not(.pp-noteextended) {
    height: ${height} !important;
    }
    .pp-note-f:not(.pp-noteextended) {
    height: ${height} !important;
    }
    /* Map info */
    .mapinfoc {
    letter-spacing: 0.3px;
    border-radius: 5px;
    background-color: #1a1a1aba;
    font-family: Arial;
    color: rgb(192,192,192);
    font-size: 12px;
    font-weight: bold;
    margin-right: 6px;
    padding: 5px;
    }
    .smallinfo {
    color: #767676;
    font-size: 13px;
    }
` );
}