Skip to content

Better SYZOJ by NINLER-5460

Write a review Install Get Stylus

Details

AuthorNINLER-5460

LicenseNo License

Categoryninler.userstyles.world -> Better SYZOJ

Created

Updated

Size14 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

A dark theme for websites that powered by SYZOJ.

Notes

Userstyle doesn't have notes.

Source code

Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link. 
/* ==UserStyle==
@name         Better SYZOJ
@version      20240915.06.11
@namespace    userstyles.world/user/NINLER-5460
@description  A dark theme for websites that powered by SYZOJ.
@author       NINLER-5460
@license      No License
==/UserStyle== */

/* ==UserStyle==
@name         Better SYZOJ
@namespace      ninler.userstyle.world
@version       1.0.1
==/UserStyle== */

@-moz-document regexp("http://ssloj.cn/.*"), regexp("http://.*ybtoj.com.cn/.*"), regexp("https://mna.wang/.*") {
/* Tempermonkey part */
/*
    This part ia an additional part.
    It's fit for the tempermonkey code.
    You can install it on "https://ninler.github.io/OJoptimize/index.html" .
*/

.copyTextUp {
    border-top-left-radius: 3pt;
    border-top-right-radius: 3pt;
    background-color: #3a3a3a;
    height: 25pt;
    width: 100%;
    font-size: 1rem;
}

.copyTextUp > p {
    padding-top: calc( 10pt - 0.5rem );
    padding-left: 10pt;
}

.copyTextDown {
    margin-top: 0 !important;
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}

.copyInfo {
    background-image: url("data:image/svg+xml;utf8,<svg class='icon' style='width: 1em;height: 1em;vertical-align: middle;fill: rgb(108, 117, 125);overflow: hidden;' viewBox='0 0 1024 1024' version='1.1' xmlns='http://www.w3.org/2000/svg' p-id='2669'><path d='M661.333333 234.666667A64 64 0 0 1 725.333333 298.666667v597.333333a64 64 0 0 1-64 64h-469.333333A64 64 0 0 1 128 896V298.666667a64 64 0 0 1 64-64z m-21.333333 85.333333H213.333333v554.666667h426.666667v-554.666667z m191.829333-256a64 64 0 0 1 63.744 57.856l0.256 6.144v575.701333a42.666667 42.666667 0 0 1-85.034666 4.992l-0.298667-4.992V149.333333H384a42.666667 42.666667 0 0 1-42.368-37.674666L341.333333 106.666667a42.666667 42.666667 0 0 1 37.674667-42.368L384 64h447.829333z' p-id='2670'></path></svg>");
    display:inline-block;
    transition:all ease 0.25s;
    width: 1.3rem !important;
    height: 1.3rem !important;
    background-repeat:no-repeat;
    transform: translateX(3pt) translateY(calc( 10pt - 0.7rem ));
}

.copyInfo:hover {
    transition:all ease 0.25s;
    background-image: url("data:image/svg+xml;utf8,<svg class='icon' style='width: 1em;height: 1em;vertical-align: middle;fill: white;overflow: hidden;' viewBox='0 0 1024 1024' version='1.1' xmlns='http://www.w3.org/2000/svg' p-id='2669'><path d='M661.333333 234.666667A64 64 0 0 1 725.333333 298.666667v597.333333a64 64 0 0 1-64 64h-469.333333A64 64 0 0 1 128 896V298.666667a64 64 0 0 1 64-64z m-21.333333 85.333333H213.333333v554.666667h426.666667v-554.666667z m191.829333-256a64 64 0 0 1 63.744 57.856l0.256 6.144v575.701333a42.666667 42.666667 0 0 1-85.034666 4.992l-0.298667-4.992V149.333333H384a42.666667 42.666667 0 0 1-42.368-37.674666L341.333333 106.666667a42.666667 42.666667 0 0 1 37.674667-42.368L384 64h447.829333z' p-id='2670'></path></svg>");
}

.copyInfo:active {
    transition:all ease 0.1s;
    background-image: url("data:image/svg+xml;utf8,<svg class='icon' style='width: 1em;height: 1em;vertical-align: middle;fill: rgb(75,255,50);overflow: hidden;' viewBox='0 0 1024 1024' version='1.1' xmlns='http://www.w3.org/2000/svg' p-id='2669'><path d='M661.333333 234.666667A64 64 0 0 1 725.333333 298.666667v597.333333a64 64 0 0 1-64 64h-469.333333A64 64 0 0 1 128 896V298.666667a64 64 0 0 1 64-64z m-21.333333 85.333333H213.333333v554.666667h426.666667v-554.666667z m191.829333-256a64 64 0 0 1 63.744 57.856l0.256 6.144v575.701333a42.666667 42.666667 0 0 1-85.034666 4.992l-0.298667-4.992V149.333333H384a42.666667 42.666667 0 0 1-42.368-37.674666L341.333333 106.666667a42.666667 42.666667 0 0 1 37.674667-42.368L384 64h447.829333z' p-id='2670'></path></svg>");
}

.CPHunavailable {
    display: inline-block;
    background: #87000094;
    margin-left: calc( 100% - 2rem - 23px - 85pt );
    /* display: none; */
    font-size: 15px;
    position: relative;
    border-radius: 5px;
    transition: all ease 0.25s;
}

.CPHunavailable:hover {
    background: #b80000;
    transition: all ease 0.25s;
}

.transferToCPH {
    display: inline-block;
    background: #242424;
    margin-left: calc( 100% - 2rem - 23px - 85pt );
    /* display: none; */
    font-size: 15px;
    position: relative;
    border-radius: 5px;
    transition: all ease 0.25s;
}

.transferToCPH:hover {
    background: #0f3d34;
    transition: all ease 0.25s;
}

.transferToCPH:active {
    background: #1ba61f;
    transition: all ease 0.1s;
}

.transferToCPH > p, .CPHunavailable > p {
    margin: 1pt 7pt 1pt 7pt;
}

/* #0f3d34 */
/* #1ba61f */
}

