Skip to content

Nyaa Starlight *CUSTOMIZABLE* by tai7k

Screenshot of Nyaa Starlight *CUSTOMIZABLE*
Write a review Install Get Stylus

Details

Authortai7k

LicenseNo License

Categorynyaa.si

Created

Updated

Size12 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

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         Nyaa Starlight *CUSTOMIZABLE*
@version      20220910.03.41
@namespace    userstyles.world/user/tai7k
@description  A fully customizable theme for nyaa. Edit CSS variables to adjust colors and the like.

(Kitaro render by Gondarwin)
https://www.deviantart.com/gondarwin/art/Yuuki-Makoto-persona3-Render-481947354
@author       tai7k
@license      No License
==/UserStyle== */

@-moz-document url-prefix("https://nyaa.si/") {
html {
    --background: #02102C;
    --background-image: url("https://i.imgur.com/lKlDWxT.png");
    /* original render is from here: https://www.deviantart.com/gondarwin/art/Yuuki-Makoto-persona3-Render-481947354 (remove this comment once you change the background) */
    --card-border: #32546F;
    --card-title-bg: #1C2D49;
    --card-background: #1C2D49;
    --comments-background: #1C2D49;
    --icon-size: 100px;
    --text: #829DB8;
    --link: #98B0C7;
    --link-hover: #bfddf9;
    --nav-button: #98B0C7;
    --nav-hover: #bfddf9;    
    --search-border: #32546F;
    --search: #1C2D49;
    --red-button: #402829;
    --red-border: #714747;
    --red-text: #d08082;
    --grey-border: #55626c;
    --grey-button: #393f48;
    --grey-text: #97a7bf;
    --warn-button: #2c4028;
    --warn-border: #497147;
    --warn-text: #87d080;  
}
body {
    background: var(--background) var(--background-image);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: right 100%;  
    font-family: Verdana,sans-serif !important;
    font-size: 8pt;
}

a:link, a:visited, a:active {
    color: var(--link);
}
a:hover      {
    color: var(--link-hover);
    text-decoration: none;    
}

h3 {
    color: var(--text) !important;
    font-weight: bold;
    letter-spacing: 1px;
    font-size: 9pt !important;
}
.panel-success h3 {
    color: var(--warn-text) !important;
    font-weight: bold;
    letter-spacing: 1px;
    font-size: 9pt !important;
}
.panel-danger h3 {
    color: var(--red-text) !important;
    font-weight: bold;
    letter-spacing: 1px;
    font-size: 9pt !important;
}  
p {
    color: var(--text) !important;
}
.panel-heading {
    padding: 2px;
    border-bottom: solid 1px var(--card-border) !important;
    background: var(--card-title-bg) !important;
    border-radius: 0px;
}
.panel-success > .panel-heading {
    padding: 2px;
    border: solid 1px var(--warn-border) !important;
    background: var(--warn-button) !important;
    border-radius: 0px;
}  
.panel-danger > .panel-heading {
    padding: 2px;
    border: solid 1px var(--red-border) !important;
    background: var(--red-button) !important;
    border-radius: 0px;
}  
.panel-body {
    padding: 2px;
    background: var(--card-background);
    color: var(--text) !important;
}
.in {
    background: var(--comments-background);
    color: var(--text) !important;    
}
#comments {
    background: var(--comments-background);
    color: var(--text) !important;        
}

.avatar {
    width: var(--icon-size);
}
.panel-default {
    border-color: var(--card-border) !important;
    border-radius: 0px;
    margin-bottom: 5px;
}
.panel-success {
    border-color: var(--warn-border) !important;
    border-radius: 0px;
    margin-bottom: 5px;
}
.panel-danger {
    border-color: var(--red-border) !important;
    border-radius: 0px;
    margin-bottom: 5px;
}
.panel-footer {
    padding: 2px;
    border-top: solid 1px var(--card-border) !important;
    background: var(--card-background) !important;
    border-radius: 0px;
    color: var(--text) !important;
}
.navbar {
    background: var(--card-background);
    border: 1px solid var(--card-border);
    width: 1024px;
    height: 21px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    margin-bottom: 5px;
    min-height: 0px;    
}
.navbar-static-top {
    min-height: 0px;
}
nav a {
    color: var(--nav-button) !important;
}
nav a:hover {
    color: var(--nav-hover) !important;
}

.container {
    width: 1024px;
}
.table-responsive {
    width: 994px !important;    
    margin-left: auto;
    margin-right: auto;
    overflow-x: visible;
}

.navbar-nav > li > a {
    padding: 5px 5px 2px 5px;
    line-height: 100%;
}
.table {
    width: 994px !important;
    border-color: var(--card-border);
}
.table th {
    padding: 2px !important;
    background: var(--card-title-bg) !important;
    border-color: var(--card-border) !important;
    color: var(--text);
    line-height: 16px !important;
}
th.sorting:after {
    color: var(--text) !important;
    line-height: 0em;
}
.sorting_asc:after {
    color: var(--text) !important;
    line-height: 0em;    
}
.sorting_desc:after {
    color: var(--text) !important;
    line-height: 0em;    
}
table.torrent-list tbody .comments {
    background: none !important;
    border: none !important;    
    color: var(--link) !important;
}
table.torrent-list tbody .comments:hover {
    background: none !important;
    border: none !important;    
    color: var(--link-hover) !important;
    text-decoration: none;
}
tr {
    background-color: var(--card-background) !important;
}
td {
    border-color: var(--card-border) !important;
    padding: 2px !important;
}
.hdr-date {
    display: none;
}
body > div.container > div.table-responsive > table > tbody > tr > td:nth-child(5) {
    display: none; /* sorry, but we had to. it kept messing up the sizing. */
}
.navbar-brand {
    height: 4px !important;
    font-weight: bold;
    padding: 5px 5px 2px 15px;
    font-size: 8pt;
    line-height: 100%;
}
form {
    height: 15px !important;
}

