deepcrayon
/
scrolltron
1
0
Fork 0
Code Releases Activity

Add multiple form fields

main
Jeff Moe 2022-12-25 15:50:53 -07:00
parent ea5fe03ad0
commit abde58c0f9
1 changed files with 22 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
src/routes/+page.svelte
View File

@ -15,7 +15,10 @@ function colorCallback(rgba) {
/** @type {import('./$types').ActionData} */ /** @type {import('./$types').ActionData} */
export let form; export let form;
let chyron_text = 'chyron text here. Mooooo. 1234567890. qwertyuyiop. asdfghjkl. zxcvbnm. chyron text here. Mooooo. 1234567890. qwertyuyiop. asdfghjkl. zxcvbnm.'; let chyron_text_01 = 'chyron text here. Mooooo. 1234567890. qwertyuyiop. asdfghjkl. zxcvbnm. chyron text here. Mooooo. 1234567890. qwertyuyiop. asdfghjkl. zxcvbnm.';
let chyron_text_02 = ''
let chyron_text_03 = ''
let chyron_text_04 = ''
</script> </script>
@ -27,18 +30,24 @@ let chyron_text = 'chyron text here. Mooooo. 1234567890. qwertyuyiop. asdfghjk
<div class="picker"> <div class="picker">
<HsvPicker on:colorChange={colorCallback} startColor={"#00FF00"}/> <HsvPicker on:colorChange={colorCallback} startColor={"#00FF00"}/>
</div> </div>
<p></p>
<div class="form"> <div class="form">
<p><input bind:value={chyron_text} placeholder="{chyron_text}"> <p>
</p> <input bind:value={chyron_text_01} placeholder="{chyron_text_01}">
<input bind:value={chyron_text_02} placeholder="{chyron_text_02}">
<input bind:value={chyron_text_03} placeholder="{chyron_text_03}">
<input bind:value={chyron_text_04} placeholder="{chyron_text_04}">
</p>
</div> </div>
</div>
<div class="horizontal"> <p></p>
<!-- delay affects text starting point offset--> <div class="horizontal">
<Ticker pausing=false duration=60 delay=-5> <!-- delay affects text starting point offset-->
{chyron_text} <Ticker pausing=false duration=60 delay=-10>
</Ticker> {chyron_text_01}
</div> {chyron_text_02}
{chyron_text_03}
{chyron_text_04}
</Ticker>
</div> </div>
@ -52,11 +61,11 @@ let chyron_text = 'chyron text here. Mooooo. 1234567890. qwertyuyiop. asdfghjk
margin:30px 5px; margin:30px 5px;
} }
.horizontal{ .horizontal{
padding:376px; padding:424px;
font-family: Verdana, sans-serif; font-family: Verdana, sans-serif;
font-weight: 600; font-weight: 600;
font-size: 2.75em; font-size: 2.75em;
background: rgba(128, 128, 128, 0); background: rgba(30, 24, 150, 0.4);
@keyframes horizontal { @keyframes horizontal {
100% { transform: translateX(-50%); } 100% { transform: translateX(-50%); }
} }