[ home / bans / all ] [ qa / jp ] [ win / xmas ] [ f / ec ] [ b / poll ] [ tv / bann ] [ toggle-new / tab ]

/b/ - Boson Technology

Also known as Boson /g/

New Reply

Options
Comment
File
Whitelist Token
Spoiler
Password (For file deletion.)
Markup tags exist for bold, itallics, header, spoiler etc. as listed in " [options] > View Formatting "


[Return] [Bottom] [Catalog]

File:[MoyaiSubs] Mewkledreamy -….jpg (237.19 KB,1920x1080)

 No.10412

I figure it wouldn't hurt to have a thread focused on kissu's CSS stuff. I can blog about it and people can offer suggestions. CSS is the text that alters how stuff looks on websites. When I add in something temporarily, like little images attached to posts, it's a CSS thing.

Anyway, I think it'd be cool if there was more community interaction with this thing and people could provide material for me to use.
We can't really celebrate every idol or 2hu birthday or it'd be a lot less special. I've just been doing it on a whim now and then with random stuff, but I'm only one person with one set of likes and dislikes.
Maybe you liked part of an episode or game and edited a nice crop of it? Yeah, I can put that up for a couple days. Did a manga come back from hiatus and you're excited to share a picture from it? Sounds cool, I'll attach something to your thread if you provide it. Stupid stuff like "Can you add furry Patchy to this /jp/ thread" is also acceptable, in moderation.

 No.10413

Could you please limit the CSS to only the thread it's celebrating? Sometimes it makes the catalog unreadable and I'd rather not hide a thread that's being celebrated.

 No.10414

