Difference between revisions of "Dusk"

From City of Hope MUSH
Jump to navigation Jump to search
imported>Felix
imported>Felix
Line 1: Line 1:
{{#css:
+
{{#css:Dusk/Dusk.css}}{{#css:
html, body {
+
img[alt="Jog.jpg"] {
     height: auto;
+
     height: 400px;
     min-height: 100%;
+
     left: -100px;
     position: relative;
+
     top: -25px;
 
}
 
}
#left-navigation {
+
img[alt="Cennwiki2.jpg"] {
     border-left: 1px solid white;
+
     height: 250px;
     left: -2px;
+
    left: -75px;
 +
     top: -25px;
 
}
 
}
div#mw-panel {
+
img[alt="No photo available.jpg"] {
    background: white none repeat scroll 0 0;
+
     height: 150px;
    border-bottom: 1px solid rgba(42, 54, 43, 0.5);
 
    border-left: 1px solid rgba(42, 54, 43, 0.5);
 
    border-radius: 0 0 10px 10px;
 
    border-right: 1px solid rgba(42, 54, 43, 0.5);
 
     height: 35em;
 
    left: 2px;
 
    opacity: 0.5;
 
    padding-bottom: 1em;
 
    padding-left: 0;
 
    padding-right: 1em;
 
    position: absolute;
 
    top: -35.25em;
 
    transition: top 0.5s ease 0s, opacity 0.5s ease 0s !important;
 
    width: 10em;
 
    z-index: 100;
 
 
}
 
}
div#mw-panel::after {
+
img[alt="RebeccaCoh2.jpg"] {
    bottom: 0.5em;
+
     height: 450px;
    color: rgba(42, 54, 43, 0.5);
+
     left: -30px;
    content: "▼ Menu ▼";
 
    display: block;
 
    font-size: 0.75em;
 
    left: 0;
 
    padding-top: 0.5em;
 
    position: absolute;
 
    text-align: center;
 
    width: 100%;
 
}
 
div#mw-panel:hover {
 
    opacity: 1;
 
    top: 0;
 
}
 
div#mw-panel:hover::after {
 
    border-top: 1px dotted rgba(42, 54, 43, 0.5);
 
    content: "▲ Menu ▲";
 
}
 
#p-logo {
 
    display: none;
 
}
 
div#content {
 
    margin-left: 0;
 
    padding: 1.25em 1.5em 1.5em;
 
}
 
#content, h1, h2 {
 
    background-color: #493829 !important;
 
    color: white !important;
 
}
 
div#footer {
 
    align-items: center;
 
    display: flex;
 
    flex-flow: row wrap;
 
    justify-content: space-between;
 
    left: -1px;
 
    margin: 0 auto;
 
    max-width: 1200px;
 
    min-width: 700px;
 
    opacity: 0.5;
 
    padding: 0 0.5em;
 
    position: relative;
 
    width: calc(90% - 3em);
 
}
 
#footer > div:last-child {
 
    display: none;
 
}
 
ul#footer-info > li {
 
    display: inline-block;
 
}
 
ul#footer-info > li:first-of-type {
 
    padding-right: 1em;
 
}
 
#wrapper {
 
    height: 100%;
 
    width: 100%;
 
}
 
#pagecontent {
 
    background: white;
 
    border: 4px #be937d solid;
 
    color: #493829;
 
    height: 600px;
 
    margin: 3.5em auto;
 
    max-height: 600px;
 
    min-height: 600px;
 
    min-width: 740px;
 
    padding-left: 250px;
 
    position: relative;
 
    width: 740px;
 
}
 
.background {
 
    height: 100%;
 
    left: 0;
 
    position: absolute;
 
    top: 0;
 
    width: 100%;
 
}
 
.portrait {
 
     height: 100%;
 
    position: absolute;
 
     left: 0;
 
    width: auto;
 
}
 
#pagecontent > p {
 
    margin: 0;
 
}
 
.name {
 
    align-items: center;
 
    border-bottom: medium none;
 
    color: transparent;
 
    display: flex;
 
    font-size: 4em;
 
    font-weight: bold;
 
    height: 2em;
 
    justify-content: center;
 
    line-height: 0.5em;
 
    padding: 0.5em 0;
 
    text-align: center;
 
    width: 710px;
 
}
 
