form template
parent
7a545b3a72
commit
74d45e311e
|
@ -11,6 +11,7 @@ function colorCallback(rgba) {
|
||||||
let horizontal = document.querySelector(".horizontal");
|
let horizontal = document.querySelector(".horizontal");
|
||||||
horizontal.style.color = `rgb(${r},${g},${b})`;
|
horizontal.style.color = `rgb(${r},${g},${b})`;
|
||||||
}
|
}
|
||||||
|
export let chyrontext='chyron text here. Mooooo. 1234567890. qwertyuyiop. asdfghjkl. zxcvbnm. chyron text here. Mooooo. 1234567890. qwertyuyiop. asdfghjkl. zxcvbnm.'
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
@ -23,28 +24,36 @@ function colorCallback(rgba) {
|
||||||
<HsvPicker on:colorChange={colorCallback} startColor={"#00FF00"}/>
|
<HsvPicker on:colorChange={colorCallback} startColor={"#00FF00"}/>
|
||||||
</div>
|
</div>
|
||||||
<p></p>
|
<p></p>
|
||||||
|
<div class="form">
|
||||||
|
<form method="POST">
|
||||||
|
<label>
|
||||||
|
<p>Text</p>
|
||||||
|
<input name="chyrontext" type="text">
|
||||||
|
</label>
|
||||||
|
<button>Update</button>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
<div class="horizontal">
|
<div class="horizontal">
|
||||||
<!-- delay affects text starting point offset-->
|
<!-- delay affects text starting point offset-->
|
||||||
<Ticker pausing=false duration=60 delay=-5>
|
<Ticker pausing=false duration=60 delay=-5>
|
||||||
foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr
|
<!-- foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr barrrr -->
|
||||||
|
{chyrontext}
|
||||||
</Ticker>
|
</Ticker>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
|
||||||
h3 {
|
h3 {
|
||||||
padding:0;
|
padding:0;
|
||||||
margin:0;
|
margin:0;
|
||||||
font-family: sans-serif;
|
font-family: sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
p {
|
p {
|
||||||
margin:30px 5px;
|
margin:30px 5px;
|
||||||
}
|
}
|
||||||
.horizontal{
|
.horizontal{
|
||||||
padding:516px;
|
padding:376px;
|
||||||
font-family: Verdana, sans-serif;
|
font-family: Verdana, sans-serif;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
font-size: 2.75em;
|
font-size: 2.75em;
|
||||||
|
@ -61,6 +70,13 @@ foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo foooo fo
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
font-size: 2.75em;
|
font-size: 2.75em;
|
||||||
background: rgba(128, 128, 128, 0);
|
background: rgba(128, 128, 128, 0);
|
||||||
|
}
|
||||||
|
.form{
|
||||||
|
color: rgb(156, 102, 30);
|
||||||
|
font-family: Verdana, sans-serif;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 2.75em;
|
||||||
|
background: rgba(128, 128, 128, 0);
|
||||||
}
|
}
|
||||||
.picker{
|
.picker{
|
||||||
color: rgb(61, 177, 206);
|
color: rgb(61, 177, 206);
|
||||||
|
|
Loading…
Reference in New Issue