1
0
mirror of https://github.com/morris/vanilla-todo.git synced 2025-08-22 13:43:06 +02:00

add html comments to html template strings

This commit is contained in:
Morris Brodersen
2023-12-05 00:27:22 +01:00
parent faf05386c4
commit a0109a8b5e
9 changed files with 11 additions and 11 deletions

View File

@@ -1,11 +1,11 @@
import { AppIcon } from './AppIcon.js'; import { AppIcon } from './AppIcon.js';
import { formatMonth } from './util.js'; import { formatMonth } from './util.js';
const datesCell = ` const datesCell = /* html */ `
<td><button class="app-button"></button></td> <td><button class="app-button"></button></td>
`; `;
const datesRow = ` const datesRow = /* html */ `
<tr> <tr>
${datesCell} ${datesCell}
${datesCell} ${datesCell}
@@ -28,7 +28,7 @@ export function AppDatePicker(el) {
}; };
let show = false; let show = false;
el.innerHTML = ` el.innerHTML = /* html */ `
<h4 class="header"> <h4 class="header">
<button class="app-button -circle previousmonth"> <button class="app-button -circle previousmonth">
<i class="app-icon" data-id="chevron-left-16"></i> <i class="app-icon" data-id="chevron-left-16"></i>

View File

@@ -13,7 +13,7 @@ import { TodoLogic } from './TodoLogic.js';
export function TodoApp(el) { export function TodoApp(el) {
let todoData = TodoLogic.initTodoData(); let todoData = TodoLogic.initTodoData();
el.innerHTML = ` el.innerHTML = /* html */ `
<header class="app-header"> <header class="app-header">
<h1 class="title">VANILLA TODO</h1> <h1 class="title">VANILLA TODO</h1>
<p class="app-fps fps"></p> <p class="app-fps fps"></p>

View File

@@ -11,7 +11,7 @@ export function TodoCustomList(el) {
let startEditing = false; let startEditing = false;
let saveOnBlur = true; let saveOnBlur = true;
el.innerHTML = ` el.innerHTML = /* html */ `
<div class="header"> <div class="header">
<h3 class="title"></h3> <h3 class="title"></h3>
<p class="form"> <p class="form">

View File

@@ -8,7 +8,7 @@ export function TodoDay(el) {
const dateId = el.dataset.key; const dateId = el.dataset.key;
let items = []; let items = [];
el.innerHTML = ` el.innerHTML = /* html */ `
<div class="header"> <div class="header">
<h3 class="dayofweek"></h3> <h3 class="dayofweek"></h3>
<h6 class="date"></h6> <h6 class="date"></h6>

View File

@@ -9,7 +9,7 @@ import { TodoLogic } from './TodoLogic.js';
export function TodoFrameCustom(el) { export function TodoFrameCustom(el) {
let todoData = TodoLogic.initTodoData(); let todoData = TodoLogic.initTodoData();
el.innerHTML = ` el.innerHTML = /* html */ `
<div class="leftcontrols"> <div class="leftcontrols">
<p><button class="app-button -circle -xl back"><i class="app-icon" data-id="chevron-left-24"></i></button></p> <p><button class="app-button -circle -xl back"><i class="app-icon" data-id="chevron-left-24"></i></button></p>
</div> </div>

View File

@@ -10,7 +10,7 @@ export function TodoFrameDays(el) {
const RANGE = 14; const RANGE = 14;
let todoData = TodoLogic.initTodoData(); let todoData = TodoLogic.initTodoData();
el.innerHTML = ` el.innerHTML = /* html */ `
<nav class="leftcontrols"> <nav class="leftcontrols">
<p> <p>
<button class="app-button -circle -xl backward"> <button class="app-button -circle -xl backward">

View File

@@ -10,7 +10,7 @@ export function TodoItem(el) {
let startEditing = false; let startEditing = false;
let saveOnBlur = true; let saveOnBlur = true;
el.innerHTML = ` el.innerHTML = /* html */ `
<div class="checkbox"> <div class="checkbox">
<input type="checkbox"> <input type="checkbox">
</div> </div>

View File

@@ -6,7 +6,7 @@ import { AppIcon } from './AppIcon.js';
export function TodoItemInput(el) { export function TodoItemInput(el) {
let saveOnBlur = true; let saveOnBlur = true;
el.innerHTML = ` el.innerHTML = /* html */ `
<input type="text" class="input use-focus-other"> <input type="text" class="input use-focus-other">
<button class="app-button save"><i class="app-icon" data-id="plus-24"></i></button> <button class="app-button save"><i class="app-icon" data-id="plus-24"></i></button>
`; `;

View File

@@ -8,7 +8,7 @@ import { TodoItemInput } from './TodoItemInput.js';
export function TodoList(el) { export function TodoList(el) {
let items = []; let items = [];
el.innerHTML = ` el.innerHTML = /* html */ `
<div class="items"></div> <div class="items"></div>
<div class="todo-item-input"></div> <div class="todo-item-input"></div>
`; `;