Tales of
Sinnoh

Marieke maakt soms sheets - do apr 08, 2021 2:45 pm

draw the curtains, take the stage
smoke and mirrors underway

Hoi, ik maak zo nu en dan post sheets of templates of hoe je die dingen ook wil noemen xD Deze zijn gratis te gebruiken en dergelijke, maar ik wil wel graag dat ze enkel op Tales of Sinnoh blijven. Dit betekent dus dat ik liever niet heb dat je ze op andere fora gaat gebruiken.

De eerste sheet is deze die je hier ziet, momenteel is ie aangekleed op Tyson's voorkeur maar is vrij makkelijk te veranderen :3
Hij heeft een plaatje en rekt uit met meer tekst. Het plaatje is 500 bij 300 pixels groot en kan aangepast worden door de http://picsum.photos/500/300 link te vervangen met een andere plaatjeslink. Vervang voor het gebruik van deze sheet wel CHARNAME naar de naam van het character waar deze voor gebruikt wordt. Als je dit niet doet heb je kans op problemen als deze sheet meerdere keren gebruikt wordt door verschillende personen op dezelfde pagina. Verder kun je de accentkleur voor bold tekst en de tekst in dat balkje hier beneden veranderen door #8c5c91 naar een andere hexcode te veranderen.

Er zijn twee versies van deze sheet: eentje met "spotlight"-effect op het plaatje en eentje zonder. Deze voorbeeldsheet gebruikt de versie met spotlight.

notes go here uwu

thx

met spotlight

Code:: <div id="CHARNAME" class="ToScont"><div class="ToSimg"><div class="ToSimgeffect"></div><div class="ToSquote">quote line 1<br>quote line 2</div></div><div class="ToSpost">POST HIER</div><div class="ToSbottom">notes go here uwu</div></div><div style="font-size:10px;width:500px;margin:0 auto;text-align:right;"><a href="https://talesofsinnoh.actieforum.com/u33">thx</a></div><link rel="preconnect" href="https://fonts.gstatic.com"><link href="https://fonts.googleapis.com/css2?family=Merriweather&family=Merriweather+Sans&family=Nixie+One&display=swap" rel="stylesheet"><style>#CHARNAME .ToSimgeffect, #CHARNAME .ToSimg{background-image:url(http://picsum.photos/500/300);}#CHARNAME .ToSpost b, #CHARNAME .ToSbottom{color:#8c5c91;}.ToScont{width:500px;margin:0 auto;background-color:#f5f5f5;overflow:hidden;border-radius:5px;}.ToSimg{width:500px;height:300px;background-size:cover;}.ToSimgeffect{width:500px;height:300px;clip-path: polygon(50% 0, 85% 0, 95% 100%, 20% 100%);filter:brightness(125%);}.ToSquote{position:relative;font-family:nixie one;font-size:30px;color:#fefefe;top:-175px;text-align:center;mix-blend-mode:overlay;color:white;text-transform:lowercase;line-height:30px;}.ToSpost{padding:30px;font-size:12px;font-family:merriweather;text-align:justify;color:#666;}.ToSpost b{font-family:merriweather sans;}.ToSbottom{height:25px;background-color:#dedede;font-family:merriweather sans;text-align:center;font-size:10px;font-weight:bold;line-height:25px;}</style>

zonder spotlight

Code:: <div id="CHARNAME" class="ToScont"><div class="ToSimg"><div class="ToSquote">quote line 1<br>quote line 2</div></div><div class="ToSpost">POST HIER</div><div class="ToSbottom">notes go here uwu</div></div><div style="font-size:10px;width:500px;margin:0 auto;text-align:right;"><a href="https://talesofsinnoh.actieforum.com/u33">thx</a></div><link rel="preconnect" href="https://fonts.gstatic.com"><link href="https://fonts.googleapis.com/css2?family=Merriweather&family=Merriweather+Sans&family=Nixie+One&display=swap" rel="stylesheet"><style>#CHARNAME .ToSimgeffect, #CHARNAME .ToSimg{background-image:url(http://picsum.photos/500/300);}#CHARNAME .ToSpost b, #CHARNAME .ToSbottom{color:#8c5c91;}.ToScont{width:500px;margin:0 auto;background-color:#f5f5f5;overflow:hidden;border-radius:5px;}.ToSimg{width:500px;height:300px;background-size:cover;}.ToSquote{position:relative;font-family:nixie one;font-size:30px;color:#fefefe;top:125px;text-align:center;mix-blend-mode:overlay;color:white;text-transform:lowercase;line-height:30px;}.ToSpost{padding:30px;font-size:12px;font-family:merriweather;text-align:justify;color:#666;}.ToSpost b{font-family:merriweather sans;}.ToSbottom{height:25px;background-color:#dedede;font-family:merriweather sans;text-align:center;font-size:10px;font-weight:bold;line-height:25px;}</style>

