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:
@@ -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>
|
||||||
|
@@ -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>
|
||||||
|
@@ -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">
|
||||||
|
@@ -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>
|
||||||
|
@@ -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>
|
||||||
|
@@ -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">
|
||||||
|
@@ -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>
|
||||||
|
@@ -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>
|
||||||
`;
|
`;
|
||||||
|
@@ -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>
|
||||||
`;
|
`;
|
||||||
|
Reference in New Issue
Block a user