/server/ - 188

>/cuber/

>>590
What's wrong with that? Its the board for all things cubism.

why did /cuber/ revert its CSS instead of keeping the stained glass panel look I must know

>>592
I guess the Board Owner preferred the old look
>>>/cyber/

>>593
I just wanted to say /cuber/

>>>/comfy/
https://pastebin.com/ai2H7pft

Also made one for /sw/ on Julay:
https://pastebin.com/FC7Sq9Tx

7ea9375dfee64df30b93e0f15fad4cf9b7bb5bae51b18ec0ecefc9db1c7abd09.png
[Hide] (41.9KB, 190x211)

>>588 (OP) 
Hey /css/ lads, can you help a friend in need?
Basically, I want to style my board thusly:

>All posts have their rectangle spread through all the page, from one side to the other
>All posts are surrounded by a graphic of some kind, think of it as a colored box with an extra detail at the upper and lower sides
>The very top and very bottom of the page (meaning just below the overboard section but above the manage board section) has a similar graphic
>Possibly, said graphic should be randomized among a few

Think I can handle it? Are there some guides to make real pretty stuff with CSS?
Additionally, is there a way to change IDs to have a given graphic enclose them? Like a small picture that gets colored according to the ID.

>>676
>All posts have their rectangle spread through all the page, from one side to the other
You should be able to do this
>All posts are surrounded by a graphic of some kind, think of it as a colored box with an extra detail at the upper and lower sides
You mean a graphic above and below each post? This might be possible to do, not exactly sure what the best way to do it is, maybe messing with the padding on top and bottom and just having one image for background with graphic on top and bottom (maybe transparent in the middle)
>The very top and very bottom of the page (meaning just below the overboard section but above the manage board section) has a similar graphic
Possibly similar to above, messing with the padding for top/bottom
>Possibly, said graphic should be randomized among a few
You might have to be some kinda magician to make this work without altering the site via admin access

>Additionally, is there a way to change IDs to have a given graphic enclose them?
If you mean the colored poster ID then no, I tried to style that but was unable to, CSS standards aren't at that level (at least not yet, not sure if they will be)

Neutral_037.png
[Hide] (546.3KB, 790x790)

Where do you guys find out the names of the values you want to change?

Like how do you know latestImageCell is called latestImageCell?

Is there a stock css template for this chan I can reference or something?

>>679
Everything's in the HTML. Just inspect element and you'll see what you need to edit.

How do I extract the .css from one of the threads?
Will use it for one of the boards I'll build upon

>>681
Find the post number for the opening post of that thread in the custom CSS fot this board (it will be in square brackets) 