@-moz-document regexp("http://ssloj.cn/.*"), regexp("http://.*ybtoj.com.cn/.*"), regexp("https://mna.wang/.*") {
/* Main Part */
/*
    This part is the main part of the code.
    It's also the most important part.
*/

html > body {
background:black;
color:white !important;
}

.content > div > .existing {
background:#151515 !important;
}

.first_kill {
background:#4f4f4f !important;
}

.submit_time {
color:#fff !important;
}

#filter_username {
background:#4d4d4d;
}

.compact > .dropdown > span {
color:white !important;
}

.compact > .dropdown {
background:#4d4d4d !important;
}

.dimmer > .modal > .header {
background:#3f3f3f !important;
color:white;
}

.dimmer > .modal > .content {
background:#2b2b2b !important;
color:white;
}

body > div > .container > .padding > .grid > .row > .column > h4 {
color:white !important;
background:#515151;
}

body > div > .container > .padding > .grid > .row > .column > div {
color:white !important;
background:#2b2b2b;
}

#user_card > div {
background:#3f3f3f !important;
color:white !important;
}

#user_card > .content > .header {
background:#3f3f3f !important;
color:white !important;
}

.grid > .row > .sixteen > .grid > .eight > .grid > .row > .column > h4 {
color:white !important;
background:#515151;
}

.grid > .row > .sixteen > .grid > .eight > .grid > .row > .column > div {
color:white !important;
background:#2b2b2b;
}

.eleven > .grid > .row > .column > h4 {
color:white !important;
background:#515151;
}

.eleven > .grid > .row > .column > div {
color:white !important;
background:#2b2b2b;
}

.editor {
background:#000 !important;
}

#vueAppFuckSafari > div > .existing > div > .button {
color:black !important;
}

#vueAppFuckSafari > div > .existing > div > .primary {
color:white !important;
}