Re: Marieke maakt soms sheets - za apr 10, 2021 12:39 pm

hoi, ik had een foutje gemaakt in de coding van de sheet zonder spotlight waardoor de quote op het plaatje raar zou doen, maar dat probleem is nu gefixt uwu

Re: Marieke maakt soms sheets - di apr 13, 2021 10:00 am

quote goes here

Halloooooooo daar ben ik weer met een leuke nieuwe sheet :3
Deze heeft een leuke knop (die met de pokéball linksonder) waarmee je kunt zien welke Pokémon er op dit moment in het team van degene die deze gebruikt zitten. Klik er maar eens op, je zult vast snel zien dat er iets gebeurt (: Het grote plaatje van deze sheet gebruikt op het moment een placeholder link die telkens een ander plaatje laat zien, sorry als dit verwarrend is.

dit is gewone tekst, dit is bolded tekst, en verder heb ik geen speciale styles toegevoegd aan de tekst van deze ^^" De accentkleur is #db7f7f en kan vervangen worden aan het begin van de style. Het grote plaatje kan vervangen worden door http://picsum.photos/500/250 te vervangen door een andere plaatjes-url, en de Pokémon/Pokéball icoontjes kunnen vervangen worden door de https://img.pokemondb.net/sprites/sword-shield/icon/ditto.png (voor Ditto) en https://2img.net/r/hpimg4/pics/419027poke2.png (voor de pokéball) te veranderen.

Ik raad je aan om voor het gebruik van deze sheet alle plekken in de code waar TEAM staat te vervangen met de naam van je character of een ander woord, zodat de CSS en zo niet in de war raken.

~~disclaimer: ik heb niet heel veel ervaringen met toggle sheets, dus als er iets fout gaat kan ik niet beloven dat ik kan helpen ówò~~

notes and such go here, please try to keep it to a max of 2 lines

thx

Code:: <div class="TEAMcont"><input type="checkbox" id="TEAMpoketoggle"><div class="TEAMimg"><div class="TEAMmons"><div class="TEAMmon" style="background-image:url(https://img.pokemondb.net/sprites/sword-shield/icon/ditto.png)" title="POKÉMON NAME"></div><div class="TEAMmon" style="background-image:url(https://img.pokemondb.net/sprites/sword-shield/icon/ditto.png)" title="POKÉMON NAME"></div><div class="TEAMmon" style="background-image:url(https://img.pokemondb.net/sprites/sword-shield/icon/ditto.png)" title="POKÉMON NAME"></div><div class="TEAMmon" style="background-image:url(https://2img.net/r/hpimg4/pics/419027poke2.png)" title="POKÉMON NAME"></div><div class="TEAMmon" style="background-image:url(https://2img.net/r/hpimg4/pics/419027poke2.png)" title="POKÉMON NAME"></div><div class="TEAMmon" style="background-image:url(https://2img.net/r/hpimg4/pics/419027poke2.png)" title="POKÉMON NAME"></div></div></div><div class="TEAMquote">quote goes here</div><div class="TEAMpost">POST HIER</div><div class="TEAMbottom"><label for="TEAMpoketoggle"><div class="TEAMbutton" title="Current Team"></div></label><div class="TEAMnotes">notes and such go here, please try to keep it to a max of 2 lines</div></div></div><div style="font-size:10px;width:500px;margin:0 auto;text-align:right;"><a href="https://talesofsinnoh.actieforum.com/u33">thx</a></div><link rel="preconnect" href="https://fonts.gstatic.com"><link href="https://fonts.googleapis.com/css2?family=Charm&family=Lexend&display=swap" rel="stylesheet"><style>.TEAMcont{--accent:#db7f7f;width:500px;background-color:#fafafa;margin:0 auto;border:3px solid var(--accent);font-family:lexend;font-size:12px;color:#666;}.TEAMimg{width:494px;height:250px;background-image:url(http://picsum.photos/500/250);overflow:hidden;background-dize:cover;}.TEAMmons{display:flex;justify-content:space-between;background-color:var(--accent);height:55px;transition:0.5s;position:relative;top:250px;}.TEAMmon{width:50px;height:50px;background-position:center;background-repeat:no-repeat;border-radius:100%;background-color:white;margin-top:2px;}.TEAMquote{height:30px;font-size:30px;line-height:30px;text-align:center;font-family:charm;color:var(--accent);}.TEAMpost{padding:10px;text-align:justify;}.TEAMpost b, .TEAMpost a{color:var(--accent)!important;}.TEAMcont input[type=checkbox]{display:none;}.TEAMbottom{display:flex;}.TEAMbutton{width:50px;height:50px;background-position:center;background-repeat:no-repeat;background-image:url(https://cdn.bulbagarden.net/upload/9/93/Bag_Pok%C3%A9_Ball_Sprite.png);background-color:white;border:1px solid var(--accent);position:relative;left:-15px;bottom:-15px;cursor:pointer;}.TEAMcont input[type=checkbox]:checked ~ .TEAMimg .TEAMmons{top:195px;}.TEAMnotes{width:450px;magin-left:45px;padding-right:5px;text-align:right;height:35px;margin-top:15px;}</style>

Re: Marieke maakt soms sheets - wo apr 14, 2021 4:47 pm

a quote or something similar goes here obviously

Sheet nummer drie is ook weer klaar hoor (:

Deze rekt gewoon uit als er meer tekst in komt, en als je met je muis over deze sheet heen gaat komt er aan de zijkant een team aan kleine Pokémon icoontjes tevoorschijn.
Dit is gewone tekst, dit is bold.
Het plaatje aan de zijkant is 175 bij 175 pixels en is aan te passen door de http://picsum.photos/175 link te vervangen. De accentkleur is #7cb17e en is aan het begin van de style aan te passen. De Pokémon icoontjes zijn aan te passen door de https://img.pokemondb.net/sprites/sword-shield/icon/ekans.png link te vervangen door een andere (of gewoon het ekans deel te veranderen naar een andere Pokémon naam in lowercase).

Vervang voor het gebruik alsjeblieft alle plekken waar NOODLE staat naar de naam van je character of zo (:

notes and tags go here if you have them

thx

Code:: <div class="NOODLEcont"><div class="NOODLEright"><div class="NOODLEicon"></div><div class="NOODLEquote">a quote or something similar goes here obviously</div><div class="NOODLEmons"><div style="background-image:url(https://img.pokemondb.net/sprites/sword-shield/icon/ekans.png);" class="NOODLEmonn" title="NAME // LVL00" title="NAME // LVL00"></div><div style="background-image:url(https://img.pokemondb.net/sprites/sword-shield/icon/ekans.png);" class="NOODLEmonn" title="NAME // LVL00"></div><div style="background-image:url(https://img.pokemondb.net/sprites/sword-shield/icon/ekans.png);" class="NOODLEmonn" title="NAME // LVL00"></div><div style="background-image:url(https://img.pokemondb.net/sprites/sword-shield/icon/ekans.png);" class="NOODLEmonn" title="NAME // LVL00"></div><div style="background-image:url(https://img.pokemondb.net/sprites/sword-shield/icon/ekans.png);" class="NOODLEmonn" title="NAME // LVL00"></div><div style="background-image:url(https://img.pokemondb.net/sprites/sword-shield/icon/ekans.png);" class="NOODLEmonn" title="NAME // LVL00"></div></div></div><div class="NOODLEleft">POST GOES HERE<div class="NOODLEnotes">notes and tags go here if you have them</div></div></div><div style="font-size:10px;width:550px;margin:0 auto;text-align:right;"><a href="https://talesofsinnoh.actieforum.com/u33">thx</a></div><link rel="preconnect" href="https://fonts.gstatic.com"><link href="https://fonts.googleapis.com/css2?family=Crimson+Text:wght@600&family=RocknRoll+One&display=swap" rel="stylesheet"><style>.NOODLEcont{--NOODLEaccent:#7cb17e;width:540px;background-color:#fafafa;border:3px solid #eee;padding:20px;margin:0 auto;display:flex;justify-content:space-between;overflow:hidden;}.NOODLEleft{width:300px;font-family:crimson text;font-size:14px;color:#666;text-align:justify;}.NOODLEleft b{color:var(--NOODLEaccent);font-family:rocknroll one;font-size:12px;}.NOODLEnotes{margin-top:10px;color:var(--NOODLEaccent);font-family:rocknroll one;font-size:10px;text-align:right;}.NOODLEright{width:190px;}.NOODLEicon{width:175px;height:175px;border:5px solid var(--NOODLEaccent);background-image:url(http://picsum.photos/175);background-size:cover;margin:10px auto;border-radius:100%;}.NOODLEquote{font-family:rocknroll one;font-size:10px;letter-spacing:4px;text-align:center;color:var(--NOODLEaccent);}.NOODLEmons{display:flex;justify-content:center;flex-wrap:wrap;position:relative;left:-300px;transition:1s;}.NOODLEmonn{height:75px;width:75px;background-position:center;background-repeat:no-repeat;}.NOODLEcont:hover .NOODLEmons{left:0px;}</style>

Tales of Sinnoh

Start the journey of a lifetime

Switch account

Tales of
Sinnoh