All natural pine, faux fur and a bit of soho vibes for the classy minimalist
Rosé Pine for /Leftypol/ by averylokeygoated
Details
Authoraverylokeygoated
LicenseNo License
Categoryhttps://leftypol.org/, https://leftypol.org/
Created
Updated
Size32 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Work in progress!! NEEDS TWEAKING lots of spaghetti code here that seems to conflict with Leftypol / 4Chan X
Make sure to import this CSS to 4Chanx and select Muted or Demain Classic as your user theme. Your mileage may vary with other themes.
Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name Rose Pine Leftypol
@namespace https://github.com/averylokeygoated
@homepageURL https://github.com/averylokeygoated
@author pavlovs dawg
@description Soho vibes for /Leftypol/
@version 2024.05.1900.00.00
@author pavlovs dawg
@preprocessor stylus
==/UserStyle== */
@-moz-document domain("leftypol.org"), domain("4chan.org") {
@font-face {
font-family: 'SF Pro Display' !important;
}
/* custom colors */ /*var(--alt-bg)*/
:root {
--post-bg: #faf4ed !important; /* header bg */
--alt-bg: #fffaf3!important /* bg */
--header-bg: #f2e9de !important; /* post bg */
--main-text: #575279 !important; /* main text */
--secondary-text: #eb6f92 !important; /* name >text and quote */
--third-text: #eb6f92 !important; /* date and links */
--title-text: #eb6f92 !important; /* board title */
}
:root.shortcut-icons #shortcuts .fa, .menu-button .fa {
font-family: 'SF Pro Display' !important;
font-size: 14px;
color: #908caa !important;
}
.fa::before {
font-family: 'SF Pro Display' !important;
font-size: 14px;
color: #908caa !important;
}
/* board list */
.desktop-style div.boardlist:nth-child(1) {
background-color: #f2e9de;
}
/* Catalog grids */
/* Background color and green border */
.thread.grid-li.grid-size-vsmall, .thread.grid-li.grid-size-vsmall:hover,
.thread.grid-li.grid-size-small, .thread.grid-li.grid-size-small:hover,
.thread.grid-li.grid-size-large, .thread.grid-li.grid-size-large:hover {
background-color: #f2e9de;
border: 1px solid #908caa;
}
.theme-catalog div.thread {
font-size: 14px;
}
/* Posting form */
/* Field names */
form table tr th {
background: #f2e9de;
color: #ACACAC;
border: 1px solid #908caa;
}
/* Input fields */
textarea, input:not([type="file"]):not([type="checkbox"]), [type="submit"], select {
color: #575279;
background: #f2e9de;
border: 1px double #908caa;
border-radius: 5px;
}
/* Input fields, focused */
textarea:focus, input:not([type="file"]):not([type="checkbox"]):focus, [type="submit"]:hover {
border: 1px solid #908caa;
-moz-box-shadow: 0 0 10px #908caa;
-webkit-box-shadow: 0 0 10px #908caa;
box-shadow: 0 0 10px #908caa;
}
body, html {
color: #908caa !important;
background: var(--alt-bg) !important;
background-repeat: repeat !important;
background-attachment: fixed !important;
background-position: center center !important;
margin: 0 auto !important;
}
.intro span.name {
color: #797593;
}
/* Greentext */
span.quote {
color: #3C90B3;
}
/* header bg - make sure the image is around 2000 x 140 */
#header-bar::before {
/* default */
/* content: url("http://i.imgur.com/urpV4LK.png") !important;*/
/* merry christmas!
content: url("http://i.imgur.com/RSufmER.jpg") !important;*/
}
/* remove header title */
.div.boardTitle, .yotsuba-b:root div.boardTitle, div.boardTitle {
display: none !important;
margin-top: 40px !important;
}
body {
margin-top: 18px !important; /* 40 or 0 probably */
}
#bannerCnt {
display: none !important;
margin-top: 45px !important;
}
/* img - your bae/waifu/etc goes here */
/*
body::after {
content: url("http://i.imgur.com/wWiIpQd.png");
position: fixed !important;
margin: auto !important;
margin-top: 10px !important;
left: 0 !important;
bottom: 0 !important;
margin-left: 100px !important;
z-index: 1 !important;
}
/* op height */
div.opContainer {
min-height: 225px !important;
}
/* header title */
.div.boardTitle, .yotsuba-b:root div.boardTitle, div.boardTitle {
text-align: center;
/*margin-left: 60px !important; */
font-family: "SF Pro Display", cursive !important;
font-size: 18px !important;
padding: 0px !important;
color: var(--title-text) !important;
text-shadow: 3px 3px 3px rgba(0,0,0,0.3) !important;
}
body, #qr, #thread-watcher, #thread-watcher .refresh, .menu-button .fa, #watched-threads .watcher-title, #watched-threads .watcher-unread, #thread-watcher a, .entry, #qr textarea.field, .right-box, .field, .globalMessage, div#boardNavDesktop, table.postForm > tbody > tr > td:first-child, input[type="text"], input[type="password"], table.postForm > tbody textarea, #recaptcha_response_field, div#boardNavDesktopFoot, .gal-count, #index-search, .expand-all-shortcut, .subject, div.post div.postInfo span.subject, #custom-board-list, .yotsuba-b:root #board-list a, .yotsuba:root #board-list a {
color: var(--main-text) !important;
}
/* watcher and name block bg, quote text */
#watcher-link, .warning, div.post div.postInfo span.nameBlock span.name, div.post div.postInfo span.nameBlock span.postertrip, .nameBlock, .yotsuba_b_new .backlink, .quotelink, .yotsuba_b_new .backlink a, a:hover, code, blockquote > span.quote, .catalog-thread > .comment > span.quote, .yotsuba:root #board-list a:hover, #watched-threads .watcher-title:hover, .section-main label {
color: var(--secondary-text) !important;
}
a, div.post div.postInfo span.postNum a:hover, a.deadlink, a.close, .tab-filter, a.tab-main.tab-selected, #qr-no-file, .yotsuba-b:root .entry, #boards a, .boxbar, .deadlink, .gal-name, #qr select, select, kbd, #thread-watcher > .move, .qr-shortcut, span.dateTime, .yotsuba.fixed:root #custom-board-list .current, .yotsuba-b.fixed:root #custom-board-list .current, .yotsuba-b:root #header-bar:hover, .yotsuba-b:root #board-list a:hover, .quotelink:hover, .settings-link, span.menu-button, #thread-stats, .container, .fileText, .yotsuba:root #header-bar, .yotsuba:root #notifications, div.post div.postInfo span.postNum, div.post div.postInfo span.postNum a {
color: var(--third-text) !important;
}
/* bg colors */
div.reply, .catalog-mode:root .board, .inline .post {
background: var(--post-bg) !important;
}
.boxcontent, .top-box, .left-box, .right-box, #recent-images a {
background: var(--post-bg) !important;
}
#fourchanx-settings.dialog,
fieldset legend, .yotsuba-b:root .suboption-list > div:last-of-type, .dialog:not(#qr):not(#thread-watcher):not(#header-bar), #fourchanx-settings code, kbd, .reply:target, .reply.highlight, .yotsuba-b:root .inline {
background: var(--post-bg) !important;
}
#header-bar, .yotsuba-b:root:not(.fixed) #header-bar, span.boardList, .yotsuba:root .suboption-list > div:last-of-type {
background: var(--header-bg) !important;
border: #eb6f92 !important;
}
/* quoted bg */
.yotsuba:root .inline, .boxbar, #qr select {
background: var(--alt-bg) !important;
}
div.post.reply.highlighted {
background: #f2e9de !important;
border-color: #907aa9 !important;
border-style: solid;
border-width: 0.8px;
border-radius: 5px;
}
.post_reply_noFile:hover {
color: #f6c177 !important;
border: #f6c177 !important;
}
.post_reply_noFile.highlighted:hover {
color: #f6c177 !important;
border: #f6c177 2px solid !important;
}
#ft li, .right-box, .boxcontent, .top-box, .left-box, #recent-images .boxcontent, #qr select, #archive-board-select, select {
border: #eb6f92 !important;
}
.top-box .menubutton, .right-box .menubutton {
background-image: none !important;
}
#ft li, #ft ul {
background: #eb6f92 !important;
border: #eb6f92 !important;
}
/* misc */
img:hover {
opacity: 0.3 !important;
transition: 0.4s ease-in-out !important;
}
/* unscrollable horizontally, fixes stupid header issues */
body {
overflow-x: hidden !important;
}
/* quotes to (you) border color */
.highlight-you:root .quotesYou.opContainer, .highlight-you:root .quotesYou > .reply {
border-top: 1px solid var(--secondary-text) !important;
color: #eb6f92 !important;
}
/* highlight "selected" posts */
.post.reply.highlight {
border-top: 1px solid var(--secondary-text) !important;
color: #eb6f92 !important;
}
div.post.reply.highlight {
border-top: 1px solid var(#eb6f92) !important;
color: #eb6f92 !important;
}
/* notifications */
.message {
background-color: var(--post-bg) !important;
color: var(--main-text) !important;
text-shadow: none !important;
}
/* transition for links */
.yotsuba:root #board-list a, a:hover, #watched-threads .watcher-title:hover {
transition: ease-in-out .2s !important;
}
/* hide fields when not hovering - hide yo trip */
#qr input.field {
opacity: 0 !important;
}
#qr input.field:hover {
opacity: 1 !important;
}
/* Background, border and fade */
.bar {
background-color: #faf4ed;
border-color: #f2e9de!important;
/* comment these out to remove the fade */
/*
-moz-box-shadow: 0 0 40px #FFB300;
-webkit-box-shadow: 0 0 40px #FFB300;
box-shadow: 0 0 40px #FFB300;
*/
}
/* Bottom bar, not visible in catalog mode */
div.pages {
background: #faf4ed;
border-color: #f2e9de;
}
div.pages a.selected {
color: #575279 !important;
}
/* adjust header */
/*
#header-bar {
height: 200px !important;
background: url("http://i.imgur.com/QMSDOia.png") !important;
background-size: cover !important;
z-index: -10 !important;
}
*/
/* bg of header items */
.centered-links:root #custom-board-list, #thread-stats, .settings-link, span.menu-button, #watcher-link , #shortcut-gallery, #thread-stats, .div.boardTitle, .yotsuba-b:root div.boardTitle, div.boardTitle {
background: rgba(0,0,0,0) !important;
}
#header-bar {
background: var(...