/*-- Panels --*/
 
#panels {
 
    display: flex;
 
    flex-flow: row wrap;
 
    justify-content: center;
 
    position: relative;
 
    width: 710px;
 
    z-index: 3;
 
}
 
.tab {
 
    font-weight: bold;
 
    margin-top: -15em;
 
    order: 1;
 
    padding-top: 15em;
 
}
 
#Overview{
 
    order: 0;
 
}
 
.tab a, *:target ~ #Overview a {
 
    display: inline-block;
 
    font-size: 1.125em;
 
    margin: 0 0.5em 0.5em;
 
    opacity: 0.5;
 
    padding: 0 1em;
 
}
 
#Overview a, .tab:target a {
 
    opacity: 1;
 
}
 
.panel {
 
    display: none;
 
    height: 350px;
 
    order: 2;
 
    overflow: auto;
 
    padding: .75em 0 1.5em;
 
    width: 100%;
 
}
 
#Overview-panel, #Playlist-panel {
 
    align-items: flex-start;
 
    flex-flow: row wrap;
 
    justify-content: space-around;
 
}
 
:target ~ #Overview-panel {
 
    display: none;
 
}
 
#Overview-panel, #Overview:target ~ #Overview-panel,
 
#Playlist:target ~ #Playlist-panel {
 
    display: flex;
 
}
 
#Playlist:target ~ #Playlist-panel {
 
    justify-content: center;
 
}
 
#Playlist-panel > p {
 
    font-size: 1.25em;
 
    font-weight: bold;
 
}
 
#Desc:target ~ #Desc-panel,
 
#Gallery:target ~ #Gallery-panel,
 
#Contacts:target ~ #Contacts-panel {
 
    display: block;
 
}
 
#pagecontent hr {
 
    background-color: transparent;
 
    border-bottom: 1px dotted #8f3b1b;
 
    color: transparent;
 
    height: 1px;
 
    margin: 0 0 0.5em;
 
    opacity: 0.5;
 
    width: 710px;
 
}
 
#panels > hr {
 
    order: 2;
 
}
 
#panels a {
 
    color: #8f3b1b;
 
}
 
#info, #stats {
 
    max-width: 49%;
 
    min-width: 250px;
 
}
 
#Playlist-panel > ul {
 
    list-style: none;
 
    max-width: 47%;
 
    min-width: 47%;
 
}
 
.header {
 
    border-bottom: 1px dotted #8f3b1b;
 
    font-size: 1.25em;
 
    font-weight: bold;
 
    line-height: 1.75em;
 
    text-align: center;
 
}
 
#Desc-panel {
 
    text-indent: 3em;
 
}
 
#Playlist-panel li::before {
 
    color: #493829;
 
    content: "⚜ ";
 
}
 
#Gallery-panel > ul {
 
    align-items: center;
 
    display: flex;
 
    flex-flow: row wrap;
 
    height: 100%;
 
    justify-content: space-around;
 
    margin: 0;
 
    overflow: hidden;
 
    padding: 0;
 
}
 
#Gallery-panel li {
 
    display: inline-block;
 
    position: relative;
 
}
 
#Gallery-panel .image {
 
    background: rgba(190, 147, 125, 0.25) none repeat scroll 0 0;
 
    border: 3px solid #be937d;
 
    display: inline-block;
 
    padding: 1em;
 
}
 
#Gallery-panel .feathers {
 
    position: absolute;
 
}
 
#Gallery-panel .feathers:first-of-type {
 
    left: -1.75em;
 
    top: -2.25em;
 
    transform: scale(1, -1);
 
}
 
#Gallery-panel .feathers:nth-of-type(2) {
 
    bottom: -2.25em;
 
    left: -1.75em;
 
}
 
#Gallery-panel .feathers:nth-last-of-type(2) {
 
    right: -1.75em;
 
    top: -2.25em;
 
    transform: scale(-1, -1);
 
}
 
#Gallery-panel .feathers:last-of-type {
 
    bottom: -2.25em;
 
    right: -1.75em;
 
    transform: scale(-1, 1);
 
}
 
.empty {
 
    text-align: center;
 
}
 
/*-- Tables --*/
 