Each thread is styled by the id of the opening post of the thread. So any styling for it will have the post number as id within square brackets in the board CSS. You can just copy those stylings (and disinclude the square bracket id's)

How do you guys test out your css code quickly?

Menu.jpg
[Hide] (75.9KB, 950x249)

>>812
I paste it here like in pic related after accessing it from the "Inspect Element" option in the left-click, visible on Firefox at least.
Changes are automatic, if you don't see a custom tab then you can look for a board that has one, like here.

I click the settings button at the top then go to css and copy paste it into the given field

>>814
I usually test this on /meta/ because it doesn't have any custom css as far as I'm aware

Hey does anyone know how to address the webring pop up window or whatever you'd call it?
t. retard

>>820
If you have javascript enabled, click the rainbow text "The Webring" in the navbar at the top.

Updated the /sw/ CSS: https://pastebin.com/PQp07NP1

>>676
>All posts have their rectangle spread through all the page, from one side to the other
/* Post full width */
.innerPost, .markedPost {
    display: block;
}
 /* Fix image fuckery */
.uploadCell {
    display: inline-block;
}

>>821
Yeah that thing that pops up with all the boards and sites in the ending I wanna make it look different. How do i address, via CSS, that thing that pops up when you click the rainbow webring button at the top of the page?

>>1167
>ending
webring*

webring-button.png
[Hide] (4.1KB, 348x113)

>>1167

webring-table.png
[Hide] (2.8KB, 348x82)

>>1167
>>1169

>>1169
>>1170
Thanks m8 I'll fuck around with this see if I can have some fun

Hi, does someone know if we can change the thumbnail size to something bigger?
Also how to change the CSS theme from specific threads in this board? 
Thanks in advance.

>>1209
Read the meta thread;
>>23
>>258

>>1210
Thank you, will do

>>1210
Very well, i found the thumbnail modifier:
 .uploadCell video,
.uploadCell audio,
.uploadCell img {
  max-width: 100%;
} 
Changing the "100%" with anything under its value works but it doesn't respond at all if using a higher value, say for example 175%. Is it hardcoded?
Also do i have to share the CSS file of the thread i want customized here in /server/? i didn't find that one very clear, just that i should customize via OP post. That post was so close to the end here, should've read more next time lol.

>>1213
It just inserts the thumbnail at a default actual size
You don't change the max-width, but add a new width like so;
.uploadCell img {
  max-width: 100%;
  width: 300px;
}
You can share a CSS file here and state for which thread it should be used for, only the board owner can apply it for all to see on the default CSS, most if not all the threads so far were styled on a whim by the board owner

While I still have a couple small things to do like changing the color of clicked links and making the check boxes not white and turn not blue the CSS I present here is one I'm fairly happy with. 
Without further ado I give you a link to the CSS https://pastebin.com/Vzxgt6VH 
And a link to the board for easy viewing
>>>/fa/

I encourage you to click the raibow The Webring button to see what I believe is the only custom webring pop up thing on any ring-associated lynxchan site. Thanks go out to the anon that pointed me right >>1170
fuck I forgot about the quick reply box I'll do that another time

faggypinkcss.png
[Hide] (1014.9KB, 2600x1415)

>>1249
You don't even have to click a link

>>1249
Nice
and you're welcome

fagypinkcsscomplete.png
[Hide] (1.5MB, 2600x1415)

Final
https://pastebin.com/Ud1d5rhp

>>1250

>>1249
>changing colors of clicked links
I did it first, then reverted to default color (unclicked) when realized it was messy and broke the aesthetic consistency. Just change color on :hover is good.
>changing check box colors
I try to find a way to do that but I'm not sur it can be done through CSS.

So here is my contribution: https://zerobin.net/?95d7835506b1313e#8lQvw0Uhq5GAjQRUZrJiflGVmHn8a/WhEvjTdpcm5M8=
(I'm a newbie at this exercise so code may be quite frankensteinish.
board: >>>/ent/
Still little things to work on but overall, I'm pretty satisfied with it.

>/fa/
Cool board, not even into fashion but I like to lurk there. Will try to share some things I have and post from time to time.

>>1457
Forget, I would like to now a better alternative than imgur and third party websites to host some assets. I tried catbox.moe to host my image background but was quite slow to load and I don't want to hotlink shits from this hobby project and charge his server.
On another chan I use there is a board dedicated for BOs to host all their boards assets. I know anon.cafe is shorter data hosting so I don't know if it would be an option.
I  could also host them locally on my toy server but it's not a good alternative for this moment as it is most of the time turned off and more like a brick than a well greased machine.

>>1458
OK so I learned we can include for example background image in the CSS using a base64 encoded image.
BUT it 's not a good solution if the image is too big. You end up with (in my case) ~30,000 lines of code. My text editor was barely able to run properly.

>>1457
>Just change color on :hover is good.
ya thats what I ended up doing
>contribution
I'll check it out but not now im pretty inebriated so later ok i say over a month after you make that post
>assets
maybe just sagepost your pic on a dead /meta/ thread, if you truly only need one picture, then link it from there. /meta/ is dead as shit and I don't think the mods would really give a fuck if you sageposted a pic on there for your background. Idk I'm just trying to think of an on-site option. I'd suggest maybe an asset thread here on /server/ but I don't want to just invite an imagedump thread, considering thats what I already make becayse im a fuckin retarded fag

>>1484
>asset thread here on /server/
It may be a good idea tbh. Will try this out, in hope it can be helpful for others BO here.
>contribution
The CSS has evolved since this post was made. Simply right-click / inspect on >>>/ent/ to see the actual state of it.

I like lurking on /fa/, sadly it's quite dead. However it's a good board idea, just wish there were more anon using it. I'm not into /fa/ but I try from time to time to post some things.

newt2.jpeg
[Hide] (360.8KB, 693x438)

code_block.png
[Hide] (127.1KB, 723x720)

board_css.png
[Hide] (50KB, 546x482)

Greetings /server/. Necro-bumping this thread but I heard you guys were the CSS pros. I'm the BO over on /agdg/ and I'm trying to improve the CSS inside of code blocks. As of right now, it seems the only difference between code blocks and normal message text is that code gets a monospace font. I'd like to change a couple of things there but have no idea how to go about it. I'd like to give code blocks a different background color from the normal post body and, I'd like to prevent the code block from being broken up by image thumbnails. See pic 1 for how it looks now ("Tomorrow" theme). Shit, right?

The board currently has three options for themes: "board specific css", "yotsuba B", and "tomorrow" (two really, since board-specific and yotsuba appear to be the same). Now, I have the option to upload custom CSS but, I'm afraid of clobbering the existing CSS without having backups of them and, I'd rather change the existing ones if possible. If someone can give me a hand with this I'd appreciate it.

Also at some point in the future I'd like to have language detection and syntax highlighting like over on sleepychan but I assume they're using a JS plugin like highlight.js or similar, and that that is something the web server root would have to install and enable.

>>1578
I'm sorry I've been a bit busy lately
From what I can see you seem to have already changed the font and background of the codeblocks, that's good progress
You can only change the board specific CSS, the other CSS files could only be changed by the site admin and yeah JS is also up to the site admin

>>1579
No worries. Yeah, I cribbed something from /robowaifu/ and added vertical scrolling to support longer code blocks. I think I'll leave it how it is for now, at least until someone complains about the eye-raping green-on-black scheme.

>>1596
green on black for code blocks is the righteous way ; )

>>1615
this. green on black is the truth.

Here's some jschan css templates for spoiler image, loading bar image (.gif works fine), and audio file (in the postform upload box) image. You (board owner) will want to source the images from your assets, though you can test these with any image on the website.

:root {
    --spoiler-img: url(/asset/fBOARDURI/xyz.jpg);
}

.post-file-src[style*='loading'] {
background:url(/asset/BOARDURI/xyz.gif) no-repeat center;
    background-size:150px
}

.upload-thumb[src$='/file/audio.png'] {
  display:block;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
  padding-left:50px;
  background:url('/asset/BOARDURI/xyz.png');
  background-size:cover;
  background-repeat:no-repeat;
}

>>1817
Neat! Thanks for the tips, Anon!  :)
Merry Christmas, /server/