Commit b2fc23b1 authored by MaxSol1's avatar MaxSol1
Browse files

links for static text

parent e2c4f7a4
......@@ -14,30 +14,34 @@ export function StaticTextOptions({options, updateOptions}) {
<textarea class="form-control" id="text" name="text" value={options.text}
onInput={e => updateOptions({text: e.currentTarget.value})}>
</textarea>
<label for="font-size">Font Size</label>
<input class="form-control" id="font-size" name="font-size" type="number" min="0" value={options.fontSize}
onInput={e => updateOptions({fontSize: e.currentTarget.value})}/>
<label>Text Alignment</label>
<div class="selection" style="margin-bottom: 5px;">
<button class={`selector ${options.textAlign === 'start' ? 'active' : ''}`}
<button class={`selector ${options.textAlign === 'start' ? 'active' : ''}`}
onClick={e => updateOptions({textAlign: 'start'})}>Left</button>
<button class={`selector ${options.textAlign === 'center' ? 'active' : ''}`}
<button class={`selector ${options.textAlign === 'center' ? 'active' : ''}`}
onClick={e => updateOptions({textAlign: 'center'})}>Center</button>
<button class={`selector ${options.textAlign === 'flex-end' ? 'active' : ''}`}
<button class={`selector ${options.textAlign === 'flex-end' ? 'active' : ''}`}
onClick={e => updateOptions({textAlign: 'flex-end'})}>Right</button>
</div>
<div class="selection spacer">
<button class={`selector ${options.textVerticalAlign === 'start' ? 'active' : ''}`}
<button class={`selector ${options.textVerticalAlign === 'start' ? 'active' : ''}`}
onClick={e => updateOptions({textVerticalAlign: 'start'})}>Top</button>
<button class={`selector ${options.textVerticalAlign === 'center' ? 'active' : ''}`}
<button class={`selector ${options.textVerticalAlign === 'center' ? 'active' : ''}`}
onClick={e => updateOptions({textVerticalAlign: 'center'})}>Middle</button>
<button class={`selector ${options.textVerticalAlign === 'end' ? 'active' : ''}`}
<button class={`selector ${options.textVerticalAlign === 'end' ? 'active' : ''}`}
onClick={e => updateOptions({textVerticalAlign: 'end'})}>Bottom</button>
</div>
<label for="card-linking-url">Linking Url</label>
<input class="form-control" id="card-linking-url" name="card-linking-url" type="text" value={options.linkURL}
onInput={e => updateOptions({linkURL: e.currentTarget.value})}>
</input>
<label for="font-color">Font Color <a onClick={e => clearField(e, 'fontColor')}>clear</a></label>
<div class="lefty-righty spacer">
......@@ -73,7 +77,7 @@ export function StaticText({options}) {
if(typeof options.textVerticalAlign !== 'undefined') {
styles += `align-items: ${options.textVerticalAlign}; `;
}
return <div class="check-content text" style={styles}>
{options.text}
......
import { h } from 'preact';
import { h, options } from 'preact';
import { route } from 'preact-router';
import { useState, useEffect, useRef } from 'preact/hooks';
import { Link } from 'preact-router/match';
......@@ -60,7 +60,14 @@ export function Viewer({slug, dashboardReducer}) {
if(element.type === 'iframe-video') { ele = <IframeVideo options={element.options}/> }
if(element.type === 'audio-stream') { ele = <AudioStream options={element.options}/> }
if (element.options.linkURL) {
if (element.options.linkURL && element.type === 'static-text') {
if (element.options.linkURL.includes('http') ) {
ele = <a id="text-link" href={element.options.linkURL}>{ele}</a>
} else {
ele = <a id="text-link" href={`https://${element.options.linkURL}`}>{ele}</a>
}
} else if (element.options.linkURL) {
if (element.options.linkURL.includes('http') ) {
ele = <a id="a-link" href={element.options.linkURL}>{ele}</a>
} else {
......
......@@ -892,6 +892,20 @@ a#a-link {
height: 100% !important;
}
a#text-link {
position: relative;
display: block;
line-height: 5vh;
height: 100%;
}
.check > a#text-link > div.check-content.text {
line-height: 470%;
text-align: center;
height: 100% !important;
vertical-align: middle;
}
div.check-content.svg {
display: block;
line-height: 0;
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment