This style changes UI in www.mobileread.com
MobileRead.com Dark by Daviteusz
Details
AuthorDaviteusz
LicenseGNU GPLv3
Categorywww.mobileread.com
Created
Updated
Size16 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
This style is compatible with DarkReader.
Inspired on:
If you like my work, you can buy me a coffee!
Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name MobileRead.com Dark
@author Daviteusz
@description Almost perfect dark theme for MobileRead.com
@namespace https://userstyles.world/style/13484/mobileread-com-dark
@version 3.3.0
@license GNU GPLv3
@preprocessor stylus
This userstyle is inspired on:
- https://userstyles.world/style/12889/mobileread-dark-style
- https://uso.kkx.one/style/156988
==/UserStyle== */
@-moz-document domain("www.mobileread.com") {
/* Mobileread.com Dark CSS */
/*========================*/
/*=== HTML Color sheme ===*/
html {
color-scheme: dark !important;
background-color: #222 !important;
}
/*=== Webkit scrollbars ===*/
*::-webkit-scrollbar {
width: 12px !important;
background: #333 !important;
border-radius: 2px
}
*::-webkit-scrollbar-thumb {
background: #444;
}
*::-webkit-scrollbar-corner {
background-color: #333 !important;
}
*::-moz-scrollbar {
width: 12px !important;
}
/* Page related */
/*=== Top left navigation ===*/
.top_menu_left li {
border-right: 1px solid #444
}
/*=== RSS icon ===*/
[src = "https://www2.mobileread.com/i/mr/misc/rss.gif"] {
clip-path: inset(2px 3px 2px 3px round 2px);
height: 16px;
width: 18px;
position: relative;
top: 2px;
transform: scale(1.4)
}
/*=== Global table layout colors and backgrounds=== */
/*==== left ====*/
.alt1,
.alt1Active {
background: rgb(34, 34, 34) !important;
color: #ccc !important;
border-color: #333 !important;
}
/*==== right ====*/
.alt2,
.alt2Active {
background: rgb(38, 38, 38) !important;
color: #ccc !important;
border-color: #333 !important;
}
/* Threads tree table */
/*=== Theards tree icon ===*/
[src = "https://www2.mobileread.com/i/mr/misc/navbits_finallink_ltr.gif"] {
position: relative;
bottom: 1px;
left: 1px;
}
table tbody tr td.navbar {
word-break: break-word;
}
table tbody tr td.navbar::before {
content: "";
position: relative;
bottom: 1px;
left: 7px;
display: block;
width: 7px;
height: 9px;
border-left: 1px dotted #fff;
border-bottom: 1px dotted #fff;
border-radius: 0px 0px 0px 1px;
margin-bottom: -10px;
z-index: 1;
image-rendering: pixelated;
}
/*=== "Threads in Forum" header bar color ===*/
.tcat {
color: #fff;
background: #4E72A2 !important;
}
/*=== "Showing threads" bar color */
.thead {
background: #333 !important;
color: #ccc !important;
border-color: #333 !important;
}
/*=== bottom bar ===*/
.tfoot {
background: #4E72A2 !important;
}
/*=== background color ===*/
.page,
.tborder,
body {
background: #222 !important;
color: #ccc;
}
/*=== external border colors ===*/
.tborder,
[valign = "bottom"] td.smallfont a::after,
[valign = "top"] td.smallfont a::after {
border: 1px solid #444;
}
/*=== Logo image & header background ===*/
.header {
background: #111 !important;
}
#logo_image {
content: url(/forums/attachment.php?attachmentid=206314&d=1707676303);
left: 10px;
position: absolute;
top: 45px;
display: block;
max-width: 220px;
max-height: 100px;
width: auto;
height: auto;
}
/* === Global Hyperlinks color ===*/
a:link,
a:visited,
body_alink,
body_avisited {
color: #fff !important;
text-decoration: none;
}
a:hover,
a:active,
body_ahover {
color: #fff !important;
text-decoration: underline;
}
/*=== vBulletin related ===*/
.vbmenu_popup {
background: #5D5D5D;
color: #b9b9b9;
border: 1px solid #222;
}
/*=== Control Panel under header and in right ===*/
.vbmenu_control {
background: #4E72A2 !important;
color: #fff !important;
}
.vbmenu_option {
background: #222;
color: #ccc;
}
.vbmenu_hilite {
background: #4E72A2;
}
/*=== Post font color ===*/
.vb_postbit {
font-size: 14px;
line-height: 1.3;
color: #ccc !important;
}
/*=== Alternative post layout ===*/
.postbit_box[align="right"] {
background: #262626;
color: #B9B9B9;
border: none;
border-right: 5px solid #444;
width: 175px;
}
/* Moderator notice */
[style="border: 3px solid #357f4e; margin: 1em 1px; padding: 5px; background-color: #d8ecd5;"] {
background-color: transparent !important
}
/*=== Threaded mode tree color ===*/
[src ^= "https://www2.mobileread.com/i/mr/misc/tree_"] {
filter: invert(1) contrast(0)
}
/*=== Page navigation ===*/
div.pagenav table.tborder tbody tr td * {
font-size: 14px !important;
text-transform: uppercase !important;
}
div.pagenav table.tborder tbody tr td.vbmenu_control {
height: 19px !important;
text-transform: uppercase !important;
font-size: 14px !important;
font-weight: 500 !important;
background-color: #333 !important;
}
/*=== Active page font color ===*/
.pagenav strong,
td.alt1 a.smallfont[rel = "prev"],
td.alt1 a.smallfont[rel = "next"] {
color: #fe7575 !important;
font-weight: bold !important;
}
/* Spoiler related */
/* Spoiler background */
[style^="border-left: 4px solid rgb"] {
background-color: #4e72a221 !important;
}
/* Add margin for spoiler if text is above */
br + div.smallfont input[type="button"][value="Show"],
br + div.smallfont input[type="button"][value="Hide"] {
margin-top: 8px !important
}
/* vBulletin Message Editor */
div:first-child .vBulletin_editor {
background: #222;
border: 1px solid #5d5d5d;
}
/*=== Buttons ===*/
div:first-child .imagebutton {
background: #b9b9b9 !important;
border-radius: 4px;
margin: 1px;
}
/*=== Font & color picker buttons ===*/
.popup_feedback {
background: #B9B9B9 !important;
height: 20px;
}
.popup_feedback div {
background: #B9B9B9 !important;
}
.popup_pickbutton {
border-color: #B9B9B9 !important;
}
.alt_pickbutton {
padding-left: 1px !important;
border-left: 1px solid #E1E1E2 !important
}
/*=== Selected color bar ===*/
td [id *= "_color_bar"] {
border-radius: 1em;
}
/*=== Message editor options text color=== */
fieldset.fieldset:nth-child(3) > legend:nth-child(1) {
color: #CCC;
}
/*=== Buttons separator ===*/
[src = "https://www2.mobileread.com/i/mr/editor/separator.gif"] {
height: 10px;
}
/* Blog related */
/*=== Blog post date color ===*/
#content h3 {
clear: both;
color: #ccc;
}
/*=== Blog quote text color */
#content div.entry blockquote p,
#content div.entry blockquote ul,
#content div.entry blockquote ol {
color: #b9b9b9;
}
#content div.entry blockquote {
background: #49474359 !important;
display: block !important;
margin: 0px 0px 0px 0px !important;
border: 0px !important;
border-left: 4px solid #eda94d !important;
padding-bottom: 2px;
padding-top: 2px;
}
/* Thread related */
/*=== Left panel padding ===*/
.alt2[width="175"] {
max-width: 175px;
word-wrap: break-word;
}
.alt2[width="175"] > div {
display: block;
background: #3333331a;
border: 1px solid #343434;
border-radius: 5px;
text-align: center;
margin-top: 2px;
padding: 5px
}
.alt2[width="175"] div.smallfont a img {
padding-bottom: 15px;
}
.alt2[width="175"] div[style="padding:4px 0px 2px;"] {
background: none;
border: none;
padding: 2px 0px 2px !important;
}
.alt2[width="175"] > div.smallfont > div {
position: relative;
bottom: 4px;
text-align: left;
margin-left: 10px;
margin-right: 10px;
}
/*=== Online/Offline status icon ===*/
.alt2[style="border: 1px solid #fff; border-top: 0px"] {
padding-left: 12px;
text-align: center;
}
.alt1[style="border: 1px solid #fff; border-left: 0px; border-top: 0px"] {
padding-right: 12px;
}
[src ^= "https://www2.mobileread.com/i/mr/statusicon/user_"] {
height: 24px !important;
outline: 8px solid #6082ad;
outline-offset: -5px;
image-rendering: pixelated;
clip-path: inset(0px round 1em);
}
[id ^= post].tborder tbody tr td.alt2 img[src ^= "https://www2.mobileread.com/i/mr/statusicon/user_"] {
height: 24px !important;
}
/*=== Karma/Reputation level baner ===*/
img[src ^= "https://www2.mobileread.com/i/mr/reputation/reputation_"] {
position: relative;
filter: invert(1) hue-rotate(180deg) contrast(120%);
height: 20px;
margin: 0px -2px 0px -2px;
image-rendering: pixelated;
clip-path: inset(4px round 2px);
}
/*=== Reputation/Report buttons ===*/
img[src ^= "https://www2.mobileread.com/i/mr/buttons/rep"] {
image-rendering: pixelated;
height: 36px;
clip-path: inset(7px 6px 5px 6px round 4px);
margin: -2px -6px 0px -2px;
}
/*=== Quote/Reply buttons ===*/
[src = "https://www2.mobileread.com/i/mr/buttons/sendpm.gif"],
[src = "https://www2.mobileread.com/i/mr/buttons/quote.gif"],
[src = "https://www2.mobileread.com/i/mr/buttons/quickreply.gif"],
[src = "https://www2.mobileread.com/i/mr/buttons/multiquote_off.gif"],
[src = "https://www2.mobileread.com/i/mr/buttons/multiquote_on.gif"],
[src = "https://www2.mobileread.com/i/mr/buttons/edit.gif"],
[src = "https://www2.mobileread.com/i/mr/buttons/forward.gif"] {
image-rendering: pixelated;
height: 36px;
clip-path: inset(6px round 2px);
margin: 3px -5px 0px 0px
}
/*=== Reply button, New Thread buttons ===*/
[valign = "bottom"] td.smallfont a img,
[valign = "top"] td.smallfont a img {
filter: brightness(0.7) saturate(0) contrast(200%);
image-rendering: pixelated;
height: 35px;
clip-path: inset(6px 14px 6px 6px);
position: relative;
z-index: 1;
margin-left: -5px !important;
margin-top: -5px !important;
margin-bottom: -5px !important;
}
/*=== Reply button, New Thread border ===*/
[valign = "bottom"] td.smallfont a,
[valign = "top"] td.smallfont a {
position: relative;
display: inline-block;
padding: 1px;
}
[valign = "bottom"] td.smallfont a::...