vilmibm/trunkless
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

another crappy WIP

Browse Source
This commit is contained in:
nate smith 2024-03-15 16:07:35 -07:00
parent 5c2278d6ee
commit 43f2d1b6d3
2 changed files with 20 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
assets/main.js
View File

@ -51,14 +51,14 @@ class LineRemover extends Button {
class LinePinner extends Button { class LinePinner extends Button {
connectedCallback() { connectedCallback() {
this.innerText = "pin"; this.innerText = "P";
this.setAttribute("title", "pin line in place"); this.setAttribute("title", "pin line in place");
} }
click() { click() {
const l = this.closest("div.line"); const l = this.closest("div.line");
l.classList.toggle("unpinned"); l.classList.toggle("unpinned");
if (l.classList.contains("unpinned")) { if (l.classList.contains("unpinned")) {
this.innerText = "pin"; this.innerText = "P";
this.classList.remove("pinned"); this.classList.remove("pinned");
this.setAttribute("title", "pin line in place"); this.setAttribute("title", "pin line in place");
} else { } else {

22
templates/index.tmpl
View File

@ -63,7 +63,7 @@ span.linetext {
<template id="linetmpl"> <template id="linetmpl">
<style> <style>
div.linetext { div.linetext {
font-size: 110%; font-size: 100%;
} }
div.rightside { div.rightside {
} }
@ -71,15 +71,28 @@ span.linetext {
font-size: 50%; font-size: 50%;
font-style: oblique; font-style: oblique;
padding-left: 10px; padding-left: 10px;
text-align: right;
} }
div.cont:hover { div.cont:hover {
background-color: rgba(255,255,255,.05); background-color: rgba(255,255,255,.05);
} }
.linectrl button { .linectrl button {
width: 40px; width: 30px;
height: 40px; height: 30px;
} }
</style> </style>
<div style="display: grid; grid-template-columns: 80% 20%">
<div>
<div class="linetext"></div>
<div class="source"></div>
</div>
<div class="linectrl">
<button is="line-pinner">P</button><button is="line-editor">E</button><button>M</button><button is="line-remover">X</button>
</div>
</div>
<!--
<div class="cont" style="display: grid; grid-template-columns: 80% 20%"> <div class="cont" style="display: grid; grid-template-columns: 80% 20%">
<div class="linetext"></div> <div class="linetext"></div>
<div class="rightside"> <div class="rightside">
@ -90,7 +103,7 @@ span.linetext {
<button is="line-pinner">pin</button><button is="line-editor">✎</button> <button is="line-pinner">pin</button><button is="line-editor">✎</button>
</div> </div>
<div> <div>
</button><button>M</button><button is="line-remover">X</button> <button>M</button><button is="line-remover">X</button>
</div> </div>
</div> </div>
</div> </div>
@ -98,6 +111,7 @@ span.linetext {
</div> </div>
</div> </div>
</div> </div>
-->
<!-- <!--
<span class="linectrl"> <span class="linectrl">
<button is="line-pinner">pin</button><button is="line-editor">✎</button><button is="line-upper">↑</button><button is="line-downer">↓</button><button is="source-shower"></button><button is="line-remover">X</button> <button is="line-pinner">pin</button><button is="line-editor">✎</button><button is="line-upper">↑</button><button is="line-downer">↓</button><button is="source-shower"></button><button is="line-remover">X</button>