cesy: "Cesy" - An old-fashioned quill and ink (Default)
[personal profile] cesy posting in [community profile] ao3_skins
To use these, just paste the relevant code below into the "Custom CSS" box. I've tested them all in Firefox 3.6, but not in any other browsers - please let me know if they don't work for you.

Subtle-for-work:

.logo {display: none;}
body {background: white;}
#header {background: none white;}
#greeting, #login {background: none black;}
.icon {display: none;}
h2 {font-size: 1em;}
h1 {font-size: 1em;}


Larger greeting: (Enigel has an alternative version of this.)

#greeting, #login-block {font-size: 1em;}


Sidebar-to-topbar:

#dashboard ul {float: none; width: auto;}
#dashboard ul li {display: inline; border-right: 1px solid black; border-left: 1px solid black;}
#dashboard a, #dashboard span {display: inline;}
#main.sidebar {margin-left: 1em;}


White-on-black: (Amy has a better version in the comments.)

body {background: black; color: white;}
.navigation a, a:link {color: #666666;}
a, a:link {color: #666666;}


Narrow margins:
(To edit this to a different width, change either "1%" to something different - they add together to give the total gap.)

#chapters {
margin: auto 1% 2.5em;
padding: 0.5em 1% 0;
}


Font change:
(Just copy and edit this to make it whatever font you want to use.)

{ font-family: "Helvetica" !important; }


Background colour change:
(For common colours, you can just type the name; for in between colours, you can use hex codes, e.g. #ccccff will give a pale blue.)

body {background-color: red;}


Font size change:
(If you want to make it just apply to the stories, not the headings, use "#chapters" instead of "body".)

body {font-size: 150%;}


Spread out works blurb:
(This makes it look slightly more like the old style, for people who didn't like the new style of story details.)

#main ul.tags li.relationships, .blurb ul li.relationships, 
#main ul.tags li.characters, .blurb ul li.characters, 
#main ul.tags li.freeforms, .blurb ul li.freeforms {display: block;}

White on Black theme.

Date: 2010-08-24 10:34 am (UTC)
onceamy: Nothing special; just a pixelated rainbow. (Default)
From: [personal profile] onceamy
I think I've made it nice and accessible:



#header {background: black; colour: black; }

body {background: black; color: white;}
.open-beta-box h1, h2, p, a {color: white; }
.navigation a, a:link {color: #666666;}
a, a:link {color: #666666;}
.notice, .comment-notice { color: #df683f;}
.byline {color: #666666; }
#main dl.meta {color: #666666; background: black; }
.stats dt, dd {color: #666666; }
.navigation {background: black; }
.filters legend {color: #666666; }
#work-form fieldset.meta {background: black;}
#work-form fieldset {background: black;}
form.filters {background: black; }
form.filters dt {background: black; }
.own {background: black; }
Edited Date: 2010-08-24 10:43 am (UTC)

Date: 2010-09-13 05:23 am (UTC)
jeshyr: Pile of thick books labelled "Geek" (Geek)
From: [personal profile] jeshyr
Thanks for these examples, Cesy, they really helped me to figure out where to start.

Where should I make a feature request for the skins? I see you have a limited range of fonts allowed, I'm not sure why (for private skins, should it matter at all?) but there's a font specifically designed for low-vision use that I use myself it's called APHont and is available free for low-vision users. It's not by default installed on either PC or Mac (although I think it should be!) but it's WAY easier to read than other sans-serif fonts for me as all the hard-to-see bits are exaggerated. Info is here: http://www.aph.org/products/aphont.html

So I'd like to have APHont added to the range of available fonts - if I put it in a font family it'll just get skipped if the person doesn't have it so nobody gets hurt.

Am having fun with this - I'll apply to make my own low-vision-friendly AO3 skin made public when I'm done with it :)

Profile

ao3_skins: OTW logo with text "Emerging" (Default)
AO3 Skins

December 2024

S M T W T F S
1234567
891011121314
15161718192021
22 232425262728
293031    

Most Popular Tags

Style Credit

Expand Cut Tags

No cut tags
Page generated Jun. 5th, 2025 03:35 am
Powered by Dreamwidth Studios