Sandbox

%%form_data{name}%%

Select "Base" to edit CSS from scratch
Enable Advanced Mode (must Save to activate)
CSS: /* SITE MANAGER
------------------------------*/

#sm-menu, #sm-menu ul {
background-color: #222222;
}

#site-manager-menu{
border-right: 1px solid #FBB611;
}

#site-manager-menu .head{
color: #0A87B7;
}

#site-manager-menu hr{
color: #222222;
background-color: #222222;
}

#site-manager-menu li a.active{
color: #0A87B7;
background-color: #222222;
}

.sm-fgroup{
border: 1px solid #FBB611;
}

.sm-fgroup-name{
color: #0A87B7;
background-color: #000000;
border-top: 1px solid #FBB611;
border-left: 1px solid #FBB611;
border-right: 1px solid #FBB611;
}

.sm-fgroup-description{
background-color: #000000;
border-left: 1px solid #FBB611;
border-right: 1px solid #FBB611;
}

.sm-fgroup-options{
background-color: #000000;
border: 1px solid #FBB611;
}

/* CONTAINERS
------------------------------*/

div#container-wrap {
background-image: none;
background-repeat:repeat-x;
}

#content-wrap {
margin:50px 0 auto;
width:100%;
min-height:1px;
}

/* BUTTONS
------------------------------*/

div.buttons input, input.button, button, a.button {
color: #0A87B7;
background-color: #222222;
font-weight: bold;
border-radius: 8px 8px;
-moz-border-radius: 8px 8px;
-webkit-border-radius: 8px 8px;
}

div.buttons input:hover, input.button:hover, button:hover, a.button:hover {
color: #FBB611;
background-color: #222222;
text-decoration: none;
}

/* HEADER
------------------------------*/

#header {
background-color:#222222;
background-image:url(http://kingfisher-theme.wikidot.com/local--files/admin:manage/kingfisher_banner.png);
background-position:center bottom;
background-repeat:no-repeat;
border-top:0px #000000;
border-bottom:22px solid #000000;
height:118px;
width:100%;
}

#header h1{
display:none;
}

#header h2{
display:none;
}

/* TOP BAR
------------------------------*/

#top-bar{
position: absolute;
left: 0px;
bottom: 0px;
width: 100%;
}

#top-bar li{
float:right;
margin: 0 10px;
}

#top-bar li ul{
padding: 0;
margin: 0;
width: 12em;
border: 1px solid #222222;
}

#top-bar li a {
color: #FBB611;
font-weight: bold;
text-decoration: none;
background-color: #222222;
}

#top-bar a:hover {
color: #FBB611;
background-color: #222222;
text-decoration: none;
}

#top-bar li ul li a{
background-color: #222222;
text-align: left;
}

#top-bar ul li.sfhover a,
#top-bar ul li:hover a {
color: #FBB611;
font-weight: bold;
text-decoration: none;
background:#222222;
border-bottom: 2px solid #0A87B7;
}

#top-bar ul li:hover a:hover {
color: #0A87B7;
background: #222222;
text-decoration: none;
}

#top-bar ul li.sfhover ul li a,
#top-bar ul li:hover ul li a {
border-top: 1px solid #222222;
}

/* LOGIN STATUS
------------------------------*/

#login-status {
color:#FBB611;
font-size:100%;
z-index:30;
overflow:visible;
position:absolute;
right:10px;
top:10px;
z-index:25;
}

#login-status a {
background:transparent none repeat scroll 0 0;
color:#FBB611;
}

#account-options li{
display: block;
margin: 0; padding: 0;
width: 100%;
color: #0A87B7;
background-color: #222222;
}

#account-options li a {
display: block;
margin: 0; padding: 0;
color: #FBB611;
width: 100%;
background-color: #222222;
}

#account-options li a:hover {
text-decoration: none;
background-color:#000000;
color: #0A87B7;
}

/* SIDE BAR
------------------------------*/

