security_vision/chronodiagram
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Change: tags in sidebar

Browse source
This commit is contained in:
Ruben van de Ven 2022-05-31 14:03:50 +02:00
parent fd408f549c
commit c908bf16af
2 changed files with 27 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
app/www/annotate.js
View file

@ -148,6 +148,7 @@ class Annotator extends EventTarget {
}); });
this.wrapperEl = wrapperEl; this.wrapperEl = wrapperEl;
this.svgEl = document.createElementNS('http://www.w3.org/2000/svg', 'svg'); this.svgEl = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
this.wrapperEl.appendChild(this.svgEl); this.wrapperEl.appendChild(this.svgEl);
this.wrapperEl.classList.add(this.config.is_player ? "svganim_player" : "svganim_annotator"); this.wrapperEl.classList.add(this.config.is_player ? "svganim_player" : "svganim_annotator");
@ -274,7 +275,7 @@ class Annotator extends EventTarget {
}); });
this.tagsEl.appendChild(tagEl); this.tagsEl.appendChild(tagEl);
this.controlsEl.appendChild(this.tagsEl); this.wrapperEl.appendChild(this.tagsEl);
this.commentEl = document.createElement('input'); this.commentEl = document.createElement('input');
this.commentEl.type = 'text'; this.commentEl.type = 'text';

37
app/www/svganim.css
View file

@ -93,9 +93,9 @@ path.before_in {
.scrubber {} .scrubber {}
.tags { .tags {
line-height: 40px; line-height: 1.5;
display: flex; /* display: flex;
flex-direction: row; flex-direction: row; */
padding: 0; padding: 0;
margin: 0; margin: 0;
} }
@ -257,13 +257,17 @@ path.before_in {
width: 100px; width: 100px;
/* as wide as audio controls only */ /* as wide as audio controls only */
overflow: hidden; overflow: hidden;
white-space: nowrap; /* white-space: nowrap; */
left: -50px; left: -50px;
grid-area: sidebar;
} }
.audioconfig:hover { .audioconfig:hover {
width: auto; width: auto;
left: 0px; left: 0px;
overflow: visible;
height: 200px;
} }
.audioconfig select, .audioconfig select,
@ -279,28 +283,37 @@ audio {
.svganim_annotator { .svganim_annotator {
display: flex; display: grid;
flex-direction: column; flex-direction: column;
height: 100%; height: 100%;
grid-template-rows: 40px auto 100px;
grid-template-columns: 200px auto;
gap: 10px;
overflow: hidden;
} }
.svganim_annotator svg { .svganim_annotator svg {
top: 20px; top: auto;
background: white; background: white;
margin-left: 20px; margin-left: 0;
flex-shrink: 1;
flex-grow: 1;
position: static; position: static;
height: auto;
width: auto;
} }
.svganim_annotator .tags {
grid-area: 2/1/2/1;
}
.svganim_annotator .audioconfig { .svganim_annotator .audioconfig {
order: -1;
flex-grow: 0;
flex-shrink: 0;
position: static; position: static;
grid-area: 1/1/1/1;
} }
.svganim_annotator > svg {
grid-area: 1/2/2/2;
}
.svganim_annotator .controls { .svganim_annotator .controls {
grid-area: 3/2/3/2;
margin-left: 5%; margin-left: 5%;
position: static !important; position: static !important;
} }