User:Emma/Sandbox: Difference between revisions

From Zelda Dungeon Wiki
Jump to navigation Jump to search
Want an adless experience? Log in or Create an account.
mNo edit summary
No edit summary
Line 78: Line 78:
-moz-box-shadow: 0 -1px 1px #ddd;
-moz-box-shadow: 0 -1px 1px #ddd;
-webkit-box-shadow: 0 -1px 1px #ddd;">Example</div>
-webkit-box-shadow: 0 -1px 1px #ddd;">Example</div>
<span style="display:none;"><css>
.tabtest, .tabtestselected {
  float:left;
  width:100%;
  font-size:93%;
  margin: 0;
  padding: 0;
}
.tabtest ul, .tabtestselected ul {
  margin:0;
  padding:10px 10px 0;
  list-style:none !important;
}
.tabtest li, .tabtestselected li {
  float:left;
  margin:0 !important;
  text-align:center;
}
/* MediaWiki automatically removes links for the current page and surrounds it with <strong> tags instead */
.tabtest a,.tabtest strong {
  padding: 5px 15px 4px 6px;
  margin-right: 1px;
  margin-bottom: -1px;
  border: 1px solid #A6B4E7;
  border-bottom: 1px solid #AAA;
  float:left;
  display:block;
  text-decoration:none;
  font-weight:bold;
  color:black;
  -moz-border-radius-topleft: 8px;
  -moz-border-radius-topright: 8px;
  -moz-border-radius-bottomright: 0;
  -moz-border-radius-bottomleft: 0;
  border-radius: 8px 8px 0 0;
  -moz-border-radius: 8px 8px 0 0;
  -webkit-border-radius: 8px 8px 0 0;
  border-radius: 8px 8px 0 0;
  background: #c8d0ff;
  background: -moz-linear-gradient(top,#c8d0ff 0,#F9F9F9 100%);
  background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#c8d0ff),color-stop(100%,#F9F9F9));
  background: -webkit-linear-gradient(top,#c8d0ff 0,#F9F9F9 100%);
  background: -o-linear-gradient(top,#c8d0ff 0,#F9F9F9 100%);
  background: -ms-linear-gradient(top,#c8d0ff 0,#F9F9F9 100%);
  background: linear-gradient(top,#c8d0ff 0,#F9F9F9 100%);
}
/* Commented Backslash Hack
  hides rule from IE5-Mac \*/
.tabtest a:hover {float:none;}
/* End IE5-Mac hack */
.tabtest a:hover {
  color:#A6B4E7;
}
.tabtest a:hover, .tabtest strong:hover, .tabtestselected a, .tabtestselected strong{
  padding: 5px 15px 4px 6px;
  margin-right: 1px;
  margin-bottom: -1px;
  border: 1px solid #A6B4E7;
  font-weight: bold;
  -moz-border-radius-topleft: 8px;
  -moz-border-radius-topright: 8px;
  -moz-border-radius-bottomright: 0;
  -moz-border-radius-bottomleft: 0;
  border-radius: 8px 8px 0 0;
  -moz-border-radius: 8px 8px 0 0;
  -webkit-border-radius: 8px 8px 0 0;
  border-radius: 8px 8px 0 0;
  margin-bottom: -1px;
  border-bottom: 1px solid #F9F9F9!important;
  color: black;
  background: white;
  background: -moz-linear-gradient(top,white 0,#E5E5E5 5%,#F9F9F9 55%);
  background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,white),color-stop(5%,#E5E5E5),color-stop(55%,#F9F9F9));
  background: -webkit-linear-gradient(top,white 0,#E5E5E5 5%,#F9F9F9 55%);
  background: -o-linear-gradient(top,white 0,#E5E5E5 5%,#F9F9F9 55%);
  background: -ms-linear-gradient(top,white 0,#E5E5E5 5%,#F9F9F9 55%);
  background: linear-gradient(top,white 0,#E5E5E5 5%,#F9F9F9 55%);
  box-shadow: 0 -1px 1px #ddd;
  -moz-box-shadow: 0 -1px 1px #ddd;
  -webkit-box-shadow: 0 -1px 1px #ddd;
}
.tabcontent {
  border: 1px solid #AAA;
  padding: 0em 1em 1em 1em;
  background-color:#F9F9F9;
  color:#000;
  clear: left;
}
</css></span>
<div class="tabtest">
<ul>
<li><span class="_toggler_hide-tabs _toggler_show-tab1 _toggler_hide-stabs _toggler_show-utabs _toggler_hide-utab1 _toggler_show-stab1 utab1 utabs" style="display:none;">tab1</span><span class="_toggler-utab1 _toggler-stab1 stab1 stabs tabtestselected" style="font-size: 100%!important;">tab1</span></li>
<li><span class="_toggler_hide-tabs _toggler_show-tab2 _toggler_hide-stabs _toggler_show-utabs _toggler_hide-utab2 _toggler_show-stab2 utab2 utabs">tab2</span><span class="_toggler-utab2 _toggler-stab2 stab2 stabs tabtestselected" style="display:none; font-size: 100%!important;">tab2</span></li>
<li><span class="_toggler_hide-tabs _toggler_show-tab3 _toggler_hide-stabs _toggler_show-utabs _toggler_hide-utab3 _toggler_show-stab3 utab3 utabs">tab3</span><span class="_toggler-utab3 _toggler-stab3 stab3 stabs tabtestselected" style="display:none; font-size: 100%!important;">tab3</span></li>
</ul>
</div>
<div class="tabcontent">
{{toggle|Tab 1||tab1 tabs}}
{{toggle||Tab 2|tab2 tabs}}
{{toggle||Tab 3|tab3 tabs}}
</div>

Revision as of 13:11, January 31, 2012



This is my personal sandbox I use for testing projects I'm working on.



New Messages box:

User Functions

Current user: Template:CURRENTUSER
User group: {{#usergroup:Template:CURRENTUSER|0}}, {{#usergroup:Template:CURRENTUSER|1}}, {{#usergroup:Template:CURRENTUSER|2}}

Tabs

  • tab1
  • tab2
  • tab3
Tab 1

Possible Alternative Formatting

Preliminary examples of concept:

Example
Example

  • tab1
  • tab2
  • tab3
Tab 1