daniel/lolra
1
0
Fork 0
mirror of https://github.com/cnlohr/lolra.git synced 2026-06-17 00:09:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix stylization for firefox

Browse Source
This commit is contained in:
cnlohr
2024-10-28 20:08:03 -07:00
parent ac768babae
commit 710a07d913
3 changed files with 26 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ch32v/lib/calculator.css
+5 -14
View File
@@ -26,22 +26,12 @@ SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
src: url('AudioLinkMono-Bold.ttf') format('truetype') src: url('AudioLinkMono-Bold.ttf') format('truetype')
} }
@property --dark {
syntax: "<color>";
inherits: true;
initial-value: #111;
}
@property --light {
syntax: "<color>";
inherits: true;
initial-value: white;
}
:root { :root {
color-scheme: dark; color-scheme: dark;
--gl: radial-gradient(circle 1px at 0px 0px, var(--light) 1px, transparent 0); --gl: radial-gradient(circle 1px at 0px 0px, var(--light) 1px, transparent 0);
--gd: radial-gradient(circle 1px at 0px 0px, var(--dark) 1px, transparent 0); --gd: radial-gradient(circle 1px at 0px 0px, var(--dark) 1px, transparent 0);
--dark: #111;
--light: #eee;
--bg-0: var(--dark); --bg-0: var(--dark);
--bg-1: var(--gl) 0px 0px / 4px 4px, var(--dark); --bg-1: var(--gl) 0px 0px / 4px 4px, var(--dark);
--bg-2: var(--gl) 0px 0px / 4px 4px, var(--gl) 2px 2px / 4px 4px, var(--dark); --bg-2: var(--gl) 0px 0px / 4px 4px, var(--gl) 2px 2px / 4px 4px, var(--dark);
@@ -166,7 +156,7 @@ input::-webkit-inner-spin-button {
input[type=number] { input[type=number] {
background: var(--bg-0); background: var(--bg-0);
outline: 0; outline: 0;
/*text-indent: 12px;*/ -moz-appearance:textfield; /* Firefox */
padding-top: 1rem; padding-top: 1rem;
padding-bottom: 1rem; padding-bottom: 1rem;
padding-left: 1.1rem; padding-left: 1.1rem;
@@ -191,6 +181,7 @@ textarea,input:not([type='number']) {
outline: 0; outline: 0;
border-radius: .8rem; border-radius: .8rem;
padding: .5rem; padding: .5rem;
padding-bottom:.3rem;
text-shadow: var(--l-shadow); text-shadow: var(--l-shadow);
border: 1px var(--light) solid; border: 1px var(--light) solid;
animation: dark-to-light 200ms ease-out forwards; animation: dark-to-light 200ms ease-out forwards;
@@ -203,7 +194,7 @@ textarea,input:not([type='number']) {
} }
} }
button, input[type=submit] { button,input[type=submit] {
background: var(--bg-0); background: var(--bg-0);
border: 0; border: 0;
outline: 0; outline: 0;
ch32v/lib/calculator.html
+20 -13
View File
@@ -13,10 +13,20 @@ var darkmode = true;
function DrawSpan( rowspan, colspan, freq, target, docolor, extrastr = "" ) function DrawSpan( rowspan, colspan, freq, target, docolor, extrastr = "" )
{ {
var fdist = Math.abs( freq - target ); var fdist = Math.abs( freq - target );
fdist = Math.pow( fdist, 0.5 ) * 500; fdist = Math.pow( fdist, 0.5 ) * 300;
// if( fdist > 255 ) fdist = 255; if( fdist > 511 ) fdist = 511;
let ret = "<TD COLSPAN=" + colspan + ' ROWSPAN' + rowspan + ' '; let ret = "<TD COLSPAN=" + colspan + ' ROWSPAN' + rowspan + ' ';
if( docolor ) ret += 'STYLE="color:black;background-color:rgba(' + fdist + ',' + (511-fdist) + ',0,0.2)";';
let bg = 8 - fdist / 60;
if( bg < 0) bg = 0; if( bg > 8 ) bg = 8;
if( docolor ) ret += 'STYLE="color:var(--' + ((bg >= 3 ) ? 'dark' : 'light' ) + ');' +
'text-shadow: 1px 1px 2px ' + ((bg < 3 ) ? '#000' : '#fff' ) + ',' +
'-1px 1px 2px ' + ((bg < 3 ) ? '#000' : '#fff' ) + ',' +
'1px -1px 2px ' + ((bg < 3 ) ? '#000' : '#fff' ) + ',' +
'-1px -1px 2px ' + ((bg < 3 ) ? '#000' : '#fff' ) + ';' +
'background:var(--bg-' + bg.toFixed(0) + ');"';
//background-color:rgba(' + fdist + ',' + (511-fdist) + ',0,0.2)";';
ret += '>' + extrastr + freq.toFixed(6) + "</TD>"; ret += '>' + extrastr + freq.toFixed(6) + "</TD>";
return ret; return ret;
} }
@@ -222,7 +232,7 @@ function computeTable()
else if( goertzels ) else if( goertzels )
{ {
contents += contents +=
"<TABLE BORDER=1>" + "<TABLE>" +
"<TR><TD>Goertzel</TD></TR>" + "<TR><TD>Goertzel</TD></TR>" +
"<TR><TD>Goertzel (Inverse)</TD></TR>" + "<TR><TD>Goertzel (Inverse)</TD></TR>" +
"</TABLE><TEXTAREA ROWS=8 COLS=80 ID=goertzeloutput></TEXTAREA>" + "</TABLE><TEXTAREA ROWS=8 COLS=80 ID=goertzeloutput></TEXTAREA>" +
@@ -410,7 +420,6 @@ function computeTable()
contents += "</TABLE>"; contents += "</TABLE>";
} }
document.getElementById( "TABLE" ).innerHTML = contents; document.getElementById( "TABLE" ).innerHTML = contents;
} }
@@ -457,10 +466,9 @@ function onLoad()
</SCRIPT> </SCRIPT>
</HEAD> </HEAD>
<BODY onLoad="onLoad()"> <BODY onLoad="onLoad()">
<TABLE WIDTH=100%> <TABLE WIDTH=100%>
<TR> <TR>
<TD COLSPAN=3> <TD COLSPAN=2>
<p>Tool for computing tuning to specific frequencies by use of direct ADC reading at specific timer-controlled rate to "tune" to specific frequencies either by quadrature or differential.</p> <p>Tool for computing tuning to specific frequencies by use of direct ADC reading at specific timer-controlled rate to "tune" to specific frequencies either by quadrature or differential.</p>
</TD> </TD>
<TD ROWSPAN=2 VALIGN=TOP HEIGHT=200 WIDTH=100% ID=LiveGraphContainer> <TD ROWSPAN=2 VALIGN=TOP HEIGHT=200 WIDTH=100% ID=LiveGraphContainer>
@@ -484,7 +492,6 @@ function onLoad()
</TABLE> </TABLE>
</TD> </TD>
<TD VALIGN=TOP ROWSPAN=2> <TD VALIGN=TOP ROWSPAN=2>
Live Control:<br> Live Control:<br>
<TABLE><TR> <TABLE><TR>
<TD><INPUT TYPE=SUBMIT onClick="reqConnect()" VALUE="Open Device" ID=connectButton> <TD><INPUT TYPE=SUBMIT onClick="reqConnect()" VALUE="Open Device" ID=connectButton>
@@ -499,17 +506,17 @@ Live Control:<br>
</TR> </TR>
<tr> <tr>
<td> <td>
</td><td>
<div id=GeneralData></DIV> <div id=GeneralData></DIV>
<input type=checkbox ID=toggle_adc_buffer onchange='toggleBuffer(this)'>ADC Buffer Enable <input type=checkbox ID=toggle_adc_buffer onchange='toggleBuffer(this)'>ADC Buffer Enable
<BR>Pow2 Attenuation: <BR>Pow2 Attenuation:
<input id=g_attenuation_pow2 onwheel='attenuationpow2wheel(event, this)' size=3 type=number style="width:3em" value=3><br> <input id=g_attenuation_pow2 onwheel='attenuationpow2wheel(event, this)' size=3 type=number style="width:3em" value=3><br>
</td> </td>
</tr> </tr>
<tr><td>
<DIV STYLE="position:relative">
<DIV style="margin:0px;top:0px;position:absolute" ID=TABLE></DIV>
</DIV>
</td></tr>
</TABLE> </TABLE>
<DIV ID=TABLE></DIV>
</BODY> </BODY>
</HTML> </HTML>
ch32v/lib/webhidcontrol.js
+1 -1
View File
@@ -370,7 +370,7 @@ async function sendLoop()
(kBsecAvg).toFixed(2) + " kB/s<br>" + (kBsecAvg).toFixed(2) + " kB/s<br>" +
(xActionSecAvg).toFixed(2) + "x/s<br>"; (xActionSecAvg).toFixed(2) + "x/s<br>";
document.getElementById( "GeneralData" ).innerHTML = document.getElementById( "GeneralData" ).innerHTML =
"<TABLE WIDTH=100%><TR><TD width=25%>Count: " + goodCount + " / " + badCount + "</td>" + "<TABLE WIDTH=100% border=1><TR><TD width=25%>Count: " + goodCount + " / " + badCount + "</td>" +
"<td width=20%>Inten: " + ((Math.log( lastIntensity * lastIntensity )/Math.log(10)) * 10-120).toFixed(2) + "db (" + lastIntensity + ")</td>" + "<td width=20%>Inten: " + ((Math.log( lastIntensity * lastIntensity )/Math.log(10)) * 10-120).toFixed(2) + "db (" + lastIntensity + ")</td>" +
"<td width=20%>ADCs: " + (lastadc>>16).toFixed(0) + " / " + (lastadc&0xffff).toFixed(0) + "</td>" + "<td width=20%>ADCs: " + (lastadc>>16).toFixed(0) + " / " + (lastadc&0xffff).toFixed(0) + "</td>" +
"<td width=20%>Remote clock: <INPUT TYPE=SUBMIT VALUE=" + (remote_clock_mhz/1000000.0).toFixed(6) + ` ONMOUSEDOWN="document.getElementById('crystalmhz').value = ${remote_clock_mhz/1000000.0};">MHz ` + "</TD>" + "<td width=20%>Remote clock: <INPUT TYPE=SUBMIT VALUE=" + (remote_clock_mhz/1000000.0).toFixed(6) + ` ONMOUSEDOWN="document.getElementById('crystalmhz').value = ${remote_clock_mhz/1000000.0};">MHz ` + "</TD>" +