th, td {
 
    text-align: left;
 
    padding: .25em;
 
    vertical-align: top;
 
}
 
#stats td:nth-child(2) {
 
    text-align: right;
 
    width: 100%;
 
}
 
#Playlist-panel span {
 
    display: block;
 
    text-indent: 3em;
 
}
 
.feather {
 
    height: auto;
 
    position: absolute;
 
    width: 200px;
 
    z-index: 10;
 
}
 
.upperleft {
 
    top: -75px;
 
    left: -52px;
 
    transform: scale(1, -1);
 
}
 
.lowerright {
 
    right: -52px;
 
    bottom: -75px;
 
    transform: scale(-1, 1);
 
}
 
.upperright {
 
    right: -52px;
 
    top: -75px;
 
    transform: scale(-1, -1);
 
}
 
.lowerleft {
 
    left: -52px;
 
    bottom: -75px;
 
    transform: scale(1, 1);
 
}
 
#catlinks {
 
    margin: 0 auto;
 
    width: 990px;
 
}
 
#catlinks a {
 
    color: #8f3b1b;
 
}
 
.catlinks {
 
    background-color: #fff5e3;
 
    border: 1px solid #be937d;
 
    color: #8f3b1b;
 
}
 
.catlinks li {
 
    border-left: 1px solid #be937d;
 
 
}
 
}
 
}}
 
}}
 
<div id="wrapper">
 
<div id="wrapper">
 
<div id="pagecontent">[[File:DuskFeather.png|link=|class=feather upperleft|]][[File:DuskFeather.png|link=|class=feather upperright|]][[File:DuskFeather.png|link=|class=feather lowerleft|]][[File:DuskFeather.png|link=|class=feather lowerright|]][[File:DuskBG.jpg|link=|class=background]][[File:Dusk.png|link=|class=portrait|Dusk]]
 
<div id="pagecontent">[[File:DuskFeather.png|link=|class=feather upperleft|]][[File:DuskFeather.png|link=|class=feather upperright|]][[File:DuskFeather.png|link=|class=feather lowerleft|]][[File:DuskFeather.png|link=|class=feather lowerright|]][[File:DuskBG.jpg|link=|class=background]][[File:Dusk.png|link=|class=portrait|Dusk]]
<div class="name">Dusk</div>
+
<div class="mainname">Dusk</div>
 
<hr/>
 
<hr/>
 
<div id="panels">
 
<div id="panels">
 