.accordion > .title > .grid > div {
background:#222 !important;
color:#b0b0b0
}

.accordion > .title > .grid > .three > i {
background:#1e1e1e !important;
}

.accordion > .content {
background:#3c3c3c !important;
}

.accordion > .content > div {
background:#3c3c3c !important;
}

.accordion > .content > div > p {
background:#3c3c3c !important;
}

.accordion > .content > div > .segment {
background:#535353 !important;
}

#vueAppFuckSafari > div > div {
background:#1e1e1e !important;
}

.structured {
border-radius:5pt !important;
}

.structured > thead > tr > th {
border:1px solid #000 !important;
background:#3f3f3f !important;
}

.structured > tbody > tr > td {
border:1px solid #000 !important;
background:#3f3f3f !important;
}

.grid > .four > .attached > .item {
background:#2d2d2d;
}

.minimap {
width:0pt !important;
background:#202a2d !important;
}

.minimap > .minimap-slider {
background:#a8a8a859 !important;
}

.margin-view-overlays {
background:#2f2f2f !important;
}

.margin-view-overlays > div > .line-numbers {
color:#c8c8c8 !important;
}

.margin-view-overlays > div > .current-line {
color:#333 !important;
}

.view-lines {
background:#2b2b2b !important;
}

.view-line > span > .mtk1 {
color:#a2a2a2 !important;
}

.grid > .four > .attached > .active {
background:#515151 !important;
}

#editor {
background:#515151 !important;
}

.transition > .item {
background:#4f4f4f !important;
}

.transition {
background:#4f4f4f !important;
}

.floated > .attached > .aligned > tbody > tr > td > .popup > .button {
color:white !important;
}

.floated > .attached > .aligned > tbody > tr > td > .popup {
background:#3f3f3f !important;
border:1pt #3f3f3f solid;
color:white;
}

.floated > .attached > .aligned > tbody > tr > td > .popup::before {
background:#3f3f3f !important;
color:white;
box-shadow:1px 1px 0 0 #3f3f3f
}

.padding > .aligned > tbody > tr > td > .popup > .button {
color:white !important;
}

.padding > .aligned > tbody > tr > td > .popup {
background:#3f3f3f !important;
border:1pt #3f3f3f solid;
color:white;
}

.padding > .aligned > tbody > tr > td > .popup::before {
background:#3f3f3f !important;
color:white;
box-shadow:1px 1px 0 0 #3f3f3f
}

.container > .grid > .row > .column > h4 {
background:#4f4f4f;
color:white;
border:1pt solid #4f4f4f;
}

.container > .grid > .row > .column > .segment {
background:#242424;
color:white;
border:1pt solid #242424;
}

.container > .grid > .row > .column > .segment >div > .existing {
background:#484848;
color:white;
border:1pt solid #484848;
}

.row > .header {
color:white;
}

.row > .label {
background:#3c3c3c;
color:white;
}

.row > .column > .floated > .button {
background:#6c6c6c;
}

.menu > .item > a > .dropdown {
background:#3c3c3c !important;
}

.borderless > .container > .menu > .item > .menu > .item {
background:#3c3c3c !important;
color:white !important;
}

.borderless > .container > .menu > .item > .menu {
border:3pt solid #3d3d3d !important;
}

body > .borderless > .container > .menu > .item {
background:#3c3c3c !important;
}

body > .borderless > .container > .menu > .item > .button {
color:black !important;
}

body > .borderless > .container > .menu > .item > .primary {
color:white !important;
}

.container > .negative {
background:#b34644 !important;
color:white !important;
}

.container > .negative > .content > .header {
color:white !important;
}

.row > .column > .ui > .content {
color:white !important;
}

.padding > form > .input > input {
background:#4f4f4f !important;
color:white !important;
}

.padding > form > .input > .button {
background:#797979 !important;
color:white !important;
}

.pagination {
border:3pt solid #000 !important;
border-radius:7pt !important;
}

...

Reviews

No reviews yet.