Single post in De La Lune Ranch Journal
Forum Index > PokéFarm > Journals > Staff > De La Lune Ranch Journal >
CSS
all them secretzesLogbook Entry
[table][tr]
[th] Project: [/th][th] Deadline: [/th][th] Status: [/th]
[/tr][tr]
[td]Project 1[/td][td]-- / --[/td][td][sc=step0]...[/sc][/td]
[/tr][tr]
[td]Project 2[/td][td]-- / --[/td][td][sc=step0]...[/sc][/td]
[/tr][tr]
[td]Project 3[/td][td]-- / --[/td][td][sc=step0]...[/sc][/td]
[/tr][tr]
[th=3x1][center]Extra information[/center][/th]
[/tr][tr]
[td=3x1][center]Extra information[/center][/td]
[/tr][/table]
[hide=LOG ENTRY]
ENTRY INFORMATION HERE
[/hide][hide=LOG ENTRY]
ENTRY INFORMATION HERE
[/hide]
[hr]
[hide=LOG ENTRY]
ENTRY INFORMATION HERE
[/hide]
Vertical Tabbed Interface
[sc=vertical tabbed_interface][ul]
[li][b]Tab 1[/b][/li]
[li][b]Tab 2[/b][/li]
[li][b]Tab 3[/b][/li]
[li][b]Tab 4[/b][/li]
[li][b]Tab 5[/b][/li]
[/ul][sc=tab-active]
Tab 1 stuff[/sc][sc=tab]
Tab 2 stuff[/sc][sc=tab]
Tab 3 stuff[/sc][sc=tab]
Tab 4 stuff[/sc][sc=tab]
Tab 5 stuff[/sc]
[/sc]
Horizontal Tabbed Interface
[sc=horizontal tabbed_interface][ul]
[li][b]Tab 1[/b][/li]
[li][b]Tab 2[/b][/li]
[li][b]Tab 3[/b][/li]
[li][b]Tab 4[/b][/li]
[li][b]Tab 5[/b][/li]
[/ul][sc=tab-active]
Tab 1 stuff[/sc][sc=tab]
Tab 2 stuff[/sc][sc=tab]
Tab 3 stuff[/sc][sc=tab]
Tab 4 stuff[/sc][sc=tab]
Tab 5 stuff[/sc]
[/sc]
Regular Post
a:link {color: #fcf3a5;}
a:visited {color: #fcf3a5;}
a:hover {color: #fcf3a5;}
a:active {color: #fcf3a5;}
hr {border-top: none; border: 2px solid #030303; border-bottom: none;}
div.tooltip_content {
background: #b89151;
color: #030303;
border: solid 1px black;
border-radius: 2px;
left: 40%;
margin: 0px auto;
padding: 0px auto;}
.background {
background: #2e2d23;
color: #fcf3a5;
text-align: center;
border-radius: 0px 0px 0px 0px;
min-height: 300px;
max-width: 100%;
margin: 5px;
padding: 0px;
position: relative;}
.textbox {
background-color: #4c4433;
color: #fcf3a5;
text-align: center;
border: solid 1px #030303;
border-radius: 0px 0px 5px 0px;
min-height: 250px;
width: 88%;
margin: 10px 0px 20px 0px;
padding: 5px 5px 5px 5px;
display: inline-block;
position: relative;
box-shadow: 10px 10px #030303;}
.panel {
background: #2e2d23;
border: solid 1px #030303;
border-radius: 0px 0px 0px 0px;
margin: 0px auto;
padding: 0px auto;
box-shadow: none;
>h3 {>a {
color: #030303;}
background: #b89151;
text-align: center;
border: solid 1px #030303;
border-radius: 0px;
margin: 0px;
padding: 5px;
position: relative;
transition: all 1s;}
>div {.page;color: #fcf3a5;}}
.credits {
color: #fcf3a5;
font-size: 10pt;
padding: 0px 0px 10px 0px;
text-align: center;}
Logbook Entry
[* when you are adjusting the status, change the [sc=step#] to match below based on the following:
step 0 = Not yet started
step 1 = Working on first stages
step 2 = Awaiting crits
step 3 = Screaming at pixels
step 4 = Recolors
step 5 = Awaiting QC
step 6 = Completed *]
[style]
table {margin: 0 auto;}
td {text-align=center;}
tr:hover {background-color: rgba(0,0,0,0.2);}
th {background-color: @col-bg2; color: @col-fg2;}
.step0 {
background: @col-bg1;
color: @col-fg1;
}
.step1 {
background: linear-gradient(90deg, @col-bg3 16.66%, @col-bg1 16.7%, @col-bg1 100%);
color: @col-fg1;
}
.step2 {
background: linear-gradient(90deg, @col-bg3 33.33%, @col-bg1 33.4%, @col-bg1 100%);
color: @col-fg1;
}
.step3 {
background: linear-gradient(90deg, @col-bg3 50%, @col-bg1 50.1%, @col-bg1 100%);
color: @col-fg1;
}
.step4 {
background: linear-gradient(90deg, @col-bg3 66.67%, @col-bg1 66.7%, @col-bg1 100%);
color: @col-fg1;
}
.step5 {
background: linear-gradient(90deg, @col-bg3 83.3%, @col-bg1 83.4%, @col-bg1 100%);
color: @col-fg1;
}
.step6 {
background: @col-bg3;
color: @col-fg1;
}
[/style]
Tabbed Interface
.tabbed_interface {
min-height: 250px;
width: 90%;
margin: 20px 0px 15px 0px;
padding: 5px;
display: inline-block;
position: relative;
>div {background: none; border: none;}}
.tabbed_interface>ul {background: none;}
.tabbed_interface>ul>li {
background: #b89151;
color: #030303;
border: solid 1px #000000;
padding: 5px;
cursor: pointer;
max-width: 100%;
white-space: normal;}
.tabbed_interface>div {
background-color: #4c4433;
color: #fcf3a5;
text-align: center;
border: solid 1px black;
border-radius: 0px 0px 5px 0px;
min-height: 250px;
padding: 0px 5px 0px 5px;
box-shadow: 10px 10px black;}
Items
.items {display: inline-block; vertical-align: bottom;}
.items>ul {list-style-type:none; padding: 0px; text-align: center;
&>li:nth-child(odd) {background: #b89151;}
&>li:nth-child(even) {background: #b89151;}
&>li {
color: #030303;
border: solid 1px black;
border-radius: 2px;
padding: 5px;
margin: 2px;
display: inline-block;
img{-webkit-filter: drop-shadow(1px 1px 1px #030303);}}}
Image
.image {
background-color: #2e2d23;
background-position: center;
background-image:url('/upload/DuchessLunaire/Pokesona/luna_ink_avatar.png');
border-radius: 0px 0px 5px 0px;
height: 100px;
width: 100px;
margin: 15px 0px 0px 0px;
vertical-align: top;
right: 10px;
display: inline-block;
position: absolute;}
Exp bar
.expbar{
background: #b89151;
color: #030303;
border: 1px solid black;
border-radius: 2px;
height: 30px;
&>div {background-color:#fcf3a5;}}
Code made by: me
Code made by: me -- Image Credit(s)