#side-bar {
width: 190px;
color: #FFFFFF
background-image:none;
background-repeat: no-repeat;
border-radius: 10px 10px;
-moz-border-radius: 10px 10px;
-webkit-border-radius: 10px 10px;
background-color:#222222;
border:4px solid #FBB611;
margin:0 2em 0 2em;
padding-left:2em;
padding-right:2em;
padding-top:2em;
}

#side-bar h1{
color: #0A87B7;
}

#side-bar h2{
color: #0A87B7;
}

#side-bar h3{
color: #0A87B7;
}

#side-bar h4{
color: #0A87B7;
}

#side-bar h5{
color: #0A87B7;
}

#side-bar h6{
color: #0A87B7;
}

/* FOOTER
------------------------------*/

#footer {
background-color: #000000;
}

#footer a {
color: #0A87B7;
}

#footer a:hover {
color: #FBB611;
}

/* LICENSE AREA
------------------------------*/

#license-area {
color: #E0E0E0;
}

/* MAIN BODY & CONTENT
------------------------------*/

body {
background:#222222 url(http://kingfisher-theme.wikidot.com/local--files/admin:manage/kingfisher_background.png) repeat scroll center top;
width:100%;
color:#FFFFFF;
padding:0;
font: 13px Verdana, Arial, Helvetica, sans-serif;
}

#main-content {
color: #FFFFFF
background-image:none;
background-repeat: no-repeat;
border-radius: 10px 10px;
-moz-border-radius: 10px 10px;
-webkit-border-radius: 10px 10px;
background-color:#222222;
border:4px solid #FBB611;
margin:0 2em 0 25em;
padding-left:2em;
padding-right:2em;
padding-top:2em;
}

#page-title{
margin: 0 0 0.5em 0;
font-size: 250%;
color:#0A87B7;
border-bottom: 1px solid #FBB611;
}

#toc{
border: 2px solid #FBB611;
padding: 0 1em;
background-color: #222222;
border-radius: 8px 8px;
-moz-border-radius: 8px 8px;
-webkit-border-radius: 8px 8px;
}

#toc .title {
color: #0A87B7;
font-weight: bold;
margin: 0.2em 0 ;
padding: 0 2em;
text-align: center;
}

#main-content h1{
color: #0A87B7;
}

#main-content h2{
color: #0A87B7;
}

#main-content h3{
color: #0A87B7;
}

#main-content h4{
color: #0A87B7;
}

#main-content h5{
color: #0A87B7;
}

#main-content h6{
color: #0A87B7;
}

a:link {
color: #FBB611;
}

a.link:hover {
color: #0A87B7;
}

a:visited {
color: #FBB611;
}

a:hover {
text-decoration: none;
background-color:#222222;
color: #0A87B7;
}

a.visited:hover {
color: #0A87B7;
text-decoration: none;
background-color:#222222;
}

a.newpage {
color: #FE6702;
text-decoration: none;
}

blockquote{
border: 2px solid #FBB611;
padding: 0 1em;
background-color: #222222;
border-radius: 8px 8px;
-moz-border-radius: 8px 8px;
-webkit-border-radius: 8px 8px;
}

.edit-section-button{
background-color: #222222;
}

#edit-section-content{
border: 1px solid #0A87B7;
}

.change-textarea-size a{
color: black;
background-color: #EEEEEE;
border: 1px solid #222222;
}

table.page-files .highlight{
background-color: #222222;
}

table.wiki-content-table td{
border: 2px solid #FBB611;
padding: 0.3em 0.7em;
}

table.wiki-content-table th{
border: 2px solid #FBB611;
padding: 0.3em 0.7em;
background-color: #222222;
}

a.action-area-close:hover{
background-color: #222222;
}

table.page-files .highlight{
background-color: #222222;
}

.code {
border: 1px dashed #FBB611;
background-color: #000000;
}

.hl-default {
color: #006600;
}

.hl-code {
color: #006600;
}

.hl-brackets {
color: #006600;
}

.hl-identifier {
color: #006600;
}

div.wiki-note{
border: 1px solid #222222;
}

