Actions

Work Header

Ninjago Themed Site Skins

Chapter 18: PIXAL theme

Summary:

Pixal's Theme. Instructions chapter 1.

Notes:

Honestly I'm running out of ninjago characters I can be bothered to do lol. I think unless anyone has someone they really want to see, I'll cap it here. Fic will close tomorrow otherwise and I'll work on some other themes for different fandoms.

Chapter Text

#header ul.primary,
#footer,
.autocomplete .dropdown ul li:hover,
li.selected,
a.tag:hover {
background: #BA55D3;
background-size: 500px;
}

#header .primary a {
background: #BA55D3;
}

#outer {
background: url(https://static.vecteezy.com/system/resources/thumbnails/010/009/729/small_2x/computer-chip-electronic-circuit-board-with-hexagon-for-technology-and-science-concept-and-education-for-future-vector.jpg);
}

#header {
background: url(https://static.vecteezy.com/system/resources/thumbnails/056/612/443/small_2x/radiant-green-tech-grid-digital-pattern-with-pulsing-neural-pathways-bright-green-neon-maze-circuit-pattern-vector.jpg);
margin: 0.5em 2.5em;
padding: 1em;
}

#dashboard,
#main,
#footer.module {
background: #f4effc;
margin: 0.5em 2.5em;
padding: 1em;
}

.actions a,
.action,
.actions input,
input[type="submit"],
button,
.current,
.actions label,
li.relationships,
.thread .even {
background: #E6E6FA;
}

a:hover {
color: #FFFFF0;
}

#login-block,
li.blurb,
fieldset,
form dl,
#dashboard ul.navigation,
#dashboard ul,
#symbols-key dl,
.toggled form,
.dynamic form,
div.comment,
li.comment,
.comment div.icon,
.autocomplete div.dropdown ul,
#modal,
.bookmark p.count span,
.ui-sortable li:hover,
.actions a:hover,
.actions input:hover,
.userstuff blockquote {
border-color: #663399;
}

fieldset,
form dl,
fieldset dl dl,
fieldset fieldset fieldset,
fieldset fieldset dl dl,
dd.hideme,
form blockquote.userstuff {
box-shadow: inset 1px 0 5px #663399;
}

#header .actions a:hover,
#header .actions a:focus,
#header .dropdown:hover a,
#header .open a,
#header .menu,
#small_login,
#header .dropdown:hover .current + .menu,
#dashboard .current,
.actions a:active,
.current,
a.current,
.current a:visited,
span.unread,
.replied,
span.claimed,
dl.index dd,
.own,
.draft,
.draft .wrapper,
.unread,
.child,
.unwrangled,
.unreviewed {
background: #E6E6FA;
}

.actions a,
.action,
.actions input,
input[type="submit"],
button,
.current,
.actions label,
a.cloud4,
a.cloud5 {
color: #9370DB;
}

a:visited,
a.cloud6 {
color: #9370DB;
}

thead,
tfoot,
tfoot td,
th,
tr:hover,
col.name,
input,
textarea,
#modal .content,
.actions a,
.action,
.actions input,
input[type="submit"],
button,
.current,
.actions label,
span.unread,
.replied,
span.claimed,
.system .latest h3,
.system div.news h3,
.listbox,
fieldset fieldset.listbox,
dl.meta,
.picture .header,
.bookmark .user {
border-color: #BA55D3;
}

input,
textarea {
box-shadow: inset 0 1px 2px #BA55D3;
}

li.blurb,
.blurb .blurb,
.listbox .index,
.dashboard .listbox .index {
box-shadow: inset 1px 1px 3px #BA55D3;
}

#header ul.primary {
box-shadow: inset 0 -5px 10px rgba(0,0,0,0.5);
}

.autocomplete div.dropdown ul {
box-shadow: 1px 3px 5px rgba(0,0,0,0.5);
}

table,
thead td,
#header #small_login,
#dashboard a:hover,
fieldset,
form dl,
fieldset dl dl,
fieldset fieldset fieldset,
fieldset fieldset dl dl,
dd.hideme,
form blockquote.userstuff,
.ui-sortable li:hover,
.listbox,
fieldset fieldset.listbox,
.comment h4.byline,
.readings-index h3,
.search span.tip,
.flash,
.notice,
.error,
.comment_error {
background: #7B68EE;
}

body,
#main.error,
#main.slow,
#main.maintenance,
.required .autocomplete,
.autocomplete .notice,
.post .required .warnings,
.listbox .heading,
.listbox .heading a:visited,
.userstuff h2,
.userstuff caption,
.userstuff table,
.userstuff td,
.userstuff col,
.userstuff tr,
.userstuff thead,
.userstuff tfoot,
.userstuff tbody,
.userstuff th,
.userstuff thead td,
.userstuff th a,
.userstuff th a:link,
a.cloud3,
#header .search input[type="text"] {
color: #001521;
}

.draft {
border-color: #BA55D3;
}

.actions a,
.action,
.actions input,
input[type="submit"],
button,
.current,
.actions label,
span.unread,
.replied,
span.claimed {
border-bottom-color: #BA55D3;
}

.ui-sortable li:hover,
.secondary,
.wrapper,
.ui-draggable form {
box-shadow: 1px 1px 5px #BA55D3;
}

#header #small_login {
box-shadow: inset 1px 0 5px rgba(0,0,0,0.75);
}

.delete a,
span.delete {
box-shadow: -1px -1px 2px rgba(0,0,0,0.75);
}

#modal-bg {
background: #000;
}

a,
a:link,
a:visited:hover,
#dashboard a,
#dashboard span,
.autocomplete div.dropdown ul,
.actions a:visited,
.actions a:active,
.current,
a.current,
.current a:visited,
a.tag,
.tags a,
a.cloud1,
a.cloud2 {
color: #000E16;
}

.userstuff h3,
#header .primary a,
#header .primary .current,
#header .primary input,
#header .search input {
border-color: #00273D;
}

.actions a:active,
.current,
a.current,
.current a:visited {
box-shadow: inset 1px 1px 3px #00273D;
}

#header #greeting img,
#header .heading a,
#header fieldset,
#header form,
#header p,
#header .user a:hover,
#header .user a:focus,
#header .user .current,
#dashboard a:hover,
.actions a:hover,
.actions input:hover,
.delete a,
span.delete,
span.unread,
.replied,
span.claimed,
.draggable,
.droppable,
span.requested,
a.work,
.blurb h4 a:link,
.blurb h4 img,
.system .latest h3,
.system div.news h3,
.system .tweets h3,
.required,
.error,
a.cloud7,
a.cloud8 {
color: #9400D3;
}

#outer #header #greeting .icon,
#dashboard.own,
.error,
.comment_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: #808080;
}

#dashboard a,
#dashboard span,
#dashboard.own,
#footer ul.navigation a,
fieldset dl,
fieldset.actions,
fieldset dl fieldset dl,
.dynamic form fieldset,
.toggled form fieldset,
.toggled form dl,
.secondary .toggled form,
.dashboard .own,
.mods li,
dl.stats dt,
dl.stats dd,
dl.stats,
.blurb .header .heading,
.blurb .header ul,
.blurb .header p.status,
.preface h3,
fieldset.comments,
.userstuff table,
.userstuff td,
.userstuff col,
.userstuff tr,
.userstuff thead,
.userstuff tfoot,
.userstuff tbody,
.userstuff th,
.userstuff thead td,
.userstuff th a,
.userstuff th a:link {
background: transparent;
}

#footer a:hover,
fieldset dl,
fieldset.actions,
fieldset dl fieldset dl,
.dynamic form fieldset,
.toggled form fieldset,
.toggled form dl,
.secondary .toggled form,
.actions a,
.action,
.actions input,
input[type="submit"],
button,
.current,
.actions label,
#outer.wrapper,
#inner.wrapper,
dl.index,
dl.stats,
.listbox,
fieldset fieldset.listbox,
.listbox li.blurb,
fieldset.comments,
dl.nomination {
box-shadow: none;
}

h2,
.system p#signup,
#header h2 {
text-shadow: none;
}

#header,
#dashboard,
#main,
#footer .module {
margin: 0.5em 2.5em;
padding: 1em;
}

#inner .region {
padding: 1.5em;
}

#header,
#dashboard,
#main,
#inner .group,
#footer .module,
fieldset,
.flash {
border: 4px solid #ddd;
outline: 0;
border-radius: 2em;
margin-bottom: 2em;
}

#dashboard {
width: 20%;
}

#main.dashboard {
margin: auto 1.5em;
position: relative;
clear: none;
float: right;
width: 60%;
}

.icon {
border-radius: 5em;
}

#main .index,
#header ul.primary,
#header ul.primary .menu {
box-shadow: none;
border: none;
background: transparent;
}

#header .primary .menu li {
border-bottom: none;
}

.blurb ul.tags,
.blurb blockquote,
#outer .current {
background: #ddd;
border: 3px solid #fff;
border-radius: 1.5em;
padding: 0.5em;
}

#dashboard.own {
background-color: #DA70D6 !important;
}

Notes:

Put any other (Ninjago) Characters you would like me to design skins for next in the comments!

Series this work belongs to: