The World Machine

33 replies·580 views
User avatar
Dino

#killsoybooru

1 month ago#1483685(edited 1 month ago)
Ive been working on this oneshot theme for the booru, let me know if you want to recommend anything or report any bugs.
So far, im planning on replacing most existing icons with the ones from the game but id have to ocnvert a few files and im just too lazy to do this right now, so for now the whole thing looks like this (paste into custom css)
MOST RECENT VERSION:
Show quoted text
body .bg-background,
body .bg-background::before,
body .bg-background::after {
background-image: url('https://soybooru.com/api/forum/attachments/f2ff87c5-d931-4423-b640-3aab7f1f63c4/file') !important;
background-color: #180c1e ;}
:root, .dark, html, body {
--color-background: #180c1e !important;
--color-card: #180c1e !important;
--color-muted: #180c1e !important;
--color-primary: #8400e2cf !important;
}
body {
font-family: "Minecraftia", monospace !important;
}
.card,
.bg-card,
.post,
.thread,
.message,
.comment,
article,
div[class*="card"],
div[class*="post"],
div[class*="thread"],
div[class*="panel"],
div[class*="box"] {
background: #180c1eed !important;
box-shadow:
0 0 0 1px #FFB000,
0 0 0 2px #FF7A00,
0 0 0 2.5px #CC4A00;
}
/* Quoted text boxes */
.quote, blockquote, .bbcode-quote, .quoted-text, .citation {
background-color: #24102e !important;
border-right-color: #ffd200
}
/* Buttons (this shit is kinda broken dont chang eanything)*/
.btn, button.bg-secondary{
background-color: #280920 !important;
border-color: #ffb000 !important;
}
button:hover {
background-color: #20071a;
color: #ffe152 !important;
}
button {
transition: transform 0.1s ease;
}
button:active {
transform: scale(0.85);
}

/* Accents */
a:hover {
background: #280920;
color: #fcd64e !important;
}
/*LOGO*/
#landing-logo-container > a:nth-child(1) img {
content: url("https://soybooru.com/api/forum/attachments/980b70b5-bda0-4c7d-96af-4e0a0918ccd6/file") !important;
}
/*RANDOM SHIT*/
@layer utilities {
@supports (color:color-mix(in lab,red,red)) {
.border-foreground\/10 {
border-color: color-mix(in oklab,var(--color-foreground)10%,#ffb000);
}
}
}
/*text*/
@layer utilities {
.text-muted-foreground {
color: #ffb000;
}}
div[class*="box"] {
background: #180c1e !important;
box-shadow: NONE }
/* Quoted text boxes */
.quote, blockquote, .bbcode-quote, .quoted-text, .citation {
background-color: #4015375c !important;
border: 0.5px solid #ffd84d;
}
div[class*="post"] {
border: 1px solid #fb0 !important;
box-shadow: NONE !important }
@layer components {
.bbcode-link {
color: #ae00ff }}
.prosemirror-editor .ProseMirror blockquote {
border-left: 3px solid #ffd84d;
color: var(--color-foreground);
background-color: #f3f5f7;
margin: .5em 0;
padding: .375rem .75rem;
}
old version
Show quoted text
body .bg-background,
body .bg-background::before,
body .bg-background::after {
background-image: url('https://soybooru.com/api/forum/attachments/f2ff87c5-d931-4423-b640-3aab7f1f63c4/file') !important;
background-color: #180c1e ;}
:root, .dark, html, body {
--color-background: #180c1e !important;
--color-card: #180c1e !important;
--color-muted: #180c1e !important;
--color-primary: #9a00e2 !important;
}
body {
font-family: "Minecraftia", monospace !important;
}
.card,
.bg-card,
.post,
.thread,
.message,
.comment,
article,
div[class*="card"],
div[class*="post"],
div[class*="thread"],
div[class*="panel"],
div[class*="box"] {
background: #180c1eeb !important;
box-shadow:
0 0 0 1px #ffb000 ,
0 0 0 2px #FF7A00,
0 0 0 2.5px #CC4A00;
}
/* Quoted text boxes */
.quote, blockquote, .bbcode-quote, .quoted-text, .citation {
background-color: #24102e !important;
border-right-color: #ffd200
}
/* Buttons (this shit is kinda broken dont chang eanything)*/
.btn, button.bg-secondary{
background-color: #280920 !important;
border-color: #ffb000 !important;
}
button:hover {
background-color: #20071a;
color: #ffe152 !important;
}
button {
transition: transform 0.1s ease;
}
button:active {
transform: scale(0.85);
}
/* Accents */
a:hover {
color: #fcd64e !important;
}
/*LOGO*/
#landing-logo-container > a:nth-child(1) img {
content: url("https://soybooru.com/api/forum/attachments/980b70b5-bda0-4c7d-96af-4e0a0918ccd6/file") !important;
}
/*RANDOM SHIT*/
@layer utilities {
@supports (color:color-mix(in lab,red,red)) {
.border-foreground\/10 {
border-color: color-mix(in oklab,var(--color-foreground)10%,#ffb000);
}
}
}
/*text*/
@layer utilities {
.text-muted-foreground {
color: #ffb000;
}}
div[class*="box"] {
background: #180c1e !important;
box-shadow: NONE }
/* Quoted text boxes */
.quote, blockquote, .bbcode-quote, .quoted-text, .citation {
background-color: #4015375c !important;
border: 0.5px solid #ffd84d;
}
div[class*="post"] {
border: 1px solid #fb0 !important;
box-shadow: NONE !important }
html, body, .app, main {
background: #760dff00
}
html {
background: #180c1e
}
@layer components {
.bbcode-link {
color: #ae00ff }}
.prosemirror-editor .ProseMirror blockquote {
border-left: 3px solid #ffd84d;
color: var(--color-foreground);
background-color: #f3f5f7;
margin: .5em 0;
padding: .375rem .75rem;
}
Issues:
When on the members section, button is greyed out.
Weird white line in the box that appears when you add a tag on your search impossible to remove without breaking everything.
Tag boxes are gray in the search bar (pls help)
/ 2
1 month ago#1483708
looks cool
User avatar
Dino

#killsoybooru

1 month ago#1483793
Jeff
looks cool
ty jeff
User avatar
Dino

#killsoybooru

1 month ago#1484037
@funkydealer @moidslayer you were some of the few interested pipo when i first posted the theme so im pinging you
User avatar
moidslayer

pocky boy

1 month ago#1484589
Dino
@funkydealer @moidslayer you were some of the few interested pipo when i first posted the theme so im pinging you
tyyyy :wholesome:
User avatar
moidslayer

pocky boy

1 month ago#1484596
looks awesome :wholesome:
User avatar
funkydealer

download opsec free​

1 month ago#1486232(edited 4 days ago)
y6uy57v04vei
User avatar
funkydealer

download opsec free​

1 month ago#1486235(edited 4 days ago)
ki8e79if1jf6
User avatar
funkydealer

download opsec free​

1 month ago#1486255(edited 4 days ago)
pykv2ax1uf1w
User avatar
Dino

#killsoybooru

1 month ago#1490533(edited 1 month ago)
update: added
html {
background: #180c1e
}
due to an annoying bug that made it so if you scrolled too far down there would be a white screen, now its a purple soy wojak background
User avatar
Dino

#killsoybooru

1 month ago#1490561
funkydealer
You should make the hover a little easier to differentiate
Top bar hover is still blue
Make the purple highlight for links a little brighter
for the buttons, try replacing the /*accent*/ section with this, i think this fixed it
/* Accents */
a:hover {
background: #280920;
color: #fcd64e !important;
}
User avatar
Dino

#killsoybooru

1 month ago#1490570
User avatar
funkydealer

download opsec free​

1 month ago#1490736(edited 4 days ago)
c5r8jh6ejzji
User avatar
funkydealer

download opsec free​

1 month ago#1490745(edited 4 days ago)
bxow9tra07uo
User avatar
Dino

#killsoybooru

1 month ago#1490751
funkydealer
Dino
Show quoted text
funkydealer
Show quoted text
You should make the hover a little easier to differentiate
Top bar hover is still blue
Make the purple highlight for links a little brighter
for the buttons, try replacing the /*accent*/ section with this, i think this fixed it
Show quoted text
/* Accents */
a:hover {
background: #280920;
color: #fcd64e !important;
}
fixed it thanks
for the links i think theyre connected to color--primary, so it looks kinda annoying if i try brightening them up, i had actually managed to do something that only affected the link but for some reason it also did some shit to the borders? so yeah
User avatar
funkydealer

download opsec free​

1 month ago#1490776(edited 4 days ago)
65uiovjxmnjp
User avatar
Dino

#killsoybooru

1 month ago#1490796
funkydealer
Dino
Show quoted text
funkydealer
Show quoted text
Dino
Show quoted text
funkydealer
Show quoted text
You should make the hover a little easier to differentiate
Top bar hover is still blue
Make the purple highlight for links a little brighter
for the buttons, try replacing the /*accent*/ section with this, i think this fixed it
Show quoted text
/* Accents */
a:hover {
background: #280920;
color: #fcd64e !important;
}
fixed it thanks
for the links i think theyre connected to color--primary, so it looks kinda annoying if i try brightening them up, i had actually managed to do something that only affected the link but for some reason it also did some shit to the borders? so yeah
was going to say why not #ae00ff instead but yeah i think i see what you mean
ok i think i got it working individually without breaking shit
@layer components {
.bbcode-link {
color: #ae00ff }}
User avatar
Dino

#killsoybooru

1 month ago#1490805
funkydealer
oh yeah you should make the buttons also react when they're clicked cause they stay the same rn
quote and notification button are good examples
i dont know how to do this :brainlet:
User avatar
Dino

#killsoybooru

1 month ago#1490818
Dino
funkydealer
Show quoted text
oh yeah you should make the buttons also react when they're clicked cause they stay the same rn
quote and notification button are good examples
i dont know how to do this :brainlet:
actuaoly i think i just have to add this to the button section
button { transition: transform 0.1s ease; } button:active { transform: scale(0.95); }
funky tell me if it works now
User avatar
funkydealer

download opsec free​

1 month ago#1490824(edited 4 days ago)
zxi7rg7b09wp
/ 2
Log in to reply to this thread.