.preview-message{
border: 2px dashed #FBB611;
background-color: #222222;
}

.page-tags span{
border-top: 1px solid #FBB611;
}

#page-version-info{
border: 1px dashed #FBB611;
background-color: #222222;
}

table.page-history td.optionstd a{
border: 1px solid #222222;
}

.diff-table td.from, .diff-table td.to{
border: 1px dashed #FBB611;
}

#lock-info{
background-color: #222222;
border: 1px solid #FBB611;
}

.inline-diff ins{
background-color: #FBB611;
}

.inline-diff del{
background-color: #0A87B7;
}

.Differences thead th {
border-bottom: 1px solid #FBB611;
background: #222222;
color: #AAAAAA;
}

.Differences tbody th {
background: #222222;
border-right: 1px solid #FBB611;
}

.changes-list-item:hover{
background-color: #222222;
}

table.page-compare td, table.page-compare th{
border: 1px solid #FBB611;
}

.page-source{
border: 1px dashed #FBB611;
}

.list-pages-item:hover {
background-color: #222222;
}

.list-pages-item .preview {
font-size: 90%;
color: #FFFFFF;
margin: 2px 0;
}

a.action-area-close:hover{
background-color: #222222;
}

.pager a{
border: 1px solid #AAAAAA;
text-decoration: none;
border-radius: 8px 8px;
-moz-border-radius: 8px 8px;
-webkit-border-radius: 8px 8px;
}

.pager .current{
background-color: #222222;
color: #0A87B7;
border: 1px solid #AAAAAA;
border-radius: 8px 8px;
-moz-border-radius: 8px 8px;
-webkit-border-radius: 8px 8px;
}

.help-block{
border: 1px solid #FBB611;
color: #0A87B7;
}

table.form.grid td, table.form.grid th{
border: 1px solid #FBB611;
}

table.form tr.invalid-value-row td{
background-color: #FBB611;
}

div.note{
border: 1px solid #DDDDDD;
background-color: #222222;
}

div.note-block{
border: 1px solid #FBB611;
}

.hovertip{
border: 2px solid #0A87B7;
border-radius: 8px 8px;
-moz-border-radius: 8px 8px;
-webkit-border-radius: 8px 8px;
background-color: #000000;
}

/* TABS
===========================*/

.yui-navset .yui-nav,
.yui-navset .yui-navset-top .yui-nav {
border:solid #FBB611;
border-width: 0;
}

yui-navset .yui-nav, .yui-navset .yui-navset-top .yui-nav {
width: 100%;
}

.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
background: none;
border:solid #222222;
border-width: 0;
color: #FBB611;
position: relative;
text-decoration: none;
}

.yui-navset .yui-content {
background:#222222;
border-top: 2px solid #FBB611;
border-bottom: 2px solid #FBB611;
border-left: 2px solid #FBB611;
border-right: 2px solid #FBB611;
border-radius-bottomleft: 8px;
-moz-border-radius-bottomleft: 8px;
-webkit-border-radius-bottomleft: 8px;
border-radius-bottomright: 8px;
-moz-border-radius-bottomright: 8px;
-webkit-border-radius-bottomright: 8px;
}

.yui-navset .yui-nav .selected a, .yui-navset .yui-nav .selected a em {
color: #FBB611;
font-weight: bold;
background-color: #222222;
border-top: 1px solid #FBB611;
border-bottom: 2px solid #FBB611;
border-left: 1px solid #FBB611;
border-right: 1px solid #FBB611;
border-radius-topleft: 3px;
-moz-border-radius-topleft: 3px;
-webkit-border-radius-topleft: 3px;
border-radius-topright: 3px;
-moz-border-radius-topright: 3px;
-webkit-border-radius-topright: 3px;
}

