|
|
| (12 intermediate revisions by 2 users not shown) |
| Line 1: |
Line 1: |
| __NOTOC__
| |
| <!-- This page used a template from Shannon. https://liberationmush.site/liberationwiki/Template:ShannonTemplate -->
| |
| {{#css: | | {{#css: |
| @import 'https://fonts.googleapis.com/css2?family=Tangerine:wght@400;700&display=swap'; | | @import 'https://fonts.googleapis.com/css?family=Comforter'; |
|
| |
|
| img {
| | .h1.firstHeading { display: none } |
| margin-bottom: -5px;
| | .hidden { display: none } |
| }
| |
|
| |
| 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;
| |
| }
| |
|
| |
| h2.label {
| |
| margin-bottom: 0.5rem;
| |
| }
| |
|
| |
| .color-main {
| |
| color: #7D7E83;
| |
| }
| |
|
| |
| .color-shade-light,
| |
| .color-shade-light td {
| |
| color: #fddc5c;
| |
| }
| |
|
| |
|
| .contacts-table a {
| | .body a:link, |
| color: #f4f1ef !important;
| | .body a:visited {color: #E0779A;} |
| }
| | .body a:hover {color: #a42d33; text-decoration: none;} |
|
| | |
| .color-bg-light {
| | .hilite2 {color: #a42d33;} |
| background-color: #fddc5c;
| |
| }
| |
|
| |
| .color-accent-light {
| |
| color: #958d89;
| |
| }
| |
|
| |
| .color-shade-dark {
| |
| color: #fdb515;
| |
| }
| |
|
| |
| .color-bg-dark {
| |
| background-color: #000000;
| |
| }
| |
|
| |
| .color-accent-dark {
| |
| color: #797c7f;
| |
| }
| |
|
| |
| .color-border-light {
| |
| border-color: #f4f1ef;
| |
| }
| |
|
| |
| .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;
| |
| }
| |
|
| |
| .show-mobile {
| |
| display: none;
| |
| }
| |
|
| |
| .heroImage img {
| |
| width: 100%;
| |
| height: auto;
| |
| }
| |
|
| |
| #topImage {
| |
| border-bottom-width: 0.5rem;
| |
| border-color: #111;
| |
| border-style: solid;
| |
| }
| |
|
| |
| .container {
| |
| font-family: "Tangerine", cursive;
| |
| font-weight: 700;
| |
| font-style: bold;
| |
| font-size: 28px;
| |
| width: calc(100% - 2rem);
| |
| border-width: 1rem;
| |
| border-color: #111;
| |
| border-style: solid;
| |
| }
| |
|
| |
| .section {
| |
| padding: 1rem;
| |
| }
| |
|
| |
| .info-section {
| |
| width: 30%;
| |
| border-right-width: 0.5rem;
| |
| border-top-width: 0;
| |
| border-left-width: 0;
| |
| border-color: #111;
| |
| border-style: solid;
| |
| padding-bottom: 1rem;
| |
| }
| |
|
| |
| .info-section table {
| |
| width: 100%;
| |
| }
| |
|
| |
| .info-portrait img {
| |
| margin-bottom: 1rem;
| |
| }
| |
|
| |
|
| .bio-section {
| | .image-gallery { |
| width: 70%;
| | /* Mobile first */ |
| }
| | display: flex; |
| | flex-direction: column; |
| | gap: 10px; |
| | } |
|
| |
|
| #logs-section a {
| | .image-gallery .column { |
| color: #31282a;
| | display: flex; |
| }
| | flex-direction: column; |
| | gap: 10px; |
| | } |
|
| |
|
| #logs-section ul {
| | .image-gallery img:hover { |
| display: flex;
| | -webkit-transform: scale(1.05); |
| flex-wrap: wrap;
| | -moz-transform: scale(1.05); |
| }
| | -o-transform: scale(1.05); |
| | -ms-transform: scale(1.05); |
| | transform: scale(1.05); |
| | cursor: pointer; |
| | } |
|
| |
|
| #logs-section li {
| | .image-item img { |
| width: 50%;
| | overflow: hidden; |
| }
| | max-width: 220px; |
|
| | max-height: 220px; |
| .gallery-container {
| |
| display: flex; | |
| flex-wrap: wrap; | |
| justify-content: center;
| |
| }
| |
|
| |
| .gallery-container img {
| |
| max-width: 260px; | |
| height: auto;
| |
| -webkit-transition: all 0.5s ease; | | -webkit-transition: all 0.5s ease; |
| -moz-transition: all 0.5s ease; | | -moz-transition: all 0.5s ease; |
| Line 185: |
Line 42: |
| -ms-transition: all 0.5s ease; | | -ms-transition: all 0.5s ease; |
| transition: all 0.5s ease; | | transition: all 0.5s ease; |
| margin: 10px; | | margin: auto; |
| -moz-box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.75); | | -moz-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.75); |
| webkit-box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.75); | | webkit-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.75); |
| box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.75); | | box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.75); |
| }
| | } |
|
| | @media only screen and (min-width: 200px) { |
| .gallery-container img:hover {
| | .image-gallery { |
| -webkit-transform: scale(1.3);
| | flex-direction: row; |
| -moz-transform: scale(1.3);
| | } |
| -o-transform: scale(1.3);
| | |
| -ms-transform: scale(1.3);
| |
| transform: scale(1.3);
| |
| cursor: pointer;
| |
| }
| |
|
| |
| @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-style: none;
| |
| }
| |
|
| |
| .hooks-table td:nth-child(1) {
| |
| width: 35%;
| |
| }
| |
| }
| |
| </css> | | </css> |
| }} | | }} |
|
| |
|
| <div class="container color-bg-dark">
| |
| <div class="heroImage w-100 hide-mobile" id="topImage">[[File:Lowebanner4.png]]</div>
| |
|
| |
|
| <div id="top-section" class="flex w-100">
| | {| align="center" width="700" |
| <div class=" info-section flex flex-col color-bg-light"> | | |- |
| <div class=" w-100 info-portrait">[[File: Lowe 13.png]]</div> | | | |
| <table>
| | <div class="body"> |
| <tr>
| | <div style="width: 775px; padding: 25px; border: 2px solid #d1ae79; background: #000000; color: #595959"> |
| <td>Full Name:</td>
| | [[Image:Jared_Celma_01_BG_crop.jpg|775px|center]] |
| <td>Lowe Brightland</td>
| |
| </tr>
| |
| <tr>
| |
| <td>Position:</td>
| |
| <td> </td>
| |
| </tr>
| |
| <tr>
| |
| <td>Demeanor:</td>
| |
| <td></td>
| |
| </tr>
| |
| </table>
| |
| <hr class="color-accent-light" />
| |
| <hr class="color-accent-light" />
| |
| <table>
| |
| <tr>
| |
| <td>Height:</td>
| |
| <td></td>
| |
| </tr>
| |
| <tr>
| |
| <td>Weight:</td>
| |
| <td></td>
| |
| </tr>
| |
| <tr>
| |
| <td>Hair:</td>
| |
| <td></td>
| |
| </tr>
| |
| <tr>
| |
| <td>Eyes:</td>
| |
| <td></td>
| |
| </tr>
| |
| <tr>
| |
| <td>Apparent Age:</td>
| |
| <td>Mid 20's</td>
| |
| </tr>
| |
| </table>
| |
| <hr class="color-accent-light" />
| |
| <div class="w-100">[[File:Lowe clan.png]]</div>
| |
| </div>
| |
|
| |
|
| <div class=" w- 100 show- mobile">[[ File: Lowe 2. png]]</div> | | <div style="vertical-align: top; float: right; margin-top: 2em; padding: 1em; border: 2px #d1ae79 solid; margin-left: 1em; background: #e3ccaa; max-width: 270px"> |
| | {| |
| | | colspan="2" | <div style="margin-top: 1em">[[Image:Jared_Celma_02.jpg|x300px|center]]<br></div> |
| | <div style="text-align: center; color: #3e382f">''<font style="color: #3e382f; font-size: 25pt; font-family:'Comforter', cursive">"Power tends to corrupt, <br>and absolute power<br>absolutely corrupts.”<br>- Lord Acton</font>''<br><font size="3">'''<big></big>'''</font></div><br /> |
| | |- |
| | | class="left" style="vertical-align: top" | '''Name:''' |
| | | Lowe Brightland |
| | |- |
| | | class="left" style="vertical-align: top" | '''Apparent Age:''' |
| | | Late teens - early 20s |
| | |- |
| | | class="left" style="vertical-align: top" | '''Birthday:''' |
| | | May 30 |
| | |- |
| | | class="left" style="vertical-align: top" | '''Hometown:''' |
| | | Newport Beach, CA |
| | |- |
| | | class="left" style="vertical-align: top" | '''Occupation:''' |
| | | Entrepreneur |
| | |- |
| | | class="left" style="vertical-align: top" | '''Demeanor:''' |
| | | Competitor |
| | |- |
| | | class="left" style="vertical-align: top" | '''Flavor:''' |
| | | Kindred |
| | |- |
| | | class="left" style="vertical-align: top" | '''Clan:''' |
| | | Ventrue |
| | |- |
| | | class="left" style="vertical-align: top" | '''Resides:''' |
| | | Studio City |
| | |- |
| | | colspan="2" | |
| | |} |
| | </div> |
| | <font style="color: #d1ae79; font-size: 60pt; font-family:'Comforter', cursive">Lowe</font><br/> |
|
| |
|
| <div class="bio-section flex flex-col section">
| | <font style="color: #d1ae79; font-size: 30pt; font-family:'Comforter', cursive">Hooks</font> |
| <div class="label color-shade-light text-center" style="font-family: "Tangerine", cursive;font-weight: 700;font-style: bold;font-size:52px;">Tale So Far</div>
| |
| <hr class="color-shade-light" />
| |
| <div class="color-shade-light ph-1" style="font-family: "Tangerine", cursive;font-weight: 700;font-style: normal;font-size:18px;">
| |
| <p>Background story of Lowe</p>
| |
|
| |
|
|
| | * <span style="color:#d1ae79">'''Coming soon'''</span>: Coming soon |
| </div>
| |
| </div>
| |
|
| |
|
| </div>
| | * <span style="color:#d1ae79">'''Coming soon'''</span>: Coming soon |
|
| |
|
| <div class="heroImage w-100">[[File:Lowe_1.png]]</div>
| | * <span style="color:#d1ae79">'''Coming soon'''</span>: Coming soon |
|
| |
|
| <div class="section color-bg-light" style="font-family: "Tangerine", cursive;font-style: normal;font-size:32px;">
| | * <span style="color:#d1ae79">'''Coming soon'''</span>: Coming soon |
|
| |
|
| |
|
| <div class="label text-center" style="font-family: "Tangerine", cursive;font-size:52px;">Roleplay Hooks</div><hr>
| | * <span style="color:#d1ae79">'''Coming soon'''</span>: Coming soon |
|
| |
|
| | <br><font style="color: #d1ae79; font-size: 30pt; font-family:'Comforter', cursive">Music</font> <br> |
|
| |
|
| <table class="hooks-table" style="font-size:15px;">
| | [https://www.youtube.com/watch <span class="hilite2">Coming soon</span>] |
| <tr>
| |
| <td>Hook 1</td>
| |
| <td style="font-family: "Tangerine", cursive;font-weight: 700;font-style: normal;">Hook Info 1</td>
| |
| </tr>
| |
| <tr>
| |
| <td>Hook 2</td>
| |
| <td style="font-family: "Tangerine", cursive;font-weight: 700;font-style: normal;">Hook Info 2</td>
| |
| </tr>
| |
| <tr>
| |
| <td>Hook 3</td>
| |
| <td style="font-family: "Tangerine", cursive;font-weight: 700;font-style: normal;">Hook Info 3</td>
| |
| </tr>
| |
| </table>
| |
| </div>
| |
|
| |
|
| <div class="heroImage w-100">[[File:Lowe_2.png]]</div>
| |
|
| |
|
| <div class="section color-bg-dark color-shade-light"> | | <div style="clear: both"> |
| <div class="label text-center" style="font-family: "Tangerine", cursive;font-weight: 700;font-style: normal;font-size:30px;">Contacts</div> | | </div> |
| | | <div class="container"> |
| <table class="contacts-table" "> | | <div class="image-gallery"> |
| <tr> | | <div class="column"> |
| <td>[[Person 1|Person 1]]</td> | | <div class="image-item"> |
| <td>First contact.</td>
| | [[File:Jared_Celma_03_210.png]] |
| </tr>
| | </div> |
| <tr>
| | <div class="image-item"> |
| <td>[[Person 2|Person 2]]</td>
| | [[File:Jared_Celma_04_210.jpg]] |
| <td>Second contact</td>
| | </div> |
| </tr> | | </div> |
| </table> | | <div class="column"> |
| | <div class="image-item"> |
| | [[File:Jared_Celma_08_210.jpg]] |
| | </div> |
| | <div class="image-item"> |
| | [[File:Jared_Celma_09_210.jpg]] |
| | </div> |
| | </div> |
| | <div class="column"> |
| | <div class="image-item"> |
| | [[File:Jared_Celma_10_210.png]] |
| | </div> |
| | <div class="image-item"> |
| | [[File:Jared_Celma_14_210.jpg]] |
| | </div> |
| | </div> |
| </div> | | </div> |
|
| |
|
| <div class="heroImage w-100" >[[File:Lowe_4.png]]</div>
| |
|
| |
|
| <div class="section color-bg-light color-shade-dark" id="logs-section">
| | </div> |
| <div class="label text-center" style="font-family: "Tangerine", cursive;font-weight: 700;font-style: normal;font-size:32px;">Logs</div>
| |
| | |
| {{#dpl:
| |
| |linksto={{PAGENAME}}
| |
| |category=Logs
| |
| |columns=3
| |
| |noresultsheader=<i>No logs have been posted yet.</i>
| |
| }}
| |
| </div>
| |
| | |
| <div class="heroImage w-100">[[File:Lowe_5.png]]</div>
| |
| | |
| <div class="section color-bg-dark color-shade-light" id="gallery-section">
| |
| <div class="label text-center" style="font-family: "Tangerine", cursive;font-weight: 700;font-style: normal;font-size:82px;">Gallery</div><hr>
| |
| | |
| <div class="gallery-container">[[File:Lowe_6.png]]</div>
| |
| </div>
| |
| </div>
| |
|
| |
|
| [[Category:Characters]] | | [[Category:Characters]] |
| | [[Category:Active PCs]] |
