invalid Improvements / bugfixes to the forum (I wrote the CSS code)

[SwiftSmoky 8,445]

I created a browser extension to test the forum with these changes and it works great :)

 

images going out of the border of quotes and spoilers

 

Open the spoiler and look at the right edge, the image sticks out of the border.

 

 

 

 

 

To fix this, add the following class:

.

.ipsBlockquote img.bbc_img, .bbc_spoiler_wrapper img.bbc_img{
    max-width: 100% !important;
}

.

Glitchy/slow scrolling in Safari in the likes list

 

Using Safari browser open any post with lots of likes, click on the "and X others" link to see the full list of people who liked, scroll down using the touch pad. The scrolling is slow and looks like very low fps, very annoying.

 

To fix this, delete these 2 lines from the ".popupInner" class in the file "public/style_css/css_5/ipb_styles.css":

 

overflow: auto;
overflow-x: hidden;

.

These properties already exist in another class so duplicating them on 2 different elements one inside the other causes this problem.

 

Better looking spoilers

 

The spoilers now are really ugly, my code makes them look better and adds a quick fade-in effect when the spoiler is opened:

 

 

In the file: "/public/style_css/css_5/ipb_common.css"

 

input.bbc_spoiler_show[value="Hide"] ~ .bbc_spoiler_wrapper{
border-width: 2px;
}
@keyframes kf_spoilerShown {
    from {opacity: 0}
    to {opacity: 1}
}
@-webkit-keyframes kf_spoilerShown {
    from {opacity: 0;}
    to {opacity: 1;}
}
input.bbc_spoiler_show[value="Hide"] ~ .bbc_spoiler_wrapper .bbc_spoiler_content{
animation-name: kf_spoilerShown;
animation-duration: 0.5s;
-webkit-animation-name: kf_spoilerShown;
-webkit-animation-duration: 0.5s;
}
 
/* EDIT EXISTING CLASSES: */
 
div.bbc_spoiler_wrapper{
border: 1px solid #555;
background-color: #222;
padding: 4px;
margin-top: 5px;
margin-bottom: 5px;
transition: background-color 0.5s;
}
 
input.bbc_spoiler_show{
width: 55px;
font-size: .9em;
padding: 3px;
color: #ddd;
border: 2px solid rgba(170, 170, 170, 0.75);
border-radius: 15px;
cursor: pointer;
font: 900 12px/1.2 helvetica, verdana, arial, sans-serif;
background: linear-gradient(to bottom, rgba(117, 117, 117, 0.81) 0%, rgba(112, 112, 112, 0.8) 10%, rgba(107, 107, 107, 0.8) 13%, rgba(96, 96, 96, 0.79) 26%, rgba(80, 80, 80, 0.78) 39%, rgba(76, 76, 76, 0.77) 42%, rgba(74, 74, 74, 0.77) 45%, rgba(68, 68, 68, 0.76) 48%, rgba(29, 29, 29, 0.72) 52%, rgba(20, 20, 20, 0.72) 65%, rgba(18, 18, 18, 0.72) 68%, rgba(17, 17, 17, 0.72) 74%, rgba(22, 22, 22, 0.72) 81%, rgba(28, 28, 28, 0.72) 84%, rgba(46, 46, 46, 0.74) 90%, rgba(71, 71, 71, 0.77) 97%, rgba(86, 86, 86, 0.78) 100%);
}

[Hate 5,582]

Under review

[akiket 402]

Like a boss.

[ThirdOnion 4,898]

The image in spoiler function looks very useful. Impressed!

[r_Issimo2 1,495]

I don't like the spoiler idea. Sorry. The other idea is good.

[maryam98 1,171]

that's some cool CSS- I like the new spoilers.

[lukey0 27,543]

I like those changes, the spoiler looks nice and would be easier to click than the current one. 

[Nine 693]

WEEe pro

[maryam98 1,171]

How did you put the code into your browser or whatever you use?

[Re-old-railgun 81]

Not bad .

 

 

But I think the I&s section should be suspended until the sleepy devs finish the MM system and mobile vers and the new re_balance which contain railgun buff of corurse .

 

 

 

Thank u all.

[RevengeAttacker 217]

Gj

[X-Toxical 174]

We know you’re the smartest boi alive, Swift :)

[need.higher.rank 3,491]

Maybe new outlook for Forum? This one is kinda boring :/ 

[Maf 32,326]

The work gone into this idea is much appreciated, but I'm afraid there was no one available to work on implementing it at the time, and now it is no longer applicable. Hopefully most of the glitches mentioned here have been fixed in this newer forum engine.

 

Idea invalid. Closed.