<div id="Desc" class="tab" tabindex="0">[[#Desc|Description]]</div>
 
<div id="Desc" class="tab" tabindex="0">[[#Desc|Description]]</div>
 
<div id="Playlist" class="tab" tabindex="0">[[#Playlist|Playlist]]</div>
 
<div id="Playlist" class="tab" tabindex="0">[[#Playlist|Playlist]]</div>
<div id="Contacts" class="tab" tabindex="0">[[#Contacts|Subscribers/Contacts]]</div>
+
<div id="Contacts" class="tab" tabindex="0">[[#Contacts|Subscribers]]</div>
 
<div id="Gallery" class="tab" tabindex="0">[[#Gallery|Gallery]]</div>
 
<div id="Gallery" class="tab" tabindex="0">[[#Gallery|Gallery]]</div>
 
<div id="Overview" class="tab" tabindex="0">[[#Overview|Overview]]</div>
 
<div id="Overview" class="tab" tabindex="0">[[#Overview|Overview]]</div>
Line 437: Line 128:
 
[https://www.youtube.com/playlist?list=PLkW-xSuAN-yT8P-IxUHpOL6IoD8-cqtu_ Full Playlist]
 
[https://www.youtube.com/playlist?list=PLkW-xSuAN-yT8P-IxUHpOL6IoD8-cqtu_ Full Playlist]
 
</div>
 
</div>
<div id="Contacts-panel" class="panel empty">
+
<div id="Contacts-panel" class="panel">
No one yet.
+
<ul>
 +
{{:Dusk/Contact
 +
| name=Tavia
 +
| image=Jog.jpg
 +
| caption=She just happened to fall into my life.
 +
}}
 +
{{:Dusk/Contact
 +
| name=Cenn
 +
| image=Cennwiki2.jpg
 +
| caption=There to give you an elastic hair tie.
 +
}}
 +
{{:Dusk/Contact
 +
| name=Chandler
 +
| image=No photo available.jpg
 +
| caption=The hardest working cancer baby doctor I know.
 +
}}
 +
{{:Dusk/Contact
 +
| name=Rebecca
 +
| link=Rebecca_Van_Der_Gelt
 +
| image=RebeccaCoh2.jpg
 +
| caption=She took my wallet.
 +
}}
 +
</ul>
 
</div>
 
</div>
<div id="Gallery-panel" class="panel empty">
+
<div id="Gallery-panel" class="panel">
 
*[[File:DuskMiniFeather.png|link=|class=feathers|75px]][[File:DuskMiniFeather.png|link=|class=feathers|75px]][[File:Dusk_high_school.jpg|x175px]][[File:DuskMiniFeather.png|link=|class=feathers|75px]][[File:DuskMiniFeather.png|link=|class=feathers|75px]]
 
*[[File:DuskMiniFeather.png|link=|class=feathers|75px]][[File:DuskMiniFeather.png|link=|class=feathers|75px]][[File:Dusk_high_school.jpg|x175px]][[File:DuskMiniFeather.png|link=|class=feathers|75px]][[File:DuskMiniFeather.png|link=|class=feathers|75px]]
 
*[[File:DuskMiniFeather.png|link=|class=feathers|75px]][[File:DuskMiniFeather.png|link=|class=feathers|75px]][[File:Dusk_some_college.jpg|x175px]][[File:DuskMiniFeather.png|link=|class=feathers|75px]][[File:DuskMiniFeather.png|link=|class=feathers|75px]]
 
*[[File:DuskMiniFeather.png|link=|class=feathers|75px]][[File:DuskMiniFeather.png|link=|class=feathers|75px]][[File:Dusk_some_college.jpg|x175px]][[File:DuskMiniFeather.png|link=|class=feathers|75px]][[File:DuskMiniFeather.png|link=|class=feathers|75px]]

Revision as of 16:31, 14 April 2017

DuskFeather.pngDuskFeather.pngDuskFeather.pngDuskFeather.pngDuskBG.jpgDusk
Dusk


Basic Info
Full name: Dusk Daniel Ring
Occupation: Nature Novelist & Youtuber
Birthday: June 13, 1995
Age: 22
Height: 6'2"
Weight: 176lbs
Hair Colour: Light Brown
Eye Colour: Green
Played by: Rafael Lazzini
DeMEANor: Hedonist (Bon Vivant)
Notable Stats
Appearance: Choc-dot-f.pngChoc-dot-f.pngChoc-dot-f.pngChoc-dot.pngChoc-dot.png
Charisma: Choc-dot-f.pngChoc-dot-f.pngChoc-dot-f.pngChoc-dot.pngChoc-dot.png
Supporter
Good Old Boy
Way with Words
Allergy (to latex, baby)

Give me a head with hair, long beautiful hair... the light brown locks flow freely over his shoulders and all the way down to the small of his back. His beard is sparse, not connecting with the corners of his moustache, and expressive eyebrows, thin but dense, rest above his moss-green eyes. Even his forearms are in on the hairy act. He tops six feet by an inch or two, with a slender build, and looks to be in his early twenties.

  • DuskMiniFeather.pngDuskMiniFeather.png Tavia Jog.jpg
    She just happened to fall into my life.DuskMiniFeather.pngDuskMiniFeather.png
    DuskMiniFeather.pngDuskMiniFeather.png
  • DuskMiniFeather.pngDuskMiniFeather.png Cenn Cennwiki2.jpg
    There to give you an elastic hair tie.DuskMiniFeather.pngDuskMiniFeather.png
    DuskMiniFeather.pngDuskMiniFeather.png
  • DuskMiniFeather.pngDuskMiniFeather.png Chandler No photo available.jpg
    The hardest working cancer baby doctor I know.DuskMiniFeather.pngDuskMiniFeather.png
    DuskMiniFeather.pngDuskMiniFeather.png
  • DuskMiniFeather.pngDuskMiniFeather.png Rebecca RebeccaCoh2.jpg
    She took my wallet.DuskMiniFeather.pngDuskMiniFeather.png
    DuskMiniFeather.pngDuskMiniFeather.png