tanki theme
Experimentally Ill by doomersson
Details
Authordoomersson
LicenseMIT
Categorytankionline.com
Created
Updated
Size39 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
solo job, borrowed css
Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name Experimentally Ill
@namespace github.com/openstyles/stylus
@version 2024.10.28
@description Tanki Online Theme
@author Doomersson
@var color bg1 "Color 1" #00000087
@var color bg2 "Color 2" #8600008a
--bg1: ##00000087
--bg2: #8600008a
@var color tt "For Tanki Tweaks" #000000cf
--tt: #000000cf
==/UserStyle== */
@-moz-document domain("tankionline.com") {
.Common-container {
background-image: linear-gradient(var(--bg1) 0%, var(--bg2) 100%),url(https://tankionline.com/play/static/images/legendPlusBg.295a98bb.gif);
background-size: contain;
background-repeat: repeat;
background-attachment: fixed;
background-position: center;
}
.GearScoreStyle-bestGS {
background-image: linear-gradient(to left, rgb(40, 255, 203) 0%, rgb(255, 235, 51) 100%);
color: rgb(255, 235, 51);
animation: shine-loop 3s ease-in-out infinite;
background-size: 200% 100%;
}
@keyframes shine-loop {
0% {
background-position: 0% 0%;
}
50% {
background-position: 100% 0%;
}
100% {
background-position: 0% 0%;
}
}/*For Tanki Tweaks Battle Board*/
:is(.BattleTabStatisticComponentStyle-container>:first-child)>.tt-background {
background-color: var(--tt) !important;
}
.BattleMessagesComponentStyle-container {
align-items: start;
}
.BattleMessagesComponentStyle-message {
font-size: 1.2em;
background: linear-gradient(90deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 100%);
border-radius: 0px;
}
.MatchmakingWaitComponentStyle-container {
display: flex;
align-items: center;
justify-content: space-between;
background-color: #000000e3;
background-repeat: no-repeat;
background-size: contain;
background-position: center center;
position: absolute;
right: -1.2em;
top: -1.35em;
width: 34.25em;
height: 11em;
z-index: 100;
-webkit-box-align: center;
-webkit-box-pack: justify;
}.GarageCommonStyle-animatedBlurredLeftBlock, .GarageCommonStyle-animatedBlurredRightBlock {
backdrop-filter: blur(0em);
}
.BattleTabStatisticComponentStyle-containerInsideResults {
background-color: rgba(0, 0, 0, .76);
background-image: linear-gradient(#0000, rgb(0, 0, 0)),
url(https://tankionline.com/play/static/images/legendPlusBg.295a98bb.gif);
opacity: 0.88;
background-size: contain;
border-radius: 0em;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
box-shadow: rgba(255, 255, 255, 0.15) 0em 0em 1px;
position: relative;
max-height: 52.5em;
height: auto;
margin-top: -2.5em;
width: 56em;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-box-align: center;
-webkit-box-pack: start;
}
.BattleTabStatisticComponentStyle-selectedRowBackGround {
border-radius: 0.25em;
cursor: pointer;
background-color: #ff620038;
}
.BattleTabStatisticComponentStyle-rowBackGround {
border-radius: 0.25em;
cursor: pointer;
background-color: rgba(82, 6, 6, .19);
}
.ListItemsComponentStyle-itemsListContainer {
align-self: center;
display: flex;
align-items: center;
justify-content: flex-start;
bottom: 0px;
width: 100%;
position: relative;
height: auto;
background: linear-gradient(rgba(38, 0, 0, 0) 0%, #0000004d 100%);
z-index: 1;
-webkit-box-align: center;
-webkit-box-pack: start;
}
.LobbyLoaderComponentStyle-container {
position: absolute;
width: 100%;
height: 100%;
pointer-events: auto;
background: radial-gradient(50% 100% at 50% 100%, #000 0%, rgb(0 0 0) 100%);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
z-index: 999;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-box-align: center;
-webkit-box-pack: center;
}
.ContainersComponentStyle-leftPane {
/*containers left side*/
width: 30%;
height: 100%;
opacity: 0.75;
background: linear-gradient(90deg, rgb(0 0 0 / 0%) 10%, rgb(0 0 0 / 0%) 100%);
}
.BattleTabStatisticComponentStyle-containerInsideTeams {
background-color: rgba(0, 0, 0, .76);
/* background-image: linear-gradient(#0000006e, rgba(0, 0, 0, .17)), url(https://tankionline.com/play/static/images/sparks.990b5664.webp); */
opacity: 0.88;
border-radius: 0em;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
box-shadow: rgba(255, 255, 255, 0.15) 0em 0em 1px;
position: relative;
max-height: 52.5em;
height: auto;
margin-top: -2.5em;
width: 97em;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-box-align: center;
-webkit-box-pack: start;
}
.BattleTabStatisticComponentStyle-commonBlock, .BattleTabStatisticComponentStyle-blueTeamTableContainer table tbody tr td:nth-child(n+3), .BattleTabStatisticComponentStyle-redTeamTableContainer table tbody tr td:nth-child(n+3) {
visibility: visible !important;
}
.BattleTabStatisticComponentStyle-blueTeamTableContainer table tbody tr {
display: flex;
align-items: center;
height: 2.5em;
margin-top: 0.313em;
width: 47.125em;
-webkit-box-align: center;
}
.BattleTabStatisticComponentStyle-redTeamTableContainer table tbody tr {
display: flex;
align-items: center;
height: 2.5em;
margin-top: 0.313em;
width: 47.125em;
-webkit-box-align: center;
}
.BattleTabStatisticComponentStyle-blueTeamTableContainer table thead {
display: flex;
width: 100%;
height: 2.5em;
opacity: 1;
position: absolute;
text-align: left;
top: -50.75em;
}
.BattleTabStatisticComponentStyle-redTeamTableContainer table thead {
display: flex;
width: 100%;
height: 2.5em;
opacity: 1;
position: absolute;
text-align: left;
top: -50.75em;
}
.BattleTabStatisticComponentStyle-blueTeamTableContainer table tbody {
--row-background-color: rgba(170, 170, 170, .16);
--selected-row-background-color: #ff620038;
}
.BattleTabStatisticComponentStyle-redTeamTableContainer table tbody {
--row-background-color: rgba(66, 65, 65, .18);
--selected-row-background-color: rgb(0, 0, 0);
}
.BattlePassLobbyComponentStyle-menuBattlePass {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
width: 22.5em;
height: 10em;
position: absolute;
margin-top: 8.5em;
background: linear-gradient(0deg, #000 0%, rgb(0 0 0) 100%);
right: 2.5em;
z-index: 1;
cursor: pointer;
border-radius: 0em;
filter: drop-shadow(#191919 0px 4px 4px);
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-box-align: start;
-webkit-box-pack: start;
transition: all 0.2s ease-in-out 0s;
}
.PrimaryMenuItemComponentStyle-itemCommonLi:hover {
box-shadow: #ffffff38 0em 0em 0em 0.125em;
border-radius: 0em;
}
.PrimaryMenuItemComponentStyle-itemCommonLi {
border: 0px solid;
overflow: hidden;
position: relative;
span {
z-index: 20;
}
&:after {
background: #fff;
content: "";
height: 155px;
left: -75px;
opacity: .2;
position: absolute;
top: -50px;
transform: rotate(35deg);
transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
width: 50px;
z-index: -10;
}
}
.PrimaryMenuItemComponentStyle-itemCommonLi:hover {
&:after {
left: 120%;
transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
}
}
.MainScreenComponentStyle-buttonPlay {
backdrop-filter: blur(0.1em);
background-color: rgba(0, 0, 0, .67);
background-image: url("null");
background-size: cover;
background-repeat: no-repeat;
width: 23em;
height: 11em;
}
.MainScreenComponentStyle-playButtonContainer:hover {
box-shadow: rgb(0,
0,
0) 0em 0em 1em 5px;
border: 0px none transparent;
}
.FooterComponentStyle-containerMenu {
border: 0px solid;
overflow: hidden;
position: relative;
span {
z-index: 20;
}
&:after {
background: #fff;
content: "";
height: 150px;
left: -75px;
opacity: .2;
position: absolute;
top: -50px;
transform: rotate(35deg);
transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
width: 30px;
z-index: -10;
}
}
.FooterComponentStyle-containerMenu:hover {
border-radius: 0em;
box-shadow: #ffffff33 0em 0em 0em 0.125em;
&:after {
left: 150%;
transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
}
}
.FooterComponentStyle-marginEllips {
width: 1.875em;
height: 1.875em;
align-self: flex-start;
position: absolute;
right: 0em;
top: 0em;
margin-left: 0px;
}
.ScrollingCardsComponentStyle-scrollCard {
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
box-shadow: #2f2f2f 0em 0em 0.3em 1px;
background-color: rgba(255,
255,
255,
0.2);
border-radius: 0em;
height: 100%;
margin-right: 1em;
min-width: 22.5em;
position: relative;
z-index: 4;
overflow: hidden;
cursor: pointer;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-box-align: center;
-webkit-box-pack: start;
transition: all 0.2s ease-in-out 0s;
}
.BattlePickComponentStyle-cardImg.Common-backgroundImageCover {
border-radius: 0em;
padding: 0em;
background-position: center;
background-size: cover;
}
.UserProgressComponentStyle-modalWrapper {
background: radial-gradient(50% 100% at 50% 100%,
#202020 0%,
rgb(0 0 0) 100%);
width: 100%;
min-height: 28.125em;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
padding-top: 3.75em;
padding-bottom: 3.75em;
-webkit-box-orient...