.yui-navset .yui-nav li a em, .yui-navset-top .yui-nav li a em, .yui-navset-bottom .yui-nav li a em {
color: #0A87B7;
font-weight: bold;
background-color: #222222;
border-top: 1px solid #FBB611;
border-bottom: 2px solid #FBB611;
border-left: 1px solid #FBB611;
border-right: 1px solid #FBB611;
border-radius-topleft: 3px;
-moz-border-radius-topleft: 3px;
-webkit-border-radius-topleft: 3px;
border-radius-topright: 3px;
-moz-border-radius-topright: 3px;
-webkit-border-radius-topright: 3px;
}

.yui-navset .yui-nav li a em:hover, .yui-navset-top .yui-nav li a em:hover, .yui-navset-bottom .yui-nav li a em:hover {
color: #FBB611;
}

.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:hover {
background: none;
color:#222222;
}

.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:focus {
background: none;
outline: 0;
}

.yui-navset .yui-nav .selected a em {
padding: none;
}

/* AUTOCOMPLETE
------------------------------*/

.yui-ac-content{
border:2px solid #FBB611;
background:#222222;
border-radius: 8px 8px;
-moz-border-radius: 8px 8px;
-webkit-border-radius: 8px 8px;
}

.autocomplete-list li.yui-ac-highlight {
background-color: #000000;
border-radius: 8px 8px;
-moz-border-radius: 8px 8px;
-webkit-border-radius: 8px 8px;
}

/* FORUM
------------------------------*/

.forum-group div.head{
background-color: #000000;
color: #0A87B7;
border-top: 2px solid #FBB611;
border-left: 2px solid #FBB611;
border-right: 2px solid #FBB611;
border-bottom: 1px solid #FBB611;
}

.forum-group table{
border-top: 1px solid #FBB611;
border-left: 2px solid #FBB611;
border-right: 2px solid #FBB611;
border-bottom: 2px solid #FBB611;
}

.forum-group table td{
border: 1px solid #777777;
}

.forum-group table td.name .description{
color: #777777
font-size: 87%;
}

.forum-group table tr.head td{
background-color: #222222;
}

.forum-category-box .description-block{
border: 1px solid #FBB611;
background-color: #222222;
}

.forum-category-box .description-block .statistics{
color: #777777;
}

.forum-category-box table{
border: 1px solid #FBB611;
}

.forum-category-box table tr.head td{
background-color: #222222;
}

.forum-category-box table td{
border: 1px solid #777777;
}

.forum-new-thread-box .description{
border: 1px solid #FBB611;
background-color: #222222;
}

.forum-new-thread-box .description .statistics{
color: #777777;
}

.forum-thread-box .description-block{
border: 1px solid #FBB611;
background-color: #222222;
}

.forum-thread-box .description-block .statistics{
color: #777777;
}

.forum-thread-box .action-area{
border: 1px solid #FBB611;
}

.thread-container .post .options a{
color: #0A87B7;
}

.thread-container .post .options a:hover{
color: #FBB611;
}

.thread-container .post .head{
background-color: #222222;
}

.thread-container .post .long .changes a {
color: #0A87B7;
}

.thread-container .post .long .changes a:hover {
color: #FBB611;
}

.thread-container .post .long .revisions table tr.active td{
background-color: #222222;
}

.thread-container .post .short{
background-color: #222222;
}

.thread-container .post .short .options{
color: #0A87B7;
}

.thread-container .post .short .options:hover{
color: #FBB611;
}

div.new-post a{
background-color: #222222;
border-radius: 8px 8px;
-moz-border-radius: 8px 8px;
-webkit-border-radius: 8px 8px;
}

/* ODIALOG
------------------------------*/

table#odialog-box-container td{
border: 2px solid #FBB611;
}

#odialog-container{
background-color: #222222;
}

.owindow{
color: #FFFFFF;
background-color: #000000;
border: 2px solid #0A87B7;
border-radius: 10px 10px;
-moz-border-radius: 10px 10px;
-webkit-border-radius: 10px 10px;
}

.owindow .title{
padding: 0.5em 1em;
color: #000000;
background-color: #FBB611;
border-bottom: 2px solid #0A87B7;
border-radius-topleft: 8px;
-moz-border-radius-topleft: 8px;
-webkit-border-radius-topleft: 8px;
border-radius-topright: 8px;
-moz-border-radius-topright: 8px;
-webkit-border-radius-topright: 8px;
}

