Actions

Work Header

Rating:
Archive Warning:
Fandom:
Additional Tags:
Language:
English
Collections:
A Guide to Coding and Fanworks, Fanfiction Reference Works, Unconventional Fanwork and Social Media Skins, HTML & CSS stuffs
Stats:
Published:
2020-05-10
Completed:
2020-05-10
Words:
1,545
Chapters:
3/3
Comments:
16
Kudos:
243
Bookmarks:
271
Hits:
9,569

AO3 Work Skin for In-Universe Investigative/Mission Report With Redaction

Summary:

This work provides the CSS and HTML necessary to make a fanfiction look like an investigative report or mission report, suitable for a variety of fandoms and purposes.

Notes:

This work skin originally created for the Dreaming of Sunshine fic Gotta Hand It To You (FILE ID: I-K-63-FEB-IN204), which was written for the gift exchange Unconventional Fanworks! It should hopefully work well for small screens/on mobile (at least, I haven't gotten any complaints?) and some effort has been made to make sure the work is legible without the AO3 skin enabled, but if you use it you should probably let readers know that they should view it with the work skin on.

(See the end of the work for more notes and other works inspired by this one.)

Chapter 1: Example Fanwork

Summary:

This is a live example of what it looks like when you use this work skin and accompanying HTML! With lots of lorem ipsum (placeholder text) so you can see what everything looks like without having to go read my actual fic.

Chapter Text


CAPTAIN: JOHN DOE
EMPLOYEE ID: 123456
FILE ID: Fake Report As Example of Work Skin Usage


SOME OFFICE
DEPARTMENT OF WHATEVER
FOR SECURITY LEVEL 6 OR HIGHER


I. INTRODUCTION

  1. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  2. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  3. Example of a normal link and also a link that's also a file name because I used that a lot.
  4. Lorem ipsum dolor sit amet, consectetur adipiscing elit, and the following items:
    —     List-within-a-list item 1
    —     List-within-a-list item 2
    —     List-within-a-list item 3
  5. Lorem ipsum dolor sit amet, ███████████ adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad █████ ██████, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. █████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████.

II. YOU CAN JUST CONTINUE THE LIST

  1. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  2. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
  3. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

III. MAYBE YOU DON'T WANT A LIST ACTUALLY

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.