.form-control {
    height: 19px !important;
    font-size: 8pt;
    border-color: var(--search-border) !important;
    background: var(--search) !important;
    color: var(--text);
    padding: 0px;
    padding-left: 2px;
    box-shadow: none !important;  
    border-radius: 0px;
}

.search-container > .search-bar {
    height: 15px !important;
    font-size: 8pt;
    border-color: var(--search-border) !important;
    background: var(--search) !important;
    color: var(--text);
    padding: 2px;
    box-shadow: none !important;  
}
::placeholder {
    color: var(--text) !important;
    margin-left: 0px !important;
}
.search-btn .btn-primary {
    height: 15px;
    padding: 2px 3px 2px 2px !important;
    border-radius: 0px;
    position: relative;
    border-color: var(--search-border) !important;
    background: var(--search) !important;   
    line-height: 0px !important;    
}
#navFilter-criteria .btn-default {
    height: 15px !important;
    font-size: 8pt;
    border-color: var(--search-border) !important;
    background: var(--search) !important;
    color: var(--text);
    padding: 0px;
    padding-left: 2px;
    line-height: 13px;
    border-radius: 0px !important;
}
#navFilter-criteria {
    border-radius: 0px !important;    
}
#navFilter-category .btn-default {
    height: 15px !important;
    font-size: 8pt;
    border-color: var(--search-border) !important;
    background: var(--search) !important;
    color: var(--text);
    padding: 0px; 
    padding-left: 2px;
    line-height: 13px;    
}
.caret {
    display: none;
}
.visible-lg {
    padding-right: 15px !important;
}
.search-container {
    position: relative;
    bottom: 8px;
}
.search-btn .fa-fw {
    display: none;
}
.search-btn .btn-primary::after {
    content: "+";
    font-size: 8pt;
    color: var(--link);
}
.pagination > li > a {
    border-radius: 0px !important;
    padding: 2px 5px;
    background: var(--card-background);
    border-color: var(--card-border);
    color: var(--link);
}
.pagination > li > a:hover {

    background: var(--card-background);
    border-color: var(--card-border);
    color: var(--link-hover);
}
.pagination > .active > a {
    background: var(--card-background);
    border-color: var(--card-border);    
    color: var(--link-hover);
    font-weight: bold;
}
.pagination > .active > a:hover {
    background: var(--card-background);
    border-color: var(--card-border);    
    color: var(--link-hover);
    font-weight: bold;
}
.pagination > .disabled > a {
    background: var(--card-background);
    border-color: var(--card-border);
    color: var(--link);
}
.pagination-page-info {
    color: var(--text);
    font-size: 7pt;
    letter-spacing: 1px;
    text-transform: lowercase;
}
footer p {
    font-size: 7pt;
    letter-spacing: 1px;
    text-transform: lowercase;    
}
body:before {
    content: "Please switch to dark mode for the style to work.";
    text-shadow: 0px 0px 5px var(--card-border);
    font-size: 15pt;
    margin-top: 5px;
    letter-spacing: 1px;
    color: var(--text);
    display: flex;
    justify-content: center;
}
.dark:before {
    display: none;
}
.content {
    border: 1px solid var(--card-border);
    border-radius: 0px;
    margin-bottom: 5px;
    padding: 2px;
    background: var(--card-background);
}
h1 {
    color: var(--text) !important;
    font-weight: bold;
    letter-spacing: 1px;
    font-size: 10pt !important;
    border-bottom: 1px dotted var(--text);
    padding-bottom: 1px;
}
label {
    color: var(--text) !important;
    font-weight: bold;
    letter-spacing: 1px;
    font-size: 10pt !important;
    padding-bottom: 1px;    
}
.small {
    text-transform: lowercase;
    letter-spacing: 1px;
}
textarea {
    display: none;
}
.content ul {
    list-style: none;
    padding-left: 0px;
}
.dropdown-menu {
    box-shadow: 2px 2px rgba(0,0,0,0.19);
    padding: 2px;
    font-size: 8pt;
    border-radius: 0px;
    border: 1px solid var(--search-border);
    background: var(--search);
}
.dropdown-menu > li > a {
    padding: 2px;
    color: var(--nav-button);
    font-size: 8pt;
}
.dropdown-menu > li > a:hover {
    background: none;
    color: var(--nav-hover);
}
.dropdown-menu > li > a:focus {
    background: var(--search) !important;
    color: var(--nav-hover) !important;
}
.markdown-source {
    font-size: 8pt;
    border-color: var(--search-border) !important;
    background: var(--search) !important;
    color: var(...

Reviews

No reviews yet.