.owindow .button-bar a{
color: #FBB611;
font-weight: bold;
background-color: #222222;
border: 1px solid #AAAAAA;
border-radius: 8px 8px;
-moz-border-radius: 8px 8px;
-webkit-border-radius: 8px 8px;
}

.owindow .button-bar a:hover{
color: #0A87B7;
font-weight: bold;
background-color: #222222;
border-radius: 8px 8px;
-moz-border-radius: 8px 8px;
-webkit-border-radius: 8px 8px;
}

h1, #page-title {
color: #0A87B7;

.box444{
background-color: #000000;
}

.box444 .button-bar{
background-color: #222222;
}

/* SEXY BOXES */

div.sexy-box {
background: #222222;
border: 2px solid #FBB611;
}

div.sexy-box div.image-container img {
border: 2px solid #FBB611;
}

#page-title{
display:none;
}
.form-table{
border-spacing:20px 50px;
}
.form-labels{
vertical-align: top;
font-style:italic;
font-weight:bold;
}
[[/module]]

[[div style="font-size:180%; font-weight:800; margin-top:30px; border-bottom:1px solid gray;"]]
%%form_data{name}%%
[[/div]]

[[div style="float:right; text-align:right; padding:5px; margin:5px; border:1px dotted gray;"]]
[[button print style="background-image: url(http://www.wikidot.com/local--files/files/document-print.png); background-repeat: no-repeat; background-position: bottom right; padding-right: 20px;color: #444"]]

