Changes BG and Text Font/Color Of NT Races.
11/5/2022, 9:09:29 PM by vumpire
Details
Authorvumpire
Licensehttps://www.nitrotype.com/racer/astralabyss
Categoryhttps://www.nitrotype.com
Created
Updated
Size5.8 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
I'm just going to use this to guide you through how to change the background/text.
TEXT: Change the color on line 17 by pressing the color it is currently set to, then change to your preferred color.
FONT: Change the font name on line 11 (refer to https://www.fonts.google.com to get fonts for it). Then, change the "Helvetica" text on Line 9.
EXAMPLE:
https://fonts.googleapis.com/css?family=Helvetica&display=swap
https://fonts.googleapis.com/css?family=Overpass&display=swap
So you basically change "Helvetica" to any font you want. If you do not do both of these steps, the font will not work.
BG: Find your background, then copy it and replace it with the URL on line 86. I'd also recommend you change the color at the end.
MIND THESE ARE JUST THE BASIC THINGS, IF YOU WANT TO CHANGE OTHER THINGS, FEEL FREE TO EXPERIMENT! YOU CAN ALWAYS UNDO IT!
Source code
/* ==UserStyle==
@name 11/5/2022, 9:09:29 PM
@namespace github.com/openstyles/stylus
@version 1.0.0
@description A new userstyle
@author https://www.nitrotype.com/racer/astralabyss
==/UserStyle== */
@import url('https://fonts.googleapis.com/css?family=Helvetica&display=swap');
.dash-letter {
font-family: 'Helvetica', monospace;
padding: 4px 1.66px !important;
/*
change to 5px if you're using multi-line
*/
font-weight: 777;
color: #0008ff;
}
span.dash-letter.is-waiting {
border-radius: 0.1px!important;
background: #000;
}
span.dash-letter.is-incorrect {
border-radius: 0.1px !important;
background: #000;
}
div.dash-copyContainer {
background: rgb(0, 0, 0);
box-shadow: 0px 0px 25px rgb(0, 0, 0);
border-radius: 30px;
}
.rv-xy-plot__grid-lines {
color: red;
background: red;
background-color: red;
fill: red;
}
#chart-gradient {
color: red !important;
}
.chart--a .chart-gradient .chart-gradient1 {
stop-color: #f00;
stop-opacity: 0.6;
}
.chart--a .chart-gradient .chart-gradient2 {
stop-color: #48d7a5;
stop-opacity: 0.3;
}
.chart--a .chart-gradient .chart-gradient3 {
stop-color: #000;
stop-opacity: 0.5;
}
.chart--a .chart-line {
stroke: rgb(0, 0, 0, 0) !important;
stroke-width: 2 !important;
}
.chart--a .chart-line circle {
fill: #000 !important;
stroke-width: 0 !important;
stroke: #fff !important;
display: none;
}
@-moz-document domain("nitrotype.com") {
.dash-copyContainer {
background: #000;
/* Background of text box */
}
.dash-copy {
color: #000;
font-family: "Roboto Mono", "Courier New", Courier, "Lucida Sans Typewriter", "Lucida Typewriter", monospace;
font-size: 50px;
/* Main Color of Text + Font */
}
.dash-letter.is-typed {
opacity: 0;
/*Letters disappear after being typed*/
}
.dash-letter.is-correct {
color: #000;
font-size: 17px;
-webkit-animation: colorchange 10s infinite alternate;
}
/* Moving Text Colorchange */
@-webkit-keyframes colorchange {
0% {
color: #5B5B5A;
}
10% {
color: #454545;
}
20% {
color: #2D2D2C;
}
30% {
color: #161616;
}
40% {
color: #000;
}
50% {
color: #000;
}
60% {
color: #000;
}
70% {
color: #000;
}
80% {
color: #000;
}
90% {
color: #000;
}
100% {
color: #000;
}
}
body {
background: none;
}
html {
background: fixed url("https://i.pinimg.com/originals/56/c7/1e/56c71e324e34d105f9d6a272db3be48a.jpg"), #003a8a;
background-size: 100%;
}
.bg--gradient {
background: fixed;
}
.theme--pDefault .profile-bg {
background: url("https://i.redd.it/zt67hqgr70741.jpg") top left repeat, linear-gradient(0deg, #2d2e2e 60%, #ffffff 100%);
color: #d3d3d3;
background-size: 100%
}
.theme--pDefault .profile-bgHead {
background: url("https://i.redd.it/zt67hqgr70741.jpg") top left repeat, linear-gradient(0deg, #2d2e2e 10%, #ffffff 100%);
background-size: 100%
}
.theme--pDefault.is-gold .profile-bg {
background: url("https://i.redd.it/zt67hqgr70741.jpg") top left repeat, linear-gradient(0deg, #2d2e2e 10%, #ffffff 100%);
background-size: 100%
}
.card--a {
background-color: #fff0;
color: #ffffff;
}
.card--shadow-l {
box-shadow: none;
}
.theme--pDefault .profile-levelNum {
color: #ffffff;
text-shadow: 0 2px 2px rgba(2, 2, 2, 0.25);
}
.news--solo .news-body p {
color: #ffffff;
line-height: 1.8;
}
.news-teaser {
color: #ffffff;
margin-bottom: 40px;
}
.card--a {
color: #ffffff;
background: transparent;
}
.card--shadow-l {
box-shadow: none;
}
.btn--inky {
color: #fff;
}
.card--b {
color: #fff;
}
.theme--pDefault .profile-body {
color: #ffffff;
}
.card--grit {
background: none;
}
.dash-copyContainer {
background: #000;
box-shadow: 0 1px 157px 10px rgba(0, 0, 0, 0.78);
}
.dash-copy {
color: #5b5b5a;
font-size: 17px;
}
.btn--primary {
background-image: url("https://upload.wikimedia.org/wikipedia/commons/thumb/7/70/Solid_white.svg/2048px-Solid_white.svg.png");
color: #fff;
background-size: 100%;
background-color: #000 !important;
}
.btn--secondary {
background-image: url("https://upload.wikimedia.org/wikipedia/commons/thumb/7/70/Solid_white.svg/2048px-Solid_white.svg.png");
color: #fff;
background-size: 100%;
background-color: #000 !important;
}
.growl--a {
background-image: url("https://i.redd.it/zt67hqgr70741.jpg");
border-color: rgba(2, 2, 2, 0.2);
background-size: 100%;
color: #fff;
}
.card--grit {
background: none;
}
.table--b .table-cell {
border-bottom: none;
}
.tc-ts {
color: #fff;
}
.card--b {
color: #fff;
}
.tc-emerald {
color: #00ff6c;
}
.tc-i {
color: #fff;
}
.tc-dodger {
color: #ffb5e8;
}
.tc-lemon {
color: #ffcb00;
}
.news--solo .news-body p {
color: #fff;
}
.news--solo .news-body .yellow {
color: #a28100;
}
.link--nav {
color: #000000ba;
}
.link--nav.is-current {
color: #000;
}
.link--nav:hover {
color: #000;
}
.bg--gradient {
background: #00000000;
}
path:nth-child(2) {
fill: #131313;
}
path:nth-child(3) {
fill: #2C2C2C;
}
path:nth-child(4) {
fill: #5A5A5A;
}
path:nth-child(5) {
fill: #8D8D8D;
}
path:nth-child(6) {
fill: #BCBCBC;
}
path:nth-child(8) {
fill: #E8E8E8;
}
.tc-t {
color: #fff;
}
.theme--pDefault .profile-body {
color: #fff;
}
.tsi {
color: #fff
}
.theme--pDefault .profile-levelNum {
color: #fff
}
.btn--primary {
color: #000
}
.has-btn:not(.has-btn--vertical) .btn:last-child {
color: #000
}
.nav-list {
background: #000;
}
}