Karakterlap-sablon 2.0

**Galactic Center** Wed Jul 13, 2022 10:11 pm

Karakter neve

KoraIDE

SzármazásIDE

FajIDE

RangIDE

KépességIDE

FoglalkozásIDE

FőkarakterIDE

Play byIDE

JELLEM

TÖRTÉNET

EGYÉB

jó és kevésbé jó oldal, hiányosságok

Ide jön minden, ami a karaktered jellemével kapcsolatos.

Minden, ami idáig vezetett

Minden, ami a karaktered számára fontos esemény megtörtént vele.

Ami még fontos lehet

Ha még van valami plusz, amit a fentiekbe nem tudtál beletenni, de számodra, vagy a karakter számára fontos lehet.

emme

Code:: <div class="MM075"><div><div class="MM075-tt">Karakter neve</div><hr> <span class="MM075-bo"><div class="MM075-img"><div style="background-image: url(https://i.imgur.com/BreiNGo.jpg);"></div></div><div class="MM075-dd"> <div><b>Kora</b>IDE</div> <div><b>Származás</b>IDE</div> <div><b>Faj</b>IDE</div> <div><b>Rang</b>IDE</div> <div><b>Képesség</b>IDE</div> <div><b>Foglalkozás</b>IDE</div> <div><b>Főkarakter</b>IDE</div> <div><b>Play by</b>IDE</div> </div></span><hr><div class="MM075-cn"><input type="radio" name="MM075" id="MM075-1" checked/><input type="radio" name="MM075" id="MM075-2" /><input type="radio" name="MM075" id="MM075-3" /><div class="MM075-lab"><label for="MM075-1"><div class="MM075-tt">JELLEM</div></label><label for="MM075-2"><div class="MM075-tt">TÖRTÉNET</div></label><label for="MM075-3"><div class="MM075-tt">EGYÉB</div></label></div> <div class="MM075-txt"> <div class="MM075-1"><span>jó és kevésbé jó oldal, hiányosságok</span><div> Ide jön minden, ami a karaktered jellemével kapcsolatos. </div></div> <div class="MM075-2"><span>Minden, ami idáig vezetett</span><div> Minden, ami a karaktered számára fontos esemény megtörtént vele. </div></div> <div class="MM075-3"><span>Ami még fontos lehet</span><div> Ha még van valami plusz, amit a fentiekbe nem tudtál beletenni, de számodra, vagy a karakter számára fontos lehet. </div></div> </div></div></div></div><a href="https://emmescodes.tumblr.com/" class="miMM">emme</a><link href="//dl.dropbox.com/s/hw1euzwqm52r3bk/IonCSS.css" rel="stylesheet"><style>@font-face { font-family: NewYork; src: url(https://dl.dropbox.com/s/esbjyrst1kgq99e/NewYork.otf); } .MM075, .MM075 * { box-sizing: border-box; transition: .3s; scrollbar-color: var(--mm-1) var(--mm-4) !important; scrollbar-width: thin; --mm-1: #B4B4B4; --mm-2: #999; --mm-3: #333; --mm-4: #131313; --mm-5: #202020; } .MM075 input, .MM075 br { display: none; } .MM075 { width: 520px; margin: 10px auto; border: 1px solid var(--mm-1); padding: 0 10px; text-align: center; font: 12px Calibri; color: var(--mm-2); } .MM075 > div { background: repeating-linear-gradient(35deg, var(--mm-4) 0px, var(--mm-4) 6px, var(--mm-5) 6px, var(--mm-5) 7px); border: 1px solid var(--mm-3); margin: -11px 0; } .MM075-dd, .MM075 > div > div { border: 1px solid var(--mm-3); background-color: var(--mm-4); padding: 20px; margin: 30px; } .MM075-tt { font: 22px NewYork; color: var(--mm-1); letter-spacing: 2px; } .MM075-tt > b { display: block; font: 12px calibri; text-transform: lowercase; color: var(--mm-2); letter-spacing: normal; } .MM075 hr { margin: 0 !important; border-top: 1px solid var(--mm-3) !important; } .MM075-bo { display: flex; } .MM075-img { width: 200px; border-right: 1px solid var(--mm-3); padding: 5px; position: relative; } .MM075-img::before { content: ""; position: absolute; border: 1px solid var(--mm-1); top: -11px; left: -12px; right: -11px; bottom: -11px; } .MM075-img > div { border: 1px solid var(--mm-3); height: 100%; background-position: center; background-size: cover; } .MM075-dd { flex: 1; padding: 5px; } .MM075-dd > div ~ div { margin-top: 5px; } .MM075-dd > div { padding: 5px; font-size: 14px; border: 1px solid var(--mm-3); } .MM075-dd > div:hover { border: 1px solid var(--mm-1); } .MM075-dd b { display: block; font-size: 10px; text-transform: uppercase; letter-spacing: 2px; color: var(--mm-1); } .MM075-cn { padding: 0 !important; } .MM075-lab { border-bottom: 1px solid var(--mm-3); padding: 2.5px; display: flex; } .MM075-lab > label { border: 1px solid var(--mm-3); padding: 15px; margin: 2.5px; flex-grow: 1; font-size: 20px; color: inherit !important; cursor: pointer; } #MM075-1:checked ~ div label[for*="-1"], #MM075-2:checked ~ div label[for*="-2"], #MM075-3:checked ~ div label[for*="-3"], .MM075-lab > label:hover { border-color: var(--mm-1); } .MM075-lab > label i { display: block; } #MM075-1:checked ~ div label[for*="-1"] i, #MM075-2:checked ~ div label[for*="-2"] i, #MM075-3:checked ~ div label[for*="-3"] i { color: var(--mm-1); transform: scale(1.3); } .MM075-txt { padding: 30px; position: relative; } .MM075-txt > div ~ div { position: absolute; top: 30px; left: 30px; bottom: 30px; right: 30px; } .MM075-txt > div { pointer-events: none; opacity: 0; } #MM075-1:checked ~ div .MM075-1, #MM075-2:checked ~ div .MM075-2, #MM075-3:checked ~ div .MM075-3 { pointer-events: auto; opacity: 1; } .MM075-txt > div > span { display: flex; flex-direction: column; align-items: center; } .MM075-txt > div > span > b { font: 18px NewYork; letter-spacing: 3px; border-bottom: 1px solid var(--mm-1); padding: 0 20px 0 23px; } .MM075-txt > div > div { height: 180px; margin-top: 20px; width: 100%; text-align: justify; overflow: auto; padding-right: 5px; } .MM075-txt > div > div br { display: block; } .MM075-txt > div > div br + br { margin: 5px; } .MM075 div::-webkit-scrollbar { width: 5px !important; height: 5px !important; background: var(--mm-4) !important; } .MM075 div::-webkit-scrollbar-thumb { background: var(--mm-1) !important; } .miMM { display: block; font: bold 10px Calibri; letter-spacing: 2px; text-align: center; transition: 0.5s; text-transform: uppercase; padding: 3px; color: #444; } .miMM:hover { letter-spacing: 3px; }</style>