Jump to content

Melvin: Difference between revisions

From RetroMUX
Melvin (talk | contribs)
No edit summary
Melvin (talk | contribs)
No edit summary
Line 103: Line 103:


[[Category:Characters]][[Category:Active PC]][[Category:PC]][[Category:Shifter]][[Category:Garou]][[Category:Bone Gnawers]]
[[Category:Characters]][[Category:Active PC]][[Category:PC]][[Category:Shifter]][[Category:Garou]][[Category:Bone Gnawers]]
__NOTOC__
{{#css:
    /* Urban Primitivism Color Scheme */
    :root {
      --color-concrete: #b3b3b3;
      --color-asphalt: #1a1a1a;
      --color-rust: #a03c28;
      --color-moss: #606c38;
      --color-chalk: #f5f5f5;
    }
   
    img {
      margin-bottom: -5px;
    }
    h2 {
      margin-top: 0!important;
      font-family: "Impact", "Arial Black", sans-serif;
      text-transform: uppercase;
      letter-spacing: 1px;
    }
    table {
      padding: 0 1.2em;
    }
    tr {
      margin: 0.2rem 0;
    }
    td {
      width: 50%;
    }
    .hooks-table td, .contacts-table td {
      width: auto;
    }
    .hooks-table td:nth-child(1) {
      width: 25%;
    }
    .contacts-table td:nth-child(1) {
      width: 35%;
    }
    table tr td:nth-child(1) {
      font-weight: 600;
    }
    hr {
      width: 90%;
      border: 1px solid var(--color-rust);
    }
    h2.label {
      margin-bottom: 0.5rem;
    }
    .w-100 {
      width: 100%;
    }
    .m-auto {
      margin: auto;
    }
    .ph-1 {
      padding: 0 1rem;
    }
    .flex {
      display: flex;
    }
    .flex-col {
      flex-direction: column;
    }
    .justify-center {
      justify-content: center;
    }
    .text-center {
      text-align: center;
    }
    .text-shadow {
      text-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
    }
    .show-mobile {
      display: none;
    }
    .heroImage img {
      width: 100%;
      height: auto;
    }
    #topImage {
      border-bottom-width: 0.5rem;
      border-color: var(--color-rust);
      border-style: solid;
    }
    .container {
      font-family: "Courier New", monospace;
      width: calc(100% - 2rem);
      border-width: 0.5rem;
      border-color: var(--color-rust);
      border-style: solid;
      background-color: var(--color-asphalt);
      color: var(--color-chalk);
    }
    .section {
      padding: 1.5rem 1rem;
    }
    .info-section {
      width: 30%;
      border-right-width: 0.5rem;
      border-top-width: 0;
      border-left-width: 0;
      border-color: var(--color-rust);
      border-style: solid;
      padding-bottom: 1rem;
      background-color: var(--color-asphalt);
    }
    .info-section table {
      width: 100%;
    }
    .info-portrait img {
      margin-bottom: 1rem;
      border: 4px solid var(--color-rust);
    }
   
    .rust-text {
      color: var(--color-rust);
    }
    .chalk-text {
      color: var(--color-chalk);
    }
    .concrete-text {
      color: var(--color-concrete);
    }
    .bio-section {
      width: 70%;
      background-color: var(--color-asphalt);
    }
   
    .alt-section {
      background-color: var(--color-concrete);
      color: var(--color-asphalt);
    }
   
    .quote-text {
      font-style: italic;
      font-size: 1.1em;
      border-left: 3px solid var(--color-rust);
      padding-left: 10px;
      margin: 15px 0;
    }
    #logs-section a, .alt-section a {
      color: var(--color-rust);
    }
    #logs-section ul {
      display: flex;
      flex-wrap: wrap;
    }
    #logs-section li {
      width: 50%;
    }
    .contacts-table a {
      color: var(--color-rust);
    }
    .gallery-container {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
    }
    .gallery-container img {
      max-width: 290px;
      height: auto;
      -webkit-transition: all 0.5s ease;
      -moz-transition: all 0.5s ease;
      -o-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
      transition: all 0.5s ease;
      margin: 10px;
      -moz-box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.75);
      webkit-box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.75);
      box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.75);
      border: 3px solid var(--color-rust);
    }
    .gallery-container img:hover {
      -webkit-transform: scale(1.3);
      -moz-transform: scale(1.3);
      -o-transform: scale(1.3);
      -ms-transform: scale(1.3);
      transform: scale(1.3);
      cursor: pointer;
    }
   
    .graffiti-banner {
      font-family: "Impact", "Arial Black", sans-serif;
      font-size: 2em;
      text-transform: uppercase;
      letter-spacing: 2px;
      padding: 15px;
      text-align: center;
      background-color: var(--color-rust);
      color: var(--color-asphalt);
      border-top: 3px solid var(--color-chalk);
      border-bottom: 3px solid var(--color-chalk);
      margin: 0;
      text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    }
   
    .tribe-symbol {
      border: 4px solid var(--color-rust);
      border-radius: 50%;
      padding: 5px;
      background-color: var(--color-asphalt);
    }
    @media only screen and (max-width: 480px) {
      .hide-mobile {
        display: none;
      }
      .show-mobile {
        display: block;
      }
      .section {
        padding: 1rem 0;
      }
      #top-section {
        flex-direction: column;
      }
      .info-section,
      .bio-section {
        width: 100%;
      }
      .info-section {
        border-width: 0;
        border-bottom-width: 0.5rem;
        border-style: solid;
        border-color: var(--color-rust);
      }
      .hooks-table td:nth-child(1) {
        width: 35%;
      }
      #logs-section li {
        width: 100%;
      }
    }
}}
<div class="container">
      <div class="heroImage hide-mobile" id="topImage">
        <!-- REPLACE WITH BANNER IMAGE -->
        [[File:BannerImageHere.jpg]]
      </div>
     
      <div class="graffiti-banner">
        STREET TALES
      </div>
      <div id="top-section" class="flex w-100">
        <div class="info-section flex flex-col">
          <div class="w-100 info-portrait">
            [[File:Melvin1.jpg]]
          </div>
          <table>
            <tr>
              <td>Deed Name:</td>
              <td class="rust-text">Knuckle Sandwich</td>
            </tr>
            <tr>
              <td>Human Name:</td>
              <td class="rust-text">Melvin Winnicott</td>
            </tr>
            <tr>
              <td>Demeanor:</td>
              <td class="rust-text">Bravo</td>
            </tr>
          </table>
          <hr />
          <table>
            <tr>
              <td>Sphere:</td>
              <td class="rust-text">Shifter</td>
            </tr>
            <tr>
              <td>Tribe:</td>
              <td class="rust-text">Bone Gnawers</td>
            </tr>
            <tr>
              <td>Camp:</td>
              <td class="rust-text">The Hood?</td>
            </tr>
            <tr>
              <td>Pack:</td>
              <td class="rust-text">ALL GAS NO BRAKES</td>
            </tr>
            <tr>
              <td>Totem:</td>
              <td class="rust-text">Black Unicorn</td>
            </tr>
            <tr>
              <td>Breed:</td>
              <td class="rust-text">Homid</td>
            </tr>
            <tr>
              <td>Auspice:</td>
              <td class="rust-text">Galliard</td>
            </tr>
          <tr>
              <td>Rank:</td>
              <td class="rust-text">Cliath</td>
            </tr>
          </table>
          <hr />
          <table>
            <tr>
              <td>Height:</td>
              <td class="rust-text">6'1"</td>
            </tr>
            <tr>
              <td>Fit:</td>
              <td class="rust-text">Punk clothes, very second-hand</td>
            </tr>
            <tr>
              <td>Hair:</td>
              <td class="rust-text">Black, close-cropped</td>
            </tr>
            <tr>
              <td>Eyes:</td>
              <td class="rust-text">Hazel-green</td>
            </tr>
            <tr>
              <td>Birthday:</td>
              <td class="rust-text">April 29, 1969</td>
            </tr>
            <tr>
              <td>Apparent Age:</td>
              <td class="rust-text">Mid 20s</td>
            </tr>
          </table>
          <hr />
          <div class="w-100 text-center">
            <div class="tribe-symbol">[[File:Bonegnawersymbol.png]]</div>
          </div>
        </div>
        <div class="w-100 show-mobile">
          <!-- REPLACE WITH BANNER IMAGE FOR MOBILE -->
          [[File:BannerImageHere.jpg]]
        </div>
        <div class="bio-section flex flex-col section">
          <h2 class="label chalk-text text-center text-shadow">BIOGRAPHY</h2>
          <div class="chalk-text ph-1">
            <!-- BIOGRAPHY -->
            <p>To be added.</p>
          </div>
        </div>
      </div>
      <div class="heroImage w-100">
        <!-- REPLACE WITH SECOND BANNER IMAGE -->
        [[File:SecondBannerImageHere.jpg]]
      </div>
      <div class="section alt-section">
        <h2 class="label text-center">ROLEPLAY HOOKS</h2>
        <table class="hooks-table">
          <tr>
            <td>Hook 1</td>
            <td>Description</td>
          </tr>
          <tr>
            <td>Hook 2</td>
            <td>Description</td>
          </tr>
          <tr>
            <td>Hook 3</td>
            <td>Description</td>
          </tr>
          <tr>
            <td>Hook 4</td>
            <td>Description</td>
          </tr>
        </table>
      </div>
      <div class="heroImage w-100">
        <!-- REPLACE WITH YOUR BANNER IMAGE -->
        [[File:ThirdBannerImageHere.jpg]]
      </div>
      <div class="section">
      <h2 class="label chalk-text text-center text-shadow">CONTACTS</h2>
        <table class="contacts-table">
          <tr>
            <td>Name1</td>
            <td>[Song Link] - <i>"Quote"</i></td>
          </tr>
          <tr>
            <td>Name2</td>
            <td>[Song Link] - <i>"Quote"</i></td>
          </tr>
          <tr>
            <td>Name3</td>
            <td>[Song Link] - <i>"Quote"</i></td>
          </tr>
          <tr>
            <td>Name4</td>
            <td>[Song Link] - <i>"Quote"</i></td>
          </tr>
        </table>
      </div>
      <div class="heroImage w-100">
        <!-- REPLACE WITH FOURTH BANNER IMAGE -->
        [[File:FourthBannerImageHere.jpg]]
      </div>
      <div class="section alt-section">
      <h2 class="label text-center">SOUNDTRACK</h2>
        <table class="contacts-table">
            <tr>
            <td>[https://www.youtube.com/watch?v=icY5DYwOHyA Mayor Breslin - You're Gonna Learn a Lesson In This Delicatessen]</td>
            <td>''IT FELT SO FUCKING GOOD / WHEN I SMASHED YOUR FACE INTO THE COUNTER / I THINK I SAW JESUS CHRIST! / HE SAID, "MAKE A SANDWICH OUT OF THAT ASSHOLE'S HEAD!" / I SAID, "LORD GIVE US OUR DAILY BREAD!" AS I PUNCHED A STACK OF DELI MEATS DOWN HIS FUCKIN THROAT''</td>
          </tr>
          <tr>
            <td>[https://www.youtube.com/watch?v=4G6QDNC4jPs Immortal Technique – Harlem Streets]</td>
            <td>''I'm from where the gold and diamonds have no value / And murderous rebels that the government can't subdue''</td>
          </tr>
          <tr>
            <td>[https://www.youtube.com/watch?v=gpL0xVIYbnU Tom Waits – Underground]</td>
            <td>''There's a world going on underground''</td>
          </tr>
          <tr>
            <td>[https://www.youtube.com/watch?v=ZzvL4O3uomg Pearl Jam – Even Flow]</td>
            <td>''Thoughts arrive like butterflies / Oh, he don't know, so he chases them away''</td>
            </tr>
        </table>
      </div>
      <div class="graffiti-banner">
        STREET WISDOM
      </div>
      <div class="section">
        <h2 class="label chalk-text text-center text-shadow">GALLERY</h2> 
        <div class="gallery-container">
        [[File:Melvin2.png|x220px]]
        [[File:Melvin3.jpg|x220px]]
        </div>
      </div>
      <div class="section alt-section" id="logs-section">
        <h2 class="label text-center">LOGS</h2>       
        {{#dpl:
|linksto={{PAGENAME}}
|category=Logs
|columns=3
|noresultsheader=<i><div>No logs have been posted yet.</div></i>
}}
      </div>
</div>
[[Category:Characters]]  [[Category:Shifter]] [[Category:Garou]] [[Category:Bone Gnawers]]

Revision as of 05:27, 20 May 2025



File:BannerImageHere.jpg


Melvin


"Some

Quote"

—Somebody



Street Speaker

Birth Name: Melvin Winnicott
Deed Name: Knuckle Sandwich
Age: Mid 20s
Breed: Homid
Auspice: Galliard
Tribe: Bone Gnawers

Urban Poet.
File:BoneGnawerImageHere.jpg

Street Fighter.

Voice of the Forgotten.
File:MelvinWolfHere.jpg

File:MelvinGraffiti.jpg

CONCRETE JUNGLE

Coming soonish

Immortal Technique - Harlem Streets.

STREET WISDOM

  • Cook: Insert text.
  • Flautist: Insert text.
  • Bruce Lee: Insert text.

CONTACTS

  • Clem: [Song] - "Some kinda quote"
  • Kaz: [Song] - "Some kinda quote"
  • Name1: [Song] - "Some kinda quote"
  • Name2: [Song] - "Some kinda quote"
  • Name3: [Song] - "Some kinda quote"
SOUNDTRACK

GALLERY

File:MelvinWolfHere.jpg File:MelvinGraffiti.jpg