Brighter usernames would be nice

ANNOUNCEMENT! I've been updating the CSS over the past two weeks, adding features and adjustments, however I can't check or see everything so I need feedback, especially as I'm planning a Custom JS later, and I need the CSS to be in perfect condition so there isn't any code clashes. I need (You) to do any or all of the following. >Post suggestions for CSS (and JS) features, preferably with a provided code or at least a clear explanation of what you're requesting. >Bug reports; things that don't work correctly. I already tried a fix for the Filter interference, but I'm sure there are other bugs. >Feedback on the CSS: I need specifics, visual details, preferably with screenshots and alternative suggestions/examples. <Note: Not everything is going to be used, but I'll definitely take everything into account in my further coding. Thanks

>>3443 Specific suggestions? Reasons? I kinda liked the Forest Green. Details man! I need details! Edit: I'll see about making it a little lighter in color.

Winter wallpaper

>>3550 Thanks, will take under consideration.

Idea/Suggestion if possible - Index Search. Seen it on some other imageboards where individual posts on a board can be found in a search on Index, as opposed for Catalog search that only finds OPs.

>>3612 I was planning on trying to get that and more features for Catalog, but I'm having difficulty getting the code to work. Might be missing something.

>Write a JS >Computer glitch loses the file >Start a new one >create a functioning Youtube JS for previews and Title <accidentally delete code from file Fucking hell.