File:[SubsPlease] Teppen - 04 (….jpg (140.65 KB,1280x720)

>>10413
I usually do that for the possibly disruptive stuff on /qa/, but /jp/ is supposed to be a bit randomly chaotic and I'd prefer not restricting people (or myself) from messing with it now and then, within reason. I don't like the idea of compartmentalizing CSS within a thread, however, as it's approaching the "condense your threads" 'general' attitude that I greatly loathe. If something really cool happens then all of kissu should be really cool for the day, not the "cool thing happened" thread. To me, ideally, there would be 20 "really cool thing happened" threads and I wouldn't have enough time to customize them all as it engulfs everything. But, back to practicality:
/jp/ antics do bleed into /all/, but people can choose to hide boards or individual threads from it if they desire. Something I never meant to do, but is a cool side effect, is that the Lala theme highlights CSS-enabled posts with yellow text: >>>/jp/38676
I did envision a possible "No Fun" toggle to disable CSS events, but I mostly follow pre-existing CSS guides and don't actually understand how that would work. It'd be up to vern to create it and I don't think it's important enough to spend time on.

I don't suppose you have any saved screenshots from that issue you mention? I usually give stuff 50% opacity to at least lessen the problems like that. I'd rather design things around that then restrict things inside threads. Maybe there's some "disable in catalog view" CSS trick I'm missing

 No.10415

Now that I think about it, if I embed the CSS in the bottom reply of a thread it shouldn't appear in catalog mode, but I'm not sure if I want catalog mode to be barren like that

 No.10416

File:R-1658724937716.png (287.11 KB,591x446)


 No.10417

File:Isekai Ojisan - S01E03.mkv….jpg (270.1 KB,1920x1080)

>>10416
Bah. If only everyone understood the virtues of text shadow and included it for such situations. Maybe I need to make a dark theme so good (with text shadow) that you switch from that one

 No.10418

File:waterfox_nnaHUyyJLq.png (474.88 KB,977x702)

You could put this in your custom CSS thingie for a band-aid fix with a lighter font color with some text shadow

.op, .op p {
color: #d8d8d8;
text-shadow: 1px 1px 0px rgba(0, 0, 0, 1) !important;
}

 No.10419

File:waterfox_jHSldomt2q.png (379.17 KB,527x580)

>>10418
It's not a miracle cure, but it's better than the original

 No.10420

>>10418
that's pretty nice

 No.10421

>>10418
I'll add this to my customCSS. I think there are a few things to look out for such as how it looks with the various highlight modes.

 No.10424

Is pinning the special thread to the top of the page/catalog not an option?

 No.10427

File:[Erai-raws] Saikin Yatotta….jpg (209.3 KB,1280x720)

>>10424
The CSS-containing threads? Eh, I've tried to refrain from doing any stickies for dumb stuff. I want it to fall off naturally if possible, only to return if someone happens to bump it for whatever reason.
I don't think a sticky would have any benefit when it comes to the code if that's what you meant. CSS loads from top to bottom, in fact.

 No.10428

>>10427
I mean as in a temporary sticky, for a day.

 No.10429

>>10428
Yeah, it's definitely something I could do, but I haven't really felt like doing it lately. I think the last time I made one was, hmm... probably Kissu's 3rd or even 2nd birthday? If someone has a great idea for one, though, we could do it

 No.10447

File:[SubsPlease] Teppen - 04 (….jpg (218.97 KB,1280x720)

Does anyone have any ideas for a new theme? I'd rather do stuff that's more creative than just swapping colors around.
Or is there any interesting things happening any time soon that could benefit from a simple css change?

 No.10448

>>10447
someone once told me they'd use the kissu-ui if it had a Tomorow theme. They made it for our vichan-ui, but I never adapted it over

 No.10449

>>10448
Hmm, New UI's Luna theme seems really close to it, but I guess it's not exactly the same.
I'm not sure if I can justify adding a slot for that on its own, but if people like very dark themes then I could try to make one with my own twist on things with Tomorrow as the base.

 No.10450

File:28e8fad44a.png (15.91 KB,740x578)

>>10449
Just an idea. There are some of the standard themes like photon and tomorow which are staples of 4chan's UI.

I'd tend to say no to more dark themes(we have 4 of them), but running the markup on light themes is a bit of a hassle anyways... Maybe more light themes, but I wouldn't object to more dark ones

 No.10451

another thing is that I don't like what I did with kissu.css, our only light theme... so there's even room for correcting mistakes...

But these are the very dry themes that aren't very colorful and(perhaps) not very fun

 No.10452

File:Under_construction_graphic.gif (5.52 KB,200x150)

>>10451
Yeah, I think at least 90% of people prefer simple color themes, but they're so boring to make. Web 2.0 and its white and grey banality is just so depressing to me.

I will definitely take a look at 'kissu', though. I think that wouldn't be much work to improve in a boring manner.

 No.10453

File:banners.png (333.1 KB,1565x843)

>>10452
> white and grey
depends

 No.10455

I would like to have a good light theme on Kissu though so if you have any thematic ideas it would be nice if it isn't done with dark colors

 No.10456

>>10455
Yeah, I'm thinking a light theme is a good idea. >>10453 seems like a good starting point, the sakura thing is pretty popular and there's many, many examples to draw from.
I swear I've seen a similar theme for something in the past couple years that I really liked, but I can't remember what it was for. It might have even just been one of those fancy graphics for someone's doujin song

 No.10458

File:[SubsPlease] Teppen - 04 (….jpg (148.35 KB,1280x720)

What's your opinion of the gradient thingie on the quick reply box in this thread? You need to enter or expand the thread to load the CSS.
It should look shiny and pink to you

 No.10459

>>10458
Ah, and I don't mean the color, but the gradient effect. Is it too distracting, or does it look nice?

 No.10460

File:C-1659076390932.png (1.04 MB,1214x593)

Honestly, it looks kind of bad in the Lala theme. Thread title's hard to read, OP's background looks out of place, the pink on the quick reply also looks out of place. Though, I like how the thread body looks.

 No.10462

>>10460
Oh, the OP text is a side effect of messing with the OP text color with rainbow background. Definitely not designed with the Lala rainbow text in mind. (which is a weird transparent text + background fill property) It's not something that will be a part of any theme. I'm just asking about the top part of the reply box that's pink, completely in isolation from everything else.

 No.10463

>>10461
>the top part of the reply box that's pink
I think it looks best with Hazuki, little less with Kissu, a little distracting/out of place with Luna and Lala, and no pink top for Nekomimi.
>in isolation
I don't know how to judge that. I guess just the top bar itself is nice to look at.

 No.10464

yeah. it's an improvement to the purple theme

 No.10465

>>10460
Yeah, I can't really get behind how out of place the OP color block looks

 No.10467

File:[Erai-raws] Saikin Yatotta….jpg (161.18 KB,1280x720)

>>10464
AAAAAAAAAAAAAAAAA! The rainbow look is a random effect I added to the thread because it's the css thread! You're not supposed to rate it because it's not going to be in anything!

 No.10477

File:doremi-flying.gif (2.51 KB,75x75)

Could we have some CSS for Ojamajo Doremi? It's her birthday today. Maybe this pic for every post...

 No.10478

File:doremi-mascot-60percentopa….png (28.69 KB,350x350)

...and this as the mascot...

 No.10479

File:03.png (5.23 MB,1624x1427)

... and if you want to change the colours as well then this image should set the mood for what sort of colours to pick

 No.10480

File:[SubsPlease] Tokyo Mew Mew….jpg (156.78 KB,1280x720)

>>10479
Colors might be a bit too much on short notice (and seasonal stream is going on), but do you want to make a thread on /jp/ so I can attach the CSS to the thread?

 No.10481

>>10480
Oh, but if you provide a lot of info like that I could get around to assembling a theme around it. I'd need feedback and ideas from you, though. A good pastel theme sounds nice

 No.10482

>>10480
Here >>>/jp/39635
>>10481
Cool I can be around for feedback and stuff

 No.10483

Added! Thanks!
The way I add images to replies is somehow canceling out the reply boxes on Lala theme so that's something I'll need to look at later...

 No.10484

>>10483
Thanks, kissu is awesome!

 No.10537

File:63764769_p0.png (2.19 MB,2100x2900)

I think I'll make this thread the place where I credit the artists of the stuff I use.

Rika Background: https://www.pixiv.net/en/artworks/84544442
Rena Reply: https://mosamosa.at.webry.info/200609/article_2.html (cool that website is still up!)

 No.10538

>>10537
cute Rika

 No.10541

File:cool mascot.png (1010.2 KB,1345x862)

My custom mascot looks cool against the /jp/ CSS with the Lala theme

 No.10542

>>10541
Nice. I tried to keep some space on the right side so mascots didn't block everything.
I'll list the artists later, but I'm too lazy and tired right now. Uhh, the flanfly artist is named something like Yamato which makes it annoying to track down, but the others are simple. Gotta find those bookmarks...

 No.10768

File:98159484_p0.png (1.23 MB,1000x1399)

9/9 image is by Coa:
https://www.pixiv.net/en/artworks/98159484
I overrode the OP text and text shadow for 9/9 so it should be still be readable on any theme... I hope.
How is your tolerance level on the animated background? It's a copy of stage 2 EoSD, but I don't have the CSS wizardry to tilt it like it is in the game. I already had a headache today so I can't gauge how it makes me feel, but it was fine for me a couple days ago when I tested it and I'm usually sensitive to these things.

 No.10769

>>10768
Oh, and now I see that it's doing something weird on old UI.
Bleh.
Looking into it...

 No.10773

>>10768
I'm fine with the animated bg

 No.10790

File:[SubsPlease] Utawarerumono….jpg (98.81 KB,1280x720)

Cirno Day is over. Well, I mean it's still there in a few timezones but I'm going to bed.
Open for suggestions on any future days. I think I'm going to do something for Kuon, not on any particular day or for any reason other than I really, really, really, really, really love Kuon.
Hmm... maybe something for Halloween. Definitely going to try and do something cool for Kissu's 4th birthday on December 1st. Preferably there'd be other things I can do between then *cough cough* give me material *cough cough*

 No.10791

>>10790
mewkledreamy

 No.10792

>>10791
That's very good, but I could have come up with that! Can you be more specific, do you have an image or color in mind?

 No.10793

File:mewkle mascot 75 percent.png (135.31 KB,300x300)

>>10792
Oh that's what you meant by material...

 No.10794

File:mewkle post icon.gif (1.69 KB,80x96)

her birthday is August 16 so, see you in a year

 No.10795

File:[MoyaiSubs] Mewkledreamy -….jpg (393.68 KB,1920x1080)

>>10793
>>10794
Nice!
This stuff is really good and I'm heavily biased towards Mewkledreamy. Yep, I think we'll have this stuff soon. Hmm... maybe next weekend just because the weekend is a nice relaxing time for people with jobs or college and such and we just had Cirno so I don't want to do anything right away.
Yes, yes... this is great. We have a plan!

 No.10881

Kuon is breaking my phone(cpu lag)

 No.10882

>>10881
Kuon's justice

 No.10905

File:test copy3.png (13.27 KB,128x128)

>>10881
Oh, I didn't see that post. Umm, hmmm.... It IS a big image, but I don't know how I'd fix that. I can try compressing it with one of those PNG crusher things I suppose.
Are you able to use the Lala theme without issue? Or actually, are you using the vichan UI or the new KissuiUI one?
CSS animations do make the CPU work and I was going to do a non-animation version of Lala theme, but kind of forgot. Oops.

Anyway, going to upload the 3 Fran images and the CSS used for them if people want to do add Fran cursor to always be active (until this /b/ thread dies)

 No.10906

File:test copy4.png (13.29 KB,128x128)


 No.10907

File:test copy3 copy.png (20.06 KB,128x128)


 No.10908

File:[Isekai-mini] Tensei shita….jpg (186.57 KB,1920x1080)

Fran cursor CSS. It should work on old Vichan and new Kissu UI

* {
cursor:url(/b/src/1666402680200.png),auto !important;
}

a>img,
input[type=text],
input[type=search],
input[type=url],
input:not([type]),
select {
cursor:url(/b/src/1666402692675.png),auto !important;
}

a, i, .updater {
cursor:url(/b/src/1666402703088.png),auto !important;
}

 No.10910

>>10905
Yeah, i can use everything else on the site

 No.10968

File:waterfox_lDLeFF7pAq copy.png (1.01 MB,1209x867)

Alright, I want to throw up some simple CSS this weekend! (and also want people to give stuff to do in general at any time)
Give me something to do! You can give me a bunch of things, or just one. Multiple people could have different categories active at once and I think that'd be really fun.
As an example, here's an image of what's active on /secret/:

Options:
Background image - Self explanatory - the image that's in the background.
Reply image - The "background" image in the reply box. You generally want this to be a small image with a transparent background. If it's a simple background, though, I can remove it myself. I can make it so it repeats in an X or Y direction or both, or have it expand in size as the reply box grows larger.
Mascot (an image that sits in lower right, usually a character. Like the reply box image, it really needs a transparent background or a simple one that I can remove semi-automatically.
Mouse Cursor - If you're a bad enough dude to make an image that's 128x128 or less with a pointy thing in the upper left, this one is for you. I used to mess around with cursors back in the old days and could maybe give tips if anyone wants to take the plunge. Note that animated cursors are a real pain to create, as they have to be a series of uploaded images cycled in order. (also apparently a bit CPU heavy for people on toasters)
Name (not pictured) - This one is supposed to be a bit special, but we can also change the 'Anonymous' name into something else, as a whole or specific to a board.

So let's do something!

 No.10969

>>10968
Is it also an option to customize the reply box you type your reply into?
Could be complicated. There's a header background and a background for each text field and a whole bunch of differently styled buttons.
Maybe I'll learn CSS. I never really got into web programming, you know the classic stuff with the HTML and the text editors and the year 2000.

 No.10970

File:waterfox_i7yueTD3MG.png (17.5 KB,411x120)

>>10969
>Is it also an option to customize the reply box you type your reply into?
Yes it is! If you actually enter this thread instead of viewing it through /all/ you'll see that I messed around with the reply box's handle bar thingie just to see if I could.
I guess if people have any requests for permanent options they could ask in this thread, too, or did you want to throw something in there temporarily?

 No.10973

>>10970
Oh, but it only works on new UI. Old UI's is customizable as well, but it has its own specifications. I could probably dig these all up and label them. I already did it for the new UI for the Lala theme.

 No.10974

>>10970
No concrete request at the moment, just wanted to know if it could be done.
>If you actually enter this thread instead of viewing it through /all/
sigh stalking my browsing habits

 No.10976

File:Akuyaku Reijou nanode Last….jpg (256.76 KB,1920x1080)

>>10974
Well, it's a safe assumption for 99% of users including myself. It's also why it's hard to get people to reply to threads that aren't at the top. Just one of those imageboard things that we try to build around

 No.10981

gonna put something together

 No.10982

File:[Isekai] Futoku no Guild -….jpg (242.97 KB,1920x1080)

>>10981
YES! Good, good!

 No.10983

File:assets.zip (1.21 MB)

Here's some stuff

 No.10988

>>10983
Nice. Just woke up, but I'll get to work on doing this now

 No.10989

File:background.jpg (1.03 MB,1920x2068)

I think I'm going to upload anyone used like this in this thread for archival purposes and I'll upload the final script css lines so people can add it to their custom CSS window in Options if they want to keep it around

 No.10990

File:background-player-handle.png (77.44 KB,1198x53)


 No.10991

File:cursor.png (9.62 KB,128x128)


 No.10992

File:cursor-select.png (8.88 KB,128x128)


 No.10993

File:mascot.png (75.5 KB,420x300)


 No.10994

File:reply-image.webp (21.68 KB,64x64)


 No.10996

File:cursor-select over image.png (9.4 KB,128x128)


 No.10998

I just saw a deleted post.

 No.10999

File:Honeyview_background 50 o….webp (592.18 KB,1920x2068)

>>10996
I should have mentioned that I usually give backgrounds reduced opacity so they can work with dark or light CSS.
It doesn't matter really, it's quite possibly the simplest edit you'd ever do

 No.11000

File:waterfox_2SF4f57cff.png (510.77 KB,713x644)

Here is the weekend Suite Precure CSS. Put this in your Custom CSS Box under the Style Tab under Options for new UI or CSS Options for Old UI and you can keep it forever*.

Expand for CSS Text
.qr-handle {
color:#ececf8 !important;
text-shadow: 2px 2px 2px rgba(0, 0, 0, 1) !important;
background-image: url(/b/src/1668203736473.png) !important;
background-position: top left !important;
}

#lowercontents, .page-details, .main-sections.thread-window {
background-image: url(/b/src/1668204994315.webp);
background-repeat: no-repeat;
background-attachment:fixed;
background-position: right !important;
}


div.post.reply, .reply > .post-contents {
background-image: url(/b/src/1668203769847.webp) !important;
background-position: bottom right !important;
background-repeat: no-repeat !important;
margin-right: 30px;
}
* {
cursor:url(/b/src/1668203749324.png),auto !important;
}

a>img,
input[type=text],
input[type=search],
input[type=url],
input:not([type]),
select {
cursor:url(/b/src/1668204392734.png),auto !important;
}

a, i, .updater {
cursor:url(/b/src/1668203754094.png),auto !important;
}

:root{
--mascot-override: url(/b/src/1668203760482.png);
--mascot-width: 420px;
--mascot-height: auto;
}

.mascot-img {
content: var(--mascot-override) !important;
width: var(--mascot-width) !important;
height: var(--mascot-height) !important;
object-fit: cover;
z-index: -0;
border: 0px solid #0000;
background-repeat: no-repeat;
}
@supports not selector(:read-only) { /* Browsers at palemoon's version need this */
.mascot-img {
background-image: var(--mascot-override);
}
}


*The images are uploaded in this /b/ thread so they should last for years, but not forever.

 No.11019

Text beneath these is always really hard to read on the themes with light colored text. mix-blend-mode seems like it might be useful for helping with this, but I'm no good at CSS :<

 No.11020

File:96360537_p2.jpg (2.93 MB,3038x4096)

>>11019
Hm, yeah, I forgot to do the thing that forces replies to be a certain size so text is never under the image. Or maybe I can learn how to make an animated PNG since I think they can have reduced opacity unlike GIF.
Oh well. It's over now, and doing stuff like this helps me learn.
*cough cough* give me more stuff guys *cough* *cough*
Well, Sachiko's birthday is on the 25th so I'll throw in the usual Sachiko CSS and maybe see if I can add some new stuff.

 No.11078

mental note: Kemono Friends debuted on Jan 11th

 No.11089

File:1655342136696.jpg (1.12 MB,1920x1440)


 No.11090

File:1669948182522.webp (347.73 KB,2579x1440)


 No.11091

File:1670013905246.png (6.16 KB,128x128)


 No.11092

File:1670013910629.png (7.74 KB,128x128)


 No.11093

File:1670014388507.png (6.2 KB,128x128)


 No.11094

File:[Exiled-Destiny]_Tsukuyomi….jpg (42.72 KB,720x480)

If you want the lackluster 2022 Kissu Birthday CSS active at any time put this in your custom CSS. The background is static on old UI, but animated on new one:

Click to expand:root{
--mascot-override: url(/test/src/1669937590727.png);
--mascot-width: 300px;
--mascot-height: auto;
}
.mascot-img {
content: var(--mascot-override) !important; /* !important should be used here because we want to remove other people's mascots for our own temporary ones */
width: var(--mascot-width) !important;
height: var(--mascot-height) !important; /* maybe there's a way to remove these two lines...*/
object-fit: cover;
z-index: -0;
border: 0px solid #0000;
background-repeat: no-repeat;
}
@supports not selector(:read-only) { /* Browsers at palemoon's version need this */
.mascot-img {
background-image: var(--mascot-override);
}
}

@keyframes nekomimi {
0% { background-position: 0% 40000%;}
100% { background-position: 40000% 0%;}
}
.page-details, .main-sections.thread-window {
background-image: url(/b/src/1670648159653.webp);
background-repeat: repeat;
animation-timing-function:linear;
background-attachment:fixed;
animation-name: nekomimi;
animation-duration: 40000s;
animation-iteration-count: infinite;
}

#lowercontents {
background-image: url(/b/src/1670648159653.webp);
background-repeat: repeat;
animation-timing-function:linear;
background-attachment:fixed;
background-position: center;
}

* {
cursor:url(/b/src/1670648224169.png) 0 29, auto !important;
}
a>img,
input[type=text],
input[type=search],
input[type=url],
input:not([type]),
select {
cursor:url(/b/src/1670648226761.png) 0 29, auto !important;
}
a, i, .updater {
cursor:url(/b/src/1670648225349.png) 0 29, auto !important;
}


If you don't want the animation on new UI you can also just ctrl + F 'nekomimi' and rename one of them and that will break it

 No.11095

File:waterfox_qpmNtcFJwh.png (723.5 KB,1016x859)

I'm trying to work on a Christmas theme for new UI to go along with /xmas/'s old UI one. Board-specific CSS doesn't really work on /all/ so it will have to be something people will choose from the theme selector on the left. It feels like an exercise in futility because green and green magically go together for Christmas, but I'm not feeling it when messing with this stuff

 No.11096

>>11095
What would be really cool would be if the community contributed some mascots and they were all lined up and scrolling in a slow horizontal way across the bottom of the screen kind of like the Lala stuff in the Lala theme.

 No.11097

File:kissumas assets.png (41.03 KB,750x400)

Here's some assets just so I'm not being a total idea guy about it.

 No.11098

File:[SubsPlease] Bocchi the Ro….jpg (113.23 KB,1280x720)

Thanks for reminding me that I'm supposed to be working on an xmas theme thingie.

>>11097
Wow, that's really cute and cool! Yeah, thanks. In general I've had terrible luck in getting people to contribute so that's a big help. I think people overestimate how easy it is. I think waiting for people to add things might not work because Christmas is already only two weeks away and it's a theme that loses value the next day.
Hmm... where to put it..

 No.11099

File:[MoyaiSubs] Mewkledreamy -….jpg (299.45 KB,1920x1080)

Alright, nearing completion and trying to figure out how to use >>11097 somewhere because it's cute and really needs to be included. I need to find a new way of doing things somewhere...

 No.11102

File:waterfox_fAlfk2mrax.png (504.17 KB,1045x678)

I might make a thread for it, too, but we now have a new Xmas theme on the new UI!
I learned some stuff again, and I should get to work on revamping the older stuff now




[Return] [Top] [Catalog] [Post a Reply]
Delete Post [ ]

[ home / bans / all ] [ qa / jp ] [ win / xmas ] [ f / ec ] [ b / poll ] [ tv / bann ] [ toggle-new / tab ]