sarken: anderson cooper in oscar the grouch's trash can ([pundits] ac for gnn)
[personal profile] sarken posting in [community profile] ao3_skins
This is a simple add-on skin that recreates my previous skin for the archive's updated skin system. It was made rather quickly and thus doesn't contain the detailed comments that gave the original its name. It uses the show all of a user's fandoms tweak, inspired by [personal profile] mumblemutter.

On my Mac, it works equally well in Firefox 8 and Safari 5 (and thus likely works on Chrome as well). A few tweaks will get it looking good in Opera 11. If you follow the directions and use the handheld sheet, it's also ready for the mobile version of Safari, and possibly other mobile browsers.

Preview images of the dashboard and work views are under the cut, and you can click them for the full-sized versions.



Preview of Describe skin in dashboard view

Preview of Describe skin in work view

Describe - All


Describe - Handheld


Disclaimer: This might not be the fastest or best way to create a skin like this, but it was the first way that worked after multiple attempts, so I decided to leave it here. You might be able to make it work just by setting the all media skin as the parent of the handheld skin, but with how finicky the latter was about updating, I couldn't be certain.

1. On the My Site Skins page, click Create Skin.

2. On the Create New Archive Skin page, make sure "Type" is set to "Site Skin."

3. Enter a title, like "Describe - All Media." You might also want to include a description such as "All media overrides for Describe skin."

4. Paste the Describe - All Media code from above into the field named CSS.

5. Click the "Show" button next to "Advanced." You shouldn't have to change anything here, but the "What it does" settings should be "add on to archive skin" and the "Media" settings should be "all."

6. Click Submit.

7. If all goes well, you will be taken to a page with a "Skin was successfully created" message above the title, description, and code. You will still be seeing the site in its regular skin.

8. Now click the Create Skin button that's on that page.

9. On the Create New Archive Skin page, again make sure "Type" is "Site Skin."

10. Enter a title for this skin, like "Describe - Handheld." You might also want to include a description such as "Handheld overrides for Describe skin."

11. Paste the Describe - Handheld code from above into the field named CSS.

12. Click the "Show" button next to "Advanced." This time, the "What it does" settings should still be "add on to archive skin," but the "Media" settings should be "only screen and (max-width: 480px)."

13. Click Submit.

14. If all goes well, you will again be taken to a page with a "Skin was successfully created" message above the title, description, and code. You will still be seeing the site in its regular skin.

15. Click on the Create Skin button that's on that page.

16. On the Create New Archive Skin page, make sure "Type" is set to "Site Skin."

17. Enter a title, like "Describe." You might also want to include a description such as "Combines screen and handheld."

18. Don't paste anything into the CSS.

19. Click the "Show" button next to "Advanced." The "What it does" settings should still be "add on to archive skin," and the "Media" settings should be "all."

20. Now click "Add parent skin."

21. For "Parent #1," start typing the title of your first skin -- "Describe - All Media" -- and then select if from the autocomplete menu that shows up.

22. Click "Add parent skin" again.

23. For "Parent #2," start typing the title of your second skin -- "Describe - Handheld" -- and select it from the autocomplete menu.

24. Click Submit.

25. If all goes well, you will again be taken to a page with a "Skin was successfully created" message above the title, description, and list of the two parent skins. You will still be seeing the site in its regular skin.

26. Click Use, which is in the lower navigation menu.

27. The site skin will change and the blue box at the top will now say "Your preferences were successfully updated."

Feel free to modify this skin however you like. If you do something cool with it, even just another color scheme, I'd love to see it. I will endeavor to keep this updated as changes are made to the archive. If you notice something broken, just holler. (The child selectors on h3.heading links are broken, but should work fine once the parser is fixed.)

Updated 28 March 2012: Overrode link hover color in footer, made user name link in header visible, added background color to indexes on edit multiple works page.

Updated 8 February 2016: Updated to make the main navigation more closely resemble the image, and to fix some default colors that were showing through.

Updated 26 March 2016: Updated to restore the link styling in some places.
From:
Anonymous( )Anonymous This account has disabled anonymous posting.
OpenID( )OpenID You can comment on this post while signed in with an account from many other sites, once you have confirmed your email address. Sign in using OpenID.
User
Account name:
Password:
If you don't have an account you can create one now.
Subject:
HTML doesn't work in the subject.

Message:

 
Notice: This account is set to log the IP addresses of everyone who comments.
Links will be displayed as unclickable URLs to help prevent spam.

Profile

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

May 2017

S M T W T F S
 123456
78910111213
14151617181920
2122 2324252627
28293031   

Most Popular Tags

Style Credit

Expand Cut Tags

No cut tags
Page generated Jun. 24th, 2017 08:40 am
Powered by Dreamwidth Studios