Work Text:
1. Some screenshots
(click on the picture to open the full size)
Main
Profile
Footer
Filters
Forms
Works
Comments/Kudos
Collections
Own works
2. CSS code
Code
(take from github)
#header,
#inner.wrapper {
margin: 0px 50px;
}
#header h1 sup,
#header .button,
#header .logo {
display: none;
}
#main,
#inner,
body,
th,
tr:hover,
col.name,
form blockquote.userstuff,
fieldset fieldset,
fieldset dl dl,
input:focus,
select:focus,
textarea:focus,
.autocomplete div.dropdown ul,
#ui-datepicker-div,
#ibox_wrapper,
#ibox_content,
.toggled form,
.dynamic form,
.secondary,
.listbox .index,
.dashboard .listbox .index,
.nomination dt {
background: #fdf9e9;
}
#footer {
background: #E3D9C0 url("https://ic.pics.livejournal.com/nika_diz/25734443/187547/187547_original.jpg") repeat;
}
#outer.wrapper {
padding-top: 350px;
background-color: #E3D9C0;
background-image: url("https://ic.pics.livejournal.com/nika_diz/25734443/155475/155475_original.png"), url("https://ic.pics.livejournal.com/nika_diz/25734443/187547/187547_original.jpg");
background-repeat: no-repeat, repeat;
background-position: center 40px, left top;
background-size: auto 310px, auto;
}
#footer {
float: none;
border: none;
}
#footer h4,
#footer .menu {
color: #fff !important;
background: #b84f38;
border: 2px solid #FFFEE7;
padding-left: 5px;
}
#footer a {
color: #fff !important;
}
#header {
background: #b84f38;
border-top: 2px solid #7c0100;
border-left: 2px solid #7c0100;
border-right: 2px solid #7c0100;
border-top-left-radius: 30px;
border-top-right-radius: 30px;
}
#inner.wrapper {
border-bottom: 2px solid #7c0100;
border-left: 2px solid #7c0100;
border-right: 2px solid #7c0100;
border-bottom-left-radius: 30px;
border-bottom-right-radius: 30px;
overflow: hidden;
}
#header .heading {
height: 35px;
background: none;
}
#header .primary {
background: #fdf9e9;
height: 40px;
box-shadow: none;
position: absolute;
top: -350px;
border-radius: 30px;
border: 2px solid #7c0100;
}
#header h1 span {
margin-left: 38%;
color: #fdf9e9;
text-shadow: 0.5px 0.5px 0.5px black;
position: absolute;
top: -190px;
}
#header #search .text {
margin-top: 8px;
width: 80%;
}
#greeting .icon img {
box-shadow: none;
border-radius: 50%;
height: 30px;
width: 30px;
}
#greeting {
background: none;
height: 40px;
float: left;
}
#greeting .menu {
left: 0;
}
#greeting li,
#greeting li a {
color: #fff !important;
}
#header .primary li a {
color: #000 !important;
}
.splash .module h3 {
border-bottom: 2px solid #7c0100;
}
.splash .news li {
border-bottom: 1px dashed #7c0100;
}
#header .dropdown .menu,
#greeting .dropdown .menu {
border: 1px solid #7c0100;
}
#greeting .dropdown:hover a,
#header .dropdown:hover a {
background: #E3D9C0 !important;
color: #000 !important;
}
#header .dropdown .menu,
#greeting .dropdown .menu,
#header .dropdown .menu a,
#greeting .dropdown .menu a {
background: #E3D9C0 !important;
color: #000 !important;
font-style: normal;
font-weight: normal;
text-transform: none;
}
#header .user a:hover,
#header .user a:focus,
#header .user .current,
#header .dropdown .menu a:hover,
#header .dropdown .menu a:focus,
#greeting .dropdown .menu a:hover,
#greeting .dropdown .menu a:focus {
background: #FFFEE7 !important;
color: #000 !important;
font-style: normal;
font-weight: normal;
text-transform: none;
}
#dashboard,
#dashboard.own {
background: #E3D9C0 !important;
color: #4c3c36 !important;
}
#dashboard a:hover,
#dashboard .current {
background: #FFFEE7 !important;
color: #000;
}
.statistics .index li:nth-of-type(even),
.splash .favorite li:nth-of-type(odd) a {
background: #E3D9C0;
}
tbody tr,
thead td,
#header #small_login,
fieldset,
form dl,
fieldset dl dl,
fieldset fieldset fieldset,
fieldset fieldset dl dl,
dd.hideme,
form blockquote.userstuff,
form dt,
.actions a:active,
.current,
a.current,
.current a:visited,
.search span.tip,
.listbox,
fieldset fieldset.listbox,
#header ul.primary .current {
border-color: #7c0100;
}
#dashboard,
#dashboard.own,
.error,
.comment_error,
.kudos_error,
#header ul.primary,
.LV_invalid,
.LV_invalid_field,
input.LV_invalid_field:hover,
input.LV_invalid_field:active,
textarea.LV_invalid_field:hover,
textarea.LV_invalid_field:active,
#header .primary a,
#header .primary .current,
#header .primary input,
#header .search input {
border-color: #7c0100 !important;
}
#main .verbose legend,
.verbose fieldset,
ul.notes,
#modal,
.ui-sortable li,
.required .autocomplete,
.autocomplete .notice,
.system .intro,
.flash,
.alert.flash,
div.dynamic,
#ui-datepicker-div,
.ui-datepicker table {
background: #E3D9C0;
border: 2px solid #7c0100;
}
.notice {
background: #b84f38;
border: 2px solid #7c0100;
color: #fff;
}
.notice a {
color: #fff !important;
}
.flash {
border: none;
}
h2 {
font-size: 1.286em;
line-height: 1;
margin: 0.5375em 0;
}
.listbox,
fieldset fieldset.listbox,
fieldset,
form dl,
fieldset dl dl,
fieldset fieldset fieldset,
fieldset fieldset dl dl,
dd.hideme,
.dynamic form fieldset,
.toggled form fieldset,
.toggled form dl,
.secondary .toggled form,
form blockquote.userstuff,
.secondary form {
background: #E3D9C0;
border-radius: 10px;
}
select,
.toggled form,
.dynamic form,
input,
textarea,
.listbox .index,
#ibox_wrapper,
#ibox_content {
background: #fdf9e9;
}
.thread .even {
background: #F1ECDF;
}
.filters .submit input {
background: #F1ECDF;
border: 1px solid #7c0100;
}
#feedback fieldset {
border-radius: 0px;
}
.filters fieldset {
border-radius: 20px;
}
.icon img,
.comment .icon .visitor {
background-color: #fff;
height: 80px;
width: 80px;
padding: 0px;
margin: 0px;
border: 2px solid transparent;
border-radius: 10px;
box-shadow: 0 0 10px 0 #000;
}
.comment .icon .visitor {
background-color: #FFF;
background-image: url("https://archiveofourown.org/images/skins/iconsets/default/icon_user.png");
background-repeat: no-repeat;
background-position: top center;
background-size: 80px 80px;
}
.comment div.icon {
border-bottom: none;
}
.comment h4.byline {
background: #E3D9C0;
}
li.comment,
#main .wrapper {
border-bottom: 2px solid #7c0100;
border-top: 2px solid #7c0100;
border-left: 1px dashed #7c0100;
border-right: 1px dashed #7c0100;
border-radius: 20px;
overflow: hidden;
}
#workskin .notes,
dl.meta,
.comment .posted,
.comment .edited {
font-size: 90%;
}
p.kudos {
font-size: 95%;
margin-top: 15px;
}
#workskin h2 {
font-size: 2.143em;
color: #7c0100;
}
#workskin {
text-align: justify;
}
li.blurb {
border-radius: 20px;
border: 2px solid #E3D9C0;
box-shadow: 0 0 5px #000;
}
li.blurb .module {
background: #F1ECDF;
border: 1px dashed #7c0100;
border-radius: 5px;
}
li.relationships a,
dl.index dd,
.reading h4.viewed {
background: #e5e1cf;
}
.reading h4.viewed {
font-size: 95%;
border: none;
}
ul.tags li.warnings,
ul.tags li.relationships,
ul.tags li.characters,
ul.tags li.freeforms {
float: left !important;
margin: 0;
padding: 2px;
}
li.warnings + li.relationships,
li.relationships + li.characters,
li.characters + li.freeforms,
li.warnings + li.characters,
li.warnings + li.freeforms,
li.relationships + li.freeforms {
clear: left;
}
ul.tags li.warnings:first-child:before {
content: "Warnings: ";
color: #000;
font-weight: bold;
}
li.warnings + li.relationships:before {
content: "Relationships: ";
color: #000;
font-weight: bold;
}
li.relationships + li.characters:before {
content: "Characters: ";
color: #000;
font-weight: bold;
}
li.characters + li.freeforms:before {
content: "Other tags: ";
color: #000;
font-weight: bold;
}
li.warnings + li.characters:before {
content: "Characters: ";
color: #000;
font-weight: bold;
}
li.warnings + li.freeforms:before {
content: "Other tags: ";
color: #000;
font-weight: bold;
}
li.relationships + li.freeforms:before {
content: "Other tags: ";
color: #000;
font-weight: bold;
}
li.blurb blockquote p:first-child::before {
content: "About: ";
color: #000;
font-size: 95%;
font-weight: bold;
}
.blurb ul.series::before {
content: "Series: ";
color: #000;
font-weight: bold;
}
.blurb .fandoms::before {
content: "Fandom: ";
color: #000;
font-weight: bold;
}
.bookmark .user,
.own,
.draft,
.draft .wrapper,
.unread,
.child,
.unwrangled,
.unreviewed {
background: #F1ECDF;
}
.bookmark .user {
border-radius: 10px;
border: 1px solid #7c0100;
}
.bookmark .dynamic {
border: none;
}
#header h2 {
background-color: #756F62 !important;
}