Clean legible and light style for a03
Archiveofourown modern by kem
Details
Authorkem
LicenseNo License
Categoryarchiveofourown
Created
Updated
Size12 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Userstyle doesn't have notes.Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name archiveofourown.org/works/7196198
@namespace github.com/openstyles/stylus
@version 1.0.0
@description A new userstyle
@author Me
==/UserStyle== */
@-moz-document url-prefix("https://archiveofourown.org/") {
/* Insert code here... */
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Aleo:ital,wght@0,100..900;1,100..900&display=swap');
/*primary #942647
offwhite:#F7FAFB
#F5F8FA
gray-lighter #D2DAE2
gray-light: #8091a1
gray med: #506475
gray dark:#374755;
*/
body,
html {
font-family: "Lato", sans-serif !important;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
line-height: 1.4;
color: #374755;
}
h1,
h2,
h3,
h4,
h5,
h6,
.heading {
font-family: Aleo, serif;
font-weight: 400;
word-wrap: break-word;
margin-bottom: 1em;
}
h2.heading {
font-weight: 300;
font-size: 2.2em;
}
h3.heading {
font-size: 1.5em;
}
h4.heading {
font-weight: 400;
font-size: 1.3em;
}
blockquote,
pre {
font-family: inherit !important
}
.notice,
.comment_notice,
.kudos_notice,
ul.notes,
.caution,
.error,
.comment_error,
.kudos_error,
.alert.flash {
background: #e9f2fa;
margin: 0 auto 1em auto;
padding: 1em;
clear: right;
box-shadow: none;
border-radius: 12px;
overflow: hidden;
}
input[type = "text"],
input.text,
#header #search .text,
select,
form.search input[type = text] {
border: 1px solid #506475;
background: white;
border-radius: 8px;
padding: .5em;
}
input[type = "submit"],
input.button,
.navigation .actions a,
.submit .actions a,
a#hide-first-login-help,
.actions a,
.actions a:link,
.action,
.action:link,
.actions input,
input[type = submit],
button,
.current,
.actions label {
border-radius: 8px !important;
display: inline-block;
border: 1px solid #D2DAE2;
background: #F7FAFB;
padding: .5em 1em !important;
box-shadow: 0px 3px 2px rgba(55, 71, 85, 0.06), 0px 2px 1px rgba(55, 71, 85, 0.04), 0px 1px 0.5px rgba(55, 71, 85, 0.03);
}
input[type = "submit"]:hover,
input.button:hover,
.actions a:hover {
color: #942647;
border: 1px solid #D2DAE2;
background: #Fff;
box-shadow: inherit;
}
.submit .button,
.submit input[type = "submit"],
p.submit input {
background: #942647;
color: white;
}
form.verbose legend,
.verbose form legend {
font-family: Aleo, serif;
font-size: 1.6em;
background: #fff;
border: 0;
padding: .5em .5em 0;
box-shadow: none;
}
.landmark {
margin: 0 !important;
}
/*:::::::::HEADER & NAV::::::::::::*/
#header {
background: #FFF;
box-shadow: 0px 9px 60px rgba(0, 0, 0, 0.05), 0px 3.75998px 25.0666px rgba(0, 0, 0, 0.0359427), 0px 2.01027px 13.4018px rgba(0, 0, 0, 0.0298054), 0px 1.12694px 7.51293px rgba(0, 0, 0, 0.025), 0px 0.598509px 3.99006px rgba(0, 0, 0, 0.0201946), 0px 0.249053px 1.66035px rgba(0, 0, 0, 0.0140573);
}
#header .heading a {
color: #942647;
font-size: 1.6em;
line-height: 1.7em;
}
#header .heading a span {
padding-left: .5em;
}
#greeting {
padding-top: .25em;
}
#greeting li a {
font-size: .8em;
color: #506475;
}
#greeting li a:hover {
font-size: .8em;
color: #506475;
}
#header .menu,
#small_login {
display: none;
padding: .25em 0;
position: absolute;
width: 16em;
z-index: 55;
box-shadow: 0px 9px 60px rgba(0, 0, 0, 0.05), 0px 3.75998px 25.0666px rgba(0, 0, 0, 0.0359427), 0px 2.01027px 13.4018px rgba(0, 0, 0, 0.0298054), 0px 1.12694px 7.51293px rgba(0, 0, 0, 0.025), 0px 0.598509px 3.99006px rgba(0, 0, 0, 0.0201946), 0px 0.249053px 1.66035px rgba(0, 0, 0, 0.0140573);
background: white;
filter: none;
border-radius: 0 0 8px 8px;
}
#header .menu li {
border-bottom: 1px solid #D2DAE2;
margin: .25em .25em;
text-align: left;
}
#header .user a,
#small_login .action {
padding: .25em .5em
}
#header .actions a:hover,
#header .actions a:focus,
#header .dropdown:hover a,
#header .open a {
background: #F7FAFB;
border-radius: 4px;
color: #942647;
}
.actions a,
.actions a:link,
.action,
.action:link.current,
.actions label {
background: white;
color: #506475;
width: auto;
font-size: 100%;
line-height: 1.286;
vertical-align: middle;
display: inline-block;
padding: .25em .75em;
white-space: nowrap;
overflow: visible;
position: relative;
text-decoration: none;
border-radius: .8px;
/* outline:1px solid red;*/
}
.dropdown a,
.dropdown-menu a {
font-size: .9em;
background: blue;
}
#header .dropdown .menu a {
background: none;
}
#header .menu li {
border: 0;
margin: 0 .25em;
text-align: left
}
#header .dropdown .menu a:hover,
#header .dropdown .menu a:focus {
background: #F5F8FA;
color: #942647;
}
.dropdown a:hover {
background: blue;
}
#header .primary {
background: none;
padding: 0 0 .5em 0;
width: 100%;
box-shadow: none;
}
#header .primary a {
padding: .75em;
}
#header .primary li.dropdown {
padding-top: .5em;
}
#header .primary a {
color: inherit
}
#header .primary .menu a {
color: #506475;
padding: .75em .5em .5em
}
.secondary {
border: none;
}
#header .search {
float: right;
color: #506475;
;
margin-right: .25em
}
/*#######LISTING########*/
li.blurb,
fieldset,
form dl,
.work.meta,
.meta {
border: 1px solid #D2DAE2;
padding: 2em;
border-radius: 12px;
box-shadow: 0px 2.01027px 13.4018px rgba(0, 0, 0, 0.0298054), 0px 1.12694px 7.51293px rgba(0, 0, 0, 0.025), 0px 0.598509px 3.99006px rgba(0, 0, 0, 0.0201946), 0px 0.249053px 1.66035px rgba(0, 0, 0, 0.0140573);
}
.blurb h4 a:link,
.blurb h4 img {
color: #942647;
vertical-align: bottom
}
.blurb h4 a:last-child {
color: #333
}
.wrapper {
box-shadow: none;
}
a.tag {
font-size: .9em;
display: inline-block;
padding: .2em .8em;
border: 1px solid #D2DAE2;
border-radius: 16px;
background-color: #F5F8FA;
margin-bottom: 4px;
}
.fandoms a.tag {
font-size: 1em;
font-weight: bold;
background-color: #F8DFDD;
border-color: #F0B7B8;
}
.tags li:after {
content: none !important;
}
.header .heading a:first-child {
font-size: 1.5em;
display: block;
padding-bottom: .25em;
border: 0;
color: #942647
}
.reading h4.viewed {
background: none;
font-size: 1em;
text-align: center;
font-style: italic;
color: #8091a1;
}
mods li,
dl.stats dt,
dl.stats dd {
background: 0 0;
display: inline-block;
clear: none;
float: none;
margin: 0 auto;
padding: .25em;
}
dl.stats {
text-align: center;
background: #F5F8FA;
margin-top: .643em;
box-shadow: none;
width: 100%;
border-radius: 12px;
padding: .25em;
}
dl.stats dt {
font-weight: bold;
text-transform: uppercase;
font-size: .85em;
line-height: 1.6;
}
.meta dt {
min-width: 10.5em;
width: 18%;
font-weight: bold;
margin-left: 1%;
}
.meta dd {
width: 80%;
}
div.preface {
margin: 4em 3em 1.5em 3em;
padding: 0;
}
.preface h2 {
margin-bottom: .5em !important;
}
.notes .heading {
font-size: 1.2em;
padding: .25em 0;
border-bottom-color: #D2DAE2
}
.bio {
max-width: 700px;
font-size: 18px;
}
#workskin {
max-width: 700px;
padding-left: 2%;
padding-right: 2%;
font-size: 18px;
font-optical-sizing: auto;
font-weight: 400;
line-height: 1.5em;
}
#workskin p {
line-height: 1.8em;
}
fieldset,
form dl,
fieldset dl dl,
fieldset fieldset fieldset,
fieldset fieldset dl dl,
dd.hideme,
form blockquote.userstuff {
display: block;
background: #fff;
border: none;
margin: .643em;
padding: 2em;
box-shadow: none;
border-radius: 12px;
}
.filters fieldset {
padding: .0em;
}
.autocomplete input,
.autocomplete .dropdown ul li {
min-width: 5em;
width: 100%;
}
#dashboard.own {
background: 0 0;
border: 1px solid #D2DAE2;
border-radius: 16px;
}
#dashboard ul {
padding: 0 !important;
border: 0;
}
#dashboard a,
#dashboard span {
color: inherit;
height: auto;
line-height: 2;
padding: .12em .25em !important;
}
#dashboard .current {
background: #FBF4F4...