.nameLabel { (for file uploads) needs a fix It's using default colors.

Should the infinity spinner that appears during bypass validation have its color changed for this board CSS, or should it remain black? >>>/site/15971

>>8111 Good question, but that's HTML coding, so unless I can convert it to pure CSS, it's fairly useless on a board level.

>>8112 >that's HTML coding No, that post is pure CSS code. It's a workaround to change the color without messing with HTML

>>8117 Forgot to add This is the HTML code <img src="/.static/spinner_infinity.svg" style="background-color: transparent; width: 300px; height: 100px;"> It can be ignored as it's just saying where it's located. The color options are CSS

Here are some color previews

>>8119 >>8118 >>8117 Apologies, you're correct I was just exhausted last night. body div.modalPanel div.modalInnerPanel form.modalForm img { background-color: transparent; width: 300px; height: 100px; } Adjust color from transparent to... whatever.

>>8133 Is this supposed to remove the spinner? Because it's still present. If you want to fully remove it, it can be done with this CSS code img[src="/.static/spinner_infinity.svg"] { display: none; } Then add a waiting icon to the disabled submit button so that there's still an indication of bypass verifying /* ↓ The button disabled effect happens here. Now has a loading icon to let you know the post is going through! */ input[value="Reload"]:disabled, input[type="submit"]:disabled, input[type="button"]:disabled, button:disabled { cursor: not-allowed; /* The animated loading icon that appears only for disabled buttons to give the illusion of loading. If your icon is .apng format, remove the .png extension from the hash. */ background-image: url("/.media/4bda340573526a47aa7c981bc873028ba5d865ef1e018ea43d227bf00d3ae855"); /* Don't change this if you want to re-use the animated loading icon for your CSS theme. */ padding-left: 20px; /* Don't change this if you want to re-use the animated loading icon for your CSS theme. */ background-size: 16px 16px; /* Don't change this if you want to re-use the animated loading icon for your CSS theme. */ background-repeat: no-repeat; /* Don't change this if you want to re-use the animated loading icon for your CSS theme. */ background-position: 2px center; }

>>8140 No, I was just illustrating the Spinner's base CSS itself. Good to have this removal code for the future. I just haven't had a chance to upload a new CSS in general. I wonder what the color to pick? Red, White, Yellow, Green?

>>8149 >>8140 Speaking of replacing the spinner there's also pic rel, that I can convert to apng.

>>8150 This works. I don't think you'll be able to completely replace the spinner though for bypass verification. I've tried, but the only options I can get out of it is >completely getting rid of it, but at the cost not being able to add a custom image >adding a custom image, but at the cost of the spinner always taking front and center of it. If the filter is modified to change the spinner color, it also affects the custom image behind it too That animation is better suited for the buttons on uploading posts and waiting for the bypass validation to be done (Different from trying to remove the infinity)

>>8160 >That animation is better suited for the buttons on uploading posts and waiting for the bypass validation to be done (Different from trying to remove the infinity) True, like I said, I haven't had the time to really sit and work on the CSS further, especially since some of the Global CSS updates have changed how things work. I'll see what shapes out.

>>3451 JavaScript suggestions: - Music Player like on >>>/jp/ - SauceNao or equivalent image sourcing system. - Index Search Function - Youtube Embed with Title and preview.

Minor CSS Announcement: I picked up a code from a CSS thread that I've applied to the board. Long story short; Limits expanded media size to vertical screen space, which means when you click on videos, images etc. they will fit the screen, so if you clicked on a 2000x2000px image don't worry that it's not filling up the page. As a side note From Version 2.12 onward I will be posting the changes to the code ITT when I make them. >>8331 Excellent suggestions. Definitely on my list.

Meh

>>9293 Delightfully unhelpful

JS Music Player We're now in business. For now just two songs but it's functional and I even upgraded the functions. More JS to come.

HELP NEEDED FOR SEARCH-FUNCTION Trying to implement a JS code to do Index Search (finding posts based on the words within the #text). As 8chan.moe either lacks a search.php or I can't seem to access it, I hope anyone with greater JavaScript knowledge can take a look at the following JS text and lemme know what I'm missing. If it requires HTML and/or other script to implement please let me know so I can pass it on to the site Devs and have them integrate the service across the site if possible. TL;DR: Need a JS code that - Adds a search box to #panelMessage. - Fetches threads and their posts - Searches all thread posts for given keywords. - Displays matching posts with links back to the thread/post If it requires some sort of script, I need details on how and what to send to the Devs. Sources I used in writing text rel: -- https://8chan.moe/.static/js/knownPost.js -- https://8chan.moe/.static/js/tooltips.js

>>7020 Forgot to say; Done.

CSS and JS Update! I've Updated and Upgraded the JS and CSS again. 1) Spoiler-Thumbnail hovering: I wrote up a JS code so that spoilered images will be shown as floating thumbnails when hovered over with the cursor. That way we don't have to click on a potentially unwanted image (unless it would be funny). There is a 1 second delay to make sure you don't accidentally hover over something. 2) report FieldSet I reduced the box size of the 'Forms' for Mass Deleting and Reporting (bottom of the page, so now they don't cover the entire bottom. Edit: 3) I also applied the Custom Thumbnails into JS for those people that don't use the main Board CSS. 😢 4) created a button (top left corner - click on the S) that allows you to cancel out ALL spoilers on a thread. This WILL reload the page however.

/roll{d10}

>>9494 >9494 Damn shame

>>9299 In addition to this Index Search Function. I also want to implement a SauceNao image-search system, however I'm running into CSR and CORS issues, so if anyone has ideas on how to write a code for this function, let me know.

Posting and saying hello from >>>/futa/ Just wanted to mention that we made a CSS based on yours and thank you for making the job easier. Come check us out or something. Here's the code variants and png assets, if you'd like: https://files.catbox.moe/o3a8bp.7z If you have any feedback or adjustment suggestions please let us know in the meta thread!

CSS Anon take a look at the CSS and JS please. I'm fairly sure this is a JS issue. I made a JS adjustment for multiple uploads to fit better but it messes with single image posts on Firefox. I dunno if this is an update on 8chan that messed it up but on Firefox and Tor, single image uploads have the .uploadDetails centered in .innerPost instead of above the .uploadCell, while they're fine in chrome. Additionally for all browsers the .uploadCell is sitting almost flush with the side of .innerPost Pics rel.

>>10103 This should hopefully do for Firefox browsers /* ↓ This tries to patch out the display bug for those using Firefox browsers. */ .uploadDetails { display: flex; flex-direction: row; align-items: flex-start; gap: 0.2rem; }

>>10107 FYI this does have its own quirk with how long file names are rendered.

>>10107 >>10108 Thanks. I'll take a look as soon as possible

>>10108 >>10107 It works fine and frankly how the filename appears is fine too. Not much different to Windows Explorer filenaming. I rewrote it into JS BTW // Mirror CSS flex behavior for .uploadDetails document.querySelectorAll(".uploadDetails").forEach(el => { el.style.display = "flex"; el.style.flexDirection = "row"; el.style.alignItems = "flex-start"; el.style.gap = "0.2rem"; });

>>10111 >Not much different to Windows Explorer filenaming. Fair enough.