[#contact Contact Author]
[[/div]]

[[form]]
fields:
name:
label: Full name
type: text
width: 50
fullcv:
type: file
label: Full CV
objective:
label: Objective
type: wiki
width: 90
height: 3
skills:
label: Skills
type: wiki
width: 90
height: 8
experience:
label: Experience
type: wiki
width: 90
height: 8
education:
label: Education
type: wiki
width: 90
height: 8
refs:
label: References
type: wiki
width: 90
height: 6
[[/form]]

------

+ Contact the author of this CV
[[# contact]]
[[module MailForm to="%%created_by%%" title="HaveMyCV.com"]]
# name
* title: Name
* rules:
* required: true
* hint: Required
# affiliation
* title: Institute/Organization/Company
* rules:
* required: true
* hint: Required
# email
* title: Email
* rules:
* required: true
* hint: Required
# phone
* title: Phone
# message
* type: textarea
* title: Message
* rules:
* maxLength: 1000
* required: true
* hint: Max Char. 1000, Required
Enable Custom Content
Enable Custom Sidebar
Enable Custom Topbar
Content:
~ x ~ xx
x x

CV author tools: [[button edit]] | [[button files]] | [[button delete]] | [[button tags]]

Sidebar:
Topbar:

Contact the author of this CV

Name
Required
Institute/Organization/Company
Required
Email
Required
Phone
Message
Max Char. 1000, Required

Nunc iaculis urna elementum quam. Suspendisse tristique eros quis massa. Sed iaculis, ligula at posuere tempor, lectus libero fringilla eros, a vehicula felis magna non pede. Donec ac lacus. Donec risus erat, rutrum sed, ornare at, suscipit a, nibh. Nullam posuere laoreet purus. Duis aliquet sollicitudin felis. Pellentesque ipsum. Praesent vel libero. Phasellus suscipit aliquet tortor. Fusce ornare blandit risus. Vivamus venenatis blandit pede. Nullam massa. Ut placerat fringilla neque. Nam tortor magna, imperdiet ut, volutpat in, lobortis vitae, sem. Donec in nisi ac leo fermentum eleifend.

Header 1

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus arcu libero, aliquet sit amet, ornare quis, vulputate a, nibh. Aliquam sit amet lectus vitae ligula feugiat condimentum. Proin eu mauris. Suspendisse ac sem. Cras in quam in augue fringilla porttitor. Nulla facilisi. Aliquam erat volutpat. Morbi consectetuer, libero at iaculis fermentum, dolor velit tincidunt sapien, lacinia ultricies ligula dui eget orci. Maecenas magna quam, volutpat ut, auctor et, malesuada quis, quam. Fusce semper pharetra mi. Aliquam facilisis tortor ut ante. Nam dignissim, ipsum et pharetra pretium, est sem feugiat sapien, a mattis elit sem vitae neque. Ut nec nibh. Ut sagittis magna nec velit. Maecenas ut eros. Duis lectus. Sed venenatis. Fusce iaculis urna euismod neque.

Header 2

Etiam elementum. Curabitur magna. Nulla facilisi. Donec dapibus sagittis diam. Duis sodales placerat nisi. Sed varius. Etiam fermentum iaculis nunc. Pellentesque dictum fringilla diam. In hac habitasse platea dictumst. Maecenas at purus. Etiam molestie, magna eget pharetra pretium, leo ligula lobortis sem, vitae bibendum erat ligula et nibh. Suspendisse pharetra nibh at tortor. Curabitur libero. In elementum pulvinar ipsum. Pellentesque tempus lobortis purus. Nullam erat enim, convallis in, faucibus non, lobortis ac, sem. Aenean aliquam.

Header 3

Nunc iaculis urna elementum quam. Suspendisse tristique eros quis massa. Sed iaculis, ligula at posuere tempor, lectus libero fringilla eros, a vehicula felis magna non pede. Donec ac lacus. Donec risus erat, rutrum sed, ornare at, suscipit a, nibh. Nullam posuere laoreet purus. Duis aliquet sollicitudin felis. Pellentesque ipsum. Praesent vel libero. Phasellus suscipit aliquet tortor. Fusce ornare blandit risus. Vivamus venenatis blandit pede. Nullam massa. Ut placerat fringilla neque. Nam tortor magna, imperdiet ut, volutpat in, lobortis vitae, sem. Donec in nisi ac leo fermentum eleifend.

Header 4

  • Bullet 1
  • Bullet 2
    • Bullet 2.1
      • Bullet 2.1.1

  1. Item 1
  2. Item 2
    1. Item 2.1
      1. Item 2.1.1

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus arcu libero, aliquet sit amet, ornare quis, vulputate a, nibh.

head 1 head 2 head 3
cell 1 cell 2 cell 3
long cell 4 cell 5
cell 6 long cell 7
looong cell 8

Header 1

This is a simple paragraph which demonstrates how existent links look. At the same time, it would be good to show off how the nonexistent links look as well. You can also view James Kanjo's inline When you hover over "hovertip", I appear!hovertips to see how those look. Click on James's name as well to see the pop-up demonstration.

Header 2

Some quick demonstrations:

Image Box

Image Unavailable

This is how the image box snippet looks with this theme!

Nunc iaculis urna elementum quam. Suspendisse tristique eros quis massa. Sed iaculis, ligula at posuere tempor, lectus libero fringilla eros, a vehicula felis magna non pede. Donec ac lacus. Donec risus erat, rutrum sed, ornare at, suscipit a, nibh. Nullam posuere laoreet purus. Duis aliquet sollicitudin felis. Pellentesque ipsum. Praesent vel libero. Phasellus suscipit aliquet tortor. Fusce ornare blandit risus. Vivamus venenatis blandit pede. Nullam massa. Ut placerat fringilla neque. Nam tortor magna, imperdiet ut, volutpat in, lobortis vitae, sem. Donec in nisi ac leo fermentum eleifend.

Content of Tab No. 1.


/*  Test Code
=============================*/
body{    font-family: sans-serif; }
p{    line-height: 1.4em; }
a{
    color: #4476A7;
    text-decoration: none;
}
a:hover{
    color: #487AAB;
    text-decoration: underline;
    background: none;
}
a.newpage{    color: #AAA; }
a.newpage:hover{    color: #A2A2A2; }
Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License