Seriously loving the theme The main landing page is actually really readable that way imho (seriously !)
It may sound dumb but the slant somewhat helps navigating long thread lists too, as it gives an implicit anchor to each line. Makes it easy to tell how far down the page one is, it's actually pretty cool. But maybe that's because I am viewing this on a vertical monitor....
How would one control the color of text in posts, and the color of text in the reply box ?
NVM, ended up simply applying it to the landing page and a few subforum sections, leaving individual threads as normal. Works great that way
Replies
The entire forum is swinging back and forth, and changing colours.
Bugga, my laptop musta broke the site
Happy B day poly boyz.
I need to go apologize to my doc for the email i sent him!
The CSS from this years' birthday, if anyone prefers colorcycling pastel angled goodness:
/* APRIL FIRST 2019 */
/*Invert all */
body
{
-webkit-filter: invert(100%) hue-rotate(180deg);
-moz-filter: invert(100%) hue-rotate(180deg);
-ms-filter: invert(100%) hue-rotate(180deg);
-o-filter: invert(100%) hue-rotate(180deg);
filter: invert(100%) hue-rotate(180deg);
}
/* Reverse-invert images & embeds */
a.banner-image,img,iframe,.VideoPreview a,.DataTable>tbody>tr>td
{
-webkit-filter: invert(100%) hue-rotate(-180deg);
-moz-filter: invert(100%) hue-rotate(-180deg);
-ms-filter: invert(100%) hue-rotate(-180deg);
-o-filter: invert(100%) hue-rotate(-180deg);
filter: invert(100%) hue-rotate(-180deg);
}
/* Re-invert again all profile pics, and embed previews */
div.PhotoWrap,div.PhotoWrapSmall,div.Author-Photo,div.Author-Card,div.vp-preview vp-preview-cover,meta.image,
{
-webkit-filter: invert(100%) hue-rotate(-180deg);
-moz-filter: invert(100%) hue-rotate(-180deg);
-ms-filter: invert(100%) hue-rotate(-180deg);
-o-filter: invert(100%) hue-rotate(-180deg);
filter: invert(100%) hue-rotate(-180deg);
}
/* Invert more profile pics */
img.ProfilePhoto,img.ProfilePhotoMedium,.PhotoWrapLarge>img,div.Block Wrap>a.AuthorLink>div.PhotoWrap PhotoWrapSmall,div.Author-Photo,div.Item-Inner>div.Item-Aside>div.Author-Card>a.PhotoWrap PhotoWrapLarge>img.ProfilePhoto ProfilePhotoLarge
{
-webkit-filter: invert(100%) hue-rotate(180deg);
-moz-filter: invert(100%) hue-rotate(180deg);
-ms-filter: invert(100%) hue-rotate(180deg);
-o-filter: invert(100%) hue-rotate(180deg);
filter: invert(100%) hue-rotate(180deg);
}
/* Header top edge appears when site is rotated */
.navbar {
border-top: solid 5px;
border-color: #900089;
}
/* Easier to see breadcrumb navigation */
.Breadcrumbs,.Breadcrumbs a,.Last a,.DataTable>thead>tr>td {
color: #88be95;
}
/* Rotate the whole shebang */
body {
transform: rotate(-0.008turn);
transform-origin: top;
}
/* Animate the pastels */
body {
color:#b600ff;
animation: colorchange 60s;
animation-iteration-count: infinite;
-webkit-animation: colorchange 60s; /* Chrome and Safari */
-webkit-animation-iteration-count: infinite;
}
@keyframes colorchange
{
0% {background-color: #FFDFDF;}
10% {background-color: #FFCAF9;}
20% {background-color: #DDCEFF;}
30% {background-color: #BAD0EF;}
40% {background-color: #A5DBEB;}
50% {background-color: #BDFFEA;}
60% {background-color: #CAFFD8;}
70% {background-color: #DDFED1;}
80% {background-color: #FFFFC8;}
90% {background-color: #FFD7B3;}
100% {background-color: #FFDFDF;}
}
@-webkit-keyframes colorchange /* Safari and Chrome - necessary duplicate */
{
0% {background-color: #FFDFDF;}
10% {background-color: #FFCAF9;}
20% {background-color: #DDCEFF;}
30% {background-color: #BAD0EF;}
40% {background-color: #A5DBEB;}
50% {background-color: #BDFFEA;}
60% {background-color: #CAFFD8;}
70% {background-color: #DDFED1;}
80% {background-color: #FFFFC8;}
90% {background-color: #FFD7B3;}
100% {background-color: #FFDFDF;}
}
/* Also animate the thread list, but offset the colors */
.DataTable>tbody>tr>td {
animation: coloralternate 60s;
animation-iteration-count: infinite;
-webkit-animation: coloralternate 60s; /* Chrome and Safari */
-webkit-animation-iteration-count: infinite;
}
@keyframes coloralternate
{
0% {background-color: #CAFFD8;}
10% {background-color: #DDFED1;}
20% {background-color: #FFFFC8;}
30% {background-color: #FFD7B3;}
40% {background-color: #FFDFDF;}
50% {background-color: #FFDFDF;}
60% {background-color: #FFCAF9;}
70% {background-color: #DDCEFF;}
80% {background-color: #BAD0EF;}
90% {background-color: #A5DBEB;}
100% {background-color: #BDFFEA;}
}
@-webkit-keyframes coloralternate /* Safari and Chrome - necessary duplicate */
{
0% {background-color: #CAFFD8;}
10% {background-color: #DDFED1;}
20% {background-color: #FFFFC8;}
30% {background-color: #FFD7B3;}
40% {background-color: #FFDFDF;}
50% {background-color: #FFDFDF;}
60% {background-color: #FFCAF9;}
70% {background-color: #DDCEFF;}
80% {background-color: #BAD0EF;}
90% {background-color: #A5DBEB;}
100% {background-color: #BDFFEA;}
}
/* Push the footer down to show Reply buttons! */
.sticky-footer {
bottom: -100px;
}
And if you must... you can get this boat rollin' again...
<a rel="nofollow" href="https://polycount.com/profile/keyframes">@keyframes</a> colorchange<br>
{<br>
0% {transform: rotate(-0.008turn);background-color: #FFDFDF;}<br>
10% {transform: rotate(-0.005turn);background-color: #FFCAF9;}<br>
20% {transform: rotate(-0.002turn);background-color: #DDCEFF;}<br>
30% {transform: rotate(0.000turn);background-color: #BAD0EF;}<br>
40% {transform: rotate(0.002turn);background-color: #A5DBEB;}<br>
50% {transform: rotate(0.004turn);background-color: #BDFFEA;}<br>
60% {transform: rotate(0.002turn);background-color: #CAFFD8;}<br>
70% {transform: rotate(0.000turn);background-color: #DDFED1;}<br>
80% {transform: rotate(-0.002turn);background-color: #FFFFC8;}<br>
90% {transform: rotate(-0.005turn);background-color: #FFD7B3;}<br>
100% {transform: rotate(-0.008turn);background-color: #FFDFDF;}<br>
}
Which looked like this: http://wiki.polycount.com/w/images/d/d6/PolycountForums2017-04-01.jpg
It may sound dumb but the slant somewhat helps navigating long thread lists too, as it gives an implicit anchor to each line. Makes it easy to tell how far down the page one is, it's actually pretty cool. But maybe that's because I am viewing this on a vertical monitor....
How would one control the color of text in posts, and the color of text in the reply box ?
NVM, ended up simply applying it to the landing page and a few subforum sections, leaving individual threads as normal. Works great that way
http://wiki.polycount.com/wiki/Polycount:About#Forum_Snapshots
Thank you for being you.