authme 3.3.1

Levminer · Jun 14, 2022 · 17769df · 17769df
1 parent b099c6f
commit 17769df
Show file tree

Hide file tree

Showing 51 changed files with 905 additions and 1,669 deletions.
diff --git a/.gitignore b/.gitignore
@@ -3,3 +3,4 @@ build
 dist
 build.json
 log.txt
+tests/**.png
diff --git a/.tailwindrc.js b/.tailwindrc.js
@@ -34,6 +34,9 @@ module.exports = {
 			screens: {
 				lg: "1400px",
 				md: "200px",
+				"3xl": "2000px",
+
+				small: { max: "1650px" },
 			},
 
 			stroke: (theme) => ({

diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,6 @@
 ### Authme 3.3.0 (2022. May 10.)
 
+-   [[ff1fcbf](https://github.com/Levminer/authme/commit/ff1fcbf)] Update changelog (2022-05-08)
 -   [[27aa58b](https://github.com/Levminer/authme/commit/27aa58b)] Settings cleanup (2022-05-07)
 -   [[b887d04](https://github.com/Levminer/authme/commit/b887d04)] Don't send analytics in dev mode #209 (2022-05-07)
 -   [[f3a3909](https://github.com/Levminer/authme/commit/f3a3909)] Request from main process #208 (2022-05-07)

diff --git a/README.md b/README.md
@@ -24,26 +24,22 @@
 
 <img src="https://raw.githubusercontent.com/Levminer/authme/dev/screenshots/application.png?raw=true">
 
-## Latest Release
+## Downloads (Release)
 
 -   Latest release version for users that want a stable and polished experience.
 
 [![Latest release](https://img.shields.io/github/package-json/v/levminer/authme/main?label=Release)](https://tooomm.github.io/github-release-stats/?username=Levminer&repository=authme)
-[![Windows Download](https://img.shields.io/badge/Windows-download-brightgreen)](https://api.levminer.com/api/v1/authme/release/windows)
-[![Linux Download](https://img.shields.io/badge/Linux-download-brightgreen)](https://api.levminer.com/api/v1/authme/release/linux)
-[![Mac Download](https://img.shields.io/badge/Mac-download-brightgreen)](https://api.levminer.com/api/v1/authme/release/mac)
+[![Download](https://img.shields.io/badge/Windows,%20Linux,%20macOS-download-brightgreen)](https://authme.levminer.com/#downloads)
 [![Updated](https://img.shields.io/github/last-commit/levminer/authme/main?color=yellowgreen&label=Updated)](https://github.com/Levminer/authme/releases)
 
--   Also available on: [Microsoft Store](https://link.levminer.com/authme-ms-store), [winget](https://winstall.app/apps/Levminer.Authme)
+-   Also available on: [Microsoft Store](https://link.levminer.com/authme-ms-store), [Snapcraft](https://snapcraft.io/authme), [winget](https://winstall.app/apps/Levminer.Authme)
 
-## Latest Alpha
+## Downloads (Alpha)
 
 -   Latest alpha version for users that want to try out new features early.
 
 [![Latest alpha](https://img.shields.io/github/package-json/v/levminer/authme/dev?label=Alpha&color=blue)](https://tooomm.github.io/github-release-stats/?username=Levminer&repository=authme)
-[![Windows Download](https://img.shields.io/badge/Windows-download-brightgreen)](https://api.levminer.com/api/v1/authme/alpha/windows)
-[![Linux Download](https://img.shields.io/badge/Linux-download-brightgreen)](https://api.levminer.com/api/v1/authme/alpha/linux)
-[![Mac Download](https://img.shields.io/badge/Mac-download-brightgreen)](https://api.levminer.com/api/v1/authme/alpha/mac)
+[![Download](https://img.shields.io/badge/Windows,%20Linux,%20macOS-download-brightgreen)](https://authme.levminer.com/#downloads-alpha)
 [![Updated](https://img.shields.io/github/last-commit/levminer/authme/dev?color=yellowgreen&label=Updated)](https://github.com/Levminer/authme/actions/workflows/alpha-artifacts.yml)
 
 ## Translating

diff --git a/app/application/src/css/index.css → app/codes/index.css b/app/application/src/css/index.css → app/codes/index.css
diff --git a/app/application/index.html → app/codes/index.html b/app/application/index.html → app/codes/index.html
@@ -5,11 +5,11 @@
 		<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' 'unsafe-inline'; img-src 'self' data:; style-src 'self' 'unsafe-inline'" />
 		<meta charset="UTF-8" />
 		<!-- js -->
-		<script defer src="./src/js/index.js"></script>
+		<script defer src="./index.js"></script>
 		<!-- css -->
+		<link rel="stylesheet" href="./index.css" />
 		<link rel="stylesheet" href="../.././styles/global.css" />
 		<link rel="stylesheet" href="../../styles/tailwind.css" />
-		<link rel="stylesheet" href="./src/css/index.css" />
 	</head>
 	<body>
 		<!-- build number -->

diff --git a/app/application/src/js/index.js → app/codes/index.js b/app/application/src/js/index.js → app/codes/index.js
@@ -211,23 +211,24 @@ const generateCodeElements = (data) => {
 
 			if (codes_description === false) {
 				element.innerHTML = `					
-					<div id="codes${i}" class="lg:w-2/3 md:w-11/12 bg-gray-800 mt-10 mb-10 rounded-2xl mx-auto flex flex-col">
-					<div class="flex flex-row justify-center items-center">
-						<div class="flex flex-col flex-1 justify-center items-center">
-							<h3 class="mt-4">${lang.text.name}</h3>
-							<h2 id="name${i}" tabindex="0" class="text-2xl font-normal mt-3">${lang.text.name}</h2>
+					<div id="codes${i}" class="lg:w-2/3 md:w-11/12 3xl:w-2/4 bg-gray-800 mt-10 mb-10 rounded-2xl mx-auto flex flex-col">
+					<div class="flex flex-row py-6 justify-center items-center px-10">
+						<div class="flex flex-1 justify-start">
+							<h3 id="name${i}" tabindex="0" class="text-3xl font-normal mt-3">${lang.text.name}</h3>
 						</div>
-						<div class="flex flex-col flex-1 justify-center items-center">
-							<h3 class="relative -top-1 mt-4">${lang.text.code}</h3>
-							<p id="code${i}" tabindex="0" class="input w-[126px] text-xl relative -top-[6px] select-all" id="code${i}">${lang.text.code}</p>
+						<div class="flex flex-1 justify-center">
+							<p id="code${i}" tabindex="0" class="bg-gray-600 px-5 py-3 rounded-2xl text-2xl relative -top-[6px] select-all" id="code${i}">${lang.text.code}</p>
 						</div>
-						<div class="flex flex-col flex-1 justify-center items-center">
-							<h3 class="mt-4">${lang.text.time}</h3>
-							<h2 id="time${i}" class="text-center text-2xl font-normal mt-3">${lang.text.time}</h2>
+						<div class="flex flex-1 justify-end">
+							<h3 id="time${i}" tabindex="0" class="text-3xl font-normal mt-3">${lang.text.time}</h3>
 						</div>
 					</div>
-					<div class="flex flex-col justify-center items-center">
-						<button onclick="copyCode(${i})" id="copy${i}" class="buttoni w-[194px] relative top-1 mb-8">
+					<div class="flex flex-col justify-center items-center -mt-5">
+						<div class="progress">
+						<div id="progress${i}" class="progressFill"></div>
+					</div>
+					<div class="flex flex-col justify-center items-center pt-6">
+						<button onclick="copyCode(${i})" id="copy${i}" class="buttoni w-[180px] mb-7">
 							<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
 								<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" />
 							</svg>
@@ -238,32 +239,33 @@ const generateCodeElements = (data) => {
 					`
 			} else {
 				element.innerHTML = `					
-					<div id="codes${i}" class="lg:w-2/3 md:w-11/12 bg-gray-800 mt-10 mb-10 pb-4 rounded-2xl mx-auto flex flex-col h-[310px]">
-					<div class="flex flex-row justify-center items-center">
-						<div class="flex flex-col flex-1 justify-center items-center">
-							<h3 class="mt-4">${lang.text.name}</h3>
-							<h2 id="name${i}" tabindex="0" class="text-2xl font-normal mt-3">${lang.text.name}</h2>
+					<div id="codes${i}" class="lg:w-2/3 md:w-11/12 3xl:w-2/4 bg-gray-800 mt-10 mb-10 rounded-2xl mx-auto flex flex-col">
+					<div class="flex flex-row py-6 justify-center items-center px-10">
+						<div class="flex flex-1 justify-start">
+							<h3 id="name${i}" tabindex="0" class="text-3xl font-normal mt-3">${lang.text.name}</h3>
 						</div>
-						<div class="flex flex-col flex-1 justify-center items-center">
-							<h3 class="relative -top-1 mt-4">${lang.text.code}</h3>
-							<p id="code${i}" tabindex="0" class="input w-[126px] text-xl relative -top-[6px] select-all" id="code${i}">${lang.text.code}</p>
+						<div class="flex flex-1 justify-center">
+							<p id="code${i}" tabindex="0" class="bg-gray-600 px-5 py-3 rounded-2xl text-2xl relative -top-[6px] select-all" id="code${i}">${lang.text.code}</p>
 						</div>
-						<div class="flex flex-col flex-1 justify-center items-center">
-							<h3 class="mt-4">${lang.text.time}</h3>
-							<h2 id="time${i}" class="text-center text-2xl font-normal mt-3">${lang.text.time}</h2>
+						<div class="flex flex-1 justify-end">
+							<h3 id="time${i}" tabindex="0" class="text-3xl font-normal mt-3">${lang.text.time}</h3>
 						</div>
 					</div>
-					<div class="flex flex-col justify-center items-center">
-						<p tabindex="0" class="text-2xl bg-gray-700 px-3 py-1.5 rounded-2xl select-all mb-[10px] mt-1" id="description${i}">Description</p>
-						<button onclick="copyCode(${i})" id="copy${i}" class="buttoni w-[194px] relative top-1">
+					<div class="flex flex-col justify-center items-center -mt-5">
+						<div class="progress">
+						<div id="progress${i}" class="progressFill"></div>
+					</div>
+					<p tabindex="0" class="text-2xl bg-gray-600 px-5 py-3 rounded-2xl select-all mt-6" id="description${i}">Description</p>
+					<div class="flex flex-col justify-center items-center pt-6">
+						<button onclick="copyCode(${i})" id="copy${i}" class="buttoni w-[170px] mb-7">
 							<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
 								<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" />
 							</svg>
 							${lang.button.copy}
 						</button>
 					</div>
 					</div>
-					`
+				`
 			}
 
 			// set div in html
@@ -284,6 +286,7 @@ const generateCodeElements = (data) => {
 			const code = document.querySelector(`#code${i}`)
 			const time = document.querySelector(`#time${i}`)
 			const description = document.querySelector(`#description${i}`)
+			const progress = document.querySelector(`#progress${i}`)
 
 			// add to query
 			query.push(`${issuers[i].toLowerCase().trim()} ${names[i].toLowerCase().trim()}`)
@@ -304,6 +307,10 @@ const generateCodeElements = (data) => {
 			// remaining time
 			const remaining_time = 30 - Math.floor((new Date(Date.now()).getTime() / 1000.0) % 30)
 
+			// progress bar
+			const value = remaining_time * (100 / 30)
+			progress.style.width = `${value}%`
+
 			// set content
 			name.textContent = issuers[i]
 			code.textContent = token
@@ -346,6 +353,7 @@ const refreshCodes = (secrets) => {
 	for (let i = 0; i < secrets.length; i++) {
 		const code = document.querySelector(`#code${i}`)
 		const time = document.querySelector(`#time${i}`)
+		const progress = document.querySelector(`#progress${i}`)
 
 		// generate token
 		const token = speakeasy.totp({
@@ -356,6 +364,10 @@ const refreshCodes = (secrets) => {
 		// generate time
 		const remaining = 30 - Math.floor((new Date(Date.now()).getTime() / 1000.0) % 30)
 
+		// progress bar
+		const value = remaining * (100 / 30)
+		progress.style.width = `${value}%`
+
 		// set content
 		code.textContent = token
 		time.textContent = remaining.toString()

diff --git a/app/edit/index.html b/app/edit/index.html
@@ -5,7 +5,7 @@
 		<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline'" />
 		<meta charset="UTF-8" />
 		<!-- js -->
-		<script defer src="./src/js/index.js"></script>
+		<script defer src="./index.js"></script>
 		<!-- css -->
 		<link rel="stylesheet" href="../.././styles/global.css" />
 		<link rel="stylesheet" href="../../styles/tailwind.css" />

diff --git a/app/edit/src/js/index.js → app/edit/index.js b/app/edit/src/js/index.js → app/edit/index.js
diff --git a/app/export/index.html b/app/export/index.html
@@ -5,7 +5,7 @@
 		<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline'" />
 		<meta charset="UTF-8" />
 		<!-- js -->
-		<script defer src="./src/js/index.js"></script>
+		<script defer src="./index.js"></script>
 		<!-- css -->
 		<link rel="stylesheet" href="../.././styles/global.css" />
 		<link rel="stylesheet" href="../../styles/tailwind.css" />
@@ -48,31 +48,36 @@ <h4 data-loc>Your saved codes can be exported here. Ideal if you want to use you
 			</div>
 			<!-- after export -->
 			<div class="after_export hidden">
-				<div class="mx-auto mt-20 mb-20 w-2/3 rounded-2xl bg-gray-800">
+				<div class="mx-auto mt-20 mb-20 rounded-2xl bg-gray-800 md:w-11/12 xl:w-2/3">
 					<h3 data-loc class="pt-5">Save exported codes</h3>
 					<h4 data-loc>You can save your exported 2FA codes, so you can use them elsewhere, and keeping a backup of your codes is always a good idea.</h4>
-					<div class="flex flex-row flex-wrap justify-center gap-3">
-						<div>
-							<button class="buttoni" id="but1" onclick="saveFile()">
+
+					<div class="small:flex-wrap flex flex-row justify-center pb-3">
+						<div class="my-3 ml-3 mr-1.5 flex w-1/2 flex-wrap items-center justify-center rounded-2xl bg-gray-700 p-4">
+							<h4 data-loc class="m-0 mb-3">Export .authme file</h4>
+							<h5 data-loc class="m-0 mb-3">Ideal to import for Authme or other Authme apps.</h5>
+
+							<button class="buttoni my-2" onclick="saveFile()">
 								<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
 									<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
 									<path d="M14 3v4a1 1 0 0 0 1 1h4"></path>
 									<path d="M11.5 21h-4.5a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v5m-5 6h7m-3 -3l3 3l-3 3"></path>
 								</svg>
-								<span data-loc>Export .authme file</span>
+								<span>Export</span>
 							</button>
-							<h5 data-loc class="m-3">Ideal to import for Authme or other Authme apps.</h5>
 						</div>
-						<div>
-							<button class="buttoni" id="but2" onclick="saveQrCodes()">
+						<div class="my-3 mr-3 ml-1.5 flex w-1/2 flex-wrap items-center justify-center rounded-2xl bg-gray-700 p-4">
+							<h4 data-loc class="m-0 mb-3">Export .html file</h4>
+							<h5 data-loc class="m-0 mb-3">Ideal for scanning the QR codes or for security backup.</h5>
+
+							<button onclick="saveQrCodes()" class="buttoni my-2">
 								<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
 									<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
 									<path d="M14 3v4a1 1 0 0 0 1 1h4"></path>
 									<path d="M11.5 21h-4.5a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v5m-5 6h7m-3 -3l3 3l-3 3"></path>
 								</svg>
-								<span data-loc>Export .html file</span>
+								<span>Export</span>
 							</button>
-							<h5 data-loc class="m-3 mb-8">Ideal for scanning the QR codes or for security backup.</h5>
 						</div>
 					</div>
 				</div>

diff --git a/app/export/src/js/index.js → app/export/index.js b/app/export/src/js/index.js → app/export/index.js
diff --git a/app/import/src/js/images.js → app/import/functions/images.js b/app/import/src/js/images.js → app/import/functions/images.js
diff --git a/app/import/src/js/manual.js → app/import/functions/manual.js b/app/import/src/js/manual.js → app/import/functions/manual.js
diff --git a/app/import/src/js/screen.js → app/import/functions/screen.js b/app/import/src/js/screen.js → app/import/functions/screen.js
diff --git a/app/import/src/js/webcam.js → app/import/functions/webcam.js b/app/import/src/js/webcam.js → app/import/functions/webcam.js
diff --git a/app/import/index.html b/app/import/index.html
@@ -46,7 +46,7 @@ <h4 data-loc>List of the currently supported QR codes. You can import from more
 					<span data-loc>Examples</span>
 				</button>
 
-				<div class="flex flex-row justify-center pb-5">
+				<div class="small:flex-wrap flex flex-row justify-center pb-5">
 					<div class="my-3 ml-3 mr-1.5 flex w-1/2 flex-wrap items-center justify-center rounded-2xl bg-gray-700 p-4">
 						<h4 data-loc class="m-0 mb-3">TOTP 2FA QR code</h4>
 						<h5 data-loc class="m-0">A TOTP QR code is that you find mostly everywhere, if you want to setup 2FA.</h5>
@@ -191,7 +191,7 @@ <h5 data-loc class="m-0 pt-4">Use your webcam to scan a 2FA QR code.</h5>
 
 		<!-- manual entry dialog -->
 		<dialog class="dialog dialog0 w-2/5">
-			<h2>Manual entry</h2>
+			<h2 class="-mt-5">Manual entry</h2>
 			<h4>Please enter the 2FA secret and name!</h4>
 
 			<div class="mt-10 flex flex-col items-center justify-center">

diff --git a/app/import/index.js b/app/import/index.js
@@ -5,10 +5,10 @@ const QrcodeDecoder = require("qrcode-decoder").default
 const { ipcRenderer: ipc } = require("electron")
 const path = require("path")
 const fs = require("fs")
-const { chooseImages } = require("./src/js/images")
-const { manualEntry } = require("./src/js/manual")
-const { captureFromScreen } = require("./src/js/screen")
-const { useWebcam } = require("./src/js/webcam")
+const { chooseImages } = require("./functions/images")
+const { manualEntry } = require("./functions/manual")
+const { captureFromScreen } = require("./functions/screen")
+const { useWebcam } = require("./functions/webcam")
 
 /**
  * Send error to main process

diff --git a/app/landing/index.html b/app/landing/index.html
@@ -21,19 +21,19 @@ <h5 class="build-content m-0 mx-3 flex flex-row text-center font-bold">You are r
 		</div>
 
 		<!-- content -->
-		<div class="relative m-auto mt-40 mb-60 rounded-2xl bg-gray-700 p-1 text-center md:w-11/12 xl:w-3/5">
-			<h1>Authme</h1>
+		<div class="relative m-auto mt-40 mb-60 w-3/5 rounded-2xl bg-gray-700 p-1 text-center">
+			<h1 class="mb-10">Authme</h1>
 
-			<div class="chooseLogin mx-auto mb-20 rounded-2xl bg-gray-800 md:w-11/12 xl:w-2/3">
+			<div class="chooseLogin mx-auto mb-20 w-2/3 rounded-2xl bg-gray-800">
 				<h3 data-loc class="pt-5">Welcome to Authme!</h3>
 				<h4 data-loc>Choose how you want to use Authme. Your 2FA codes are encrypted either way.</h4>
 
-				<div class="flex flex-row justify-center pb-3">
+				<div class="small:flex-wrap flex flex-row justify-center pb-3">
 					<div class="my-3 ml-3 mr-1.5 flex w-1/2 flex-wrap items-center justify-center rounded-2xl bg-gray-700 p-4">
 						<h4 data-loc class="m-0 mb-3">Require password</h4>
 						<h5 data-loc class="m-0 mb-3">You have to type in your password every time you launch Authme.</h5>
 
-						<button class="buttoni my-2" onclick="requirePassword()">
+						<button class="buttoni requirePassword my-2" onclick="requirePassword()">
 							<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
 								<path stroke-linecap="round" stroke-linejoin="round" d="M13 9l3 3m0 0l-3 3m3-3H8m13 0a9 9 0 11-18 0 9 9 0 0118 0z" />
 							</svg>
@@ -89,7 +89,7 @@ <h4 data-loc id="text">Create a strong password to encrypt your 2FA codes!</h4>
 						</svg>
 					</div>
 				</div>
-				<button class="buttoni mb-8" onclick="comparePasswords()">
+				<button class="buttoni comparePasswords mb-8" onclick="comparePasswords()">
 					<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
 						<path stroke-linecap="round" stroke-linejoin="round" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
 					</svg>

diff --git a/app/settings/src/css/index.css → app/settings/index.css b/app/settings/src/css/index.css → app/settings/index.css
diff --git a/app/settings/index.html b/app/settings/index.html
@@ -6,9 +6,9 @@
 		<!-- js -->
 		<script defer src="./index.js"></script>
 		<!-- css -->
+		<link rel="stylesheet" href="./index.css" />
 		<link rel="stylesheet" href="../.././styles/global.css" />
 		<link rel="stylesheet" href="../../styles/tailwind.css" />
-		<link rel="stylesheet" href="./src/css/index.css" />
 	</head>
 	<body>
 		<div class="flex h-screen">
@@ -214,12 +214,6 @@ <h4 data-loc>You can view the logs for debugging. You can view all the logs in t
 									</svg>
 									<span data-loc>Latest log</span>
 								</button>
-								<button class="buttoni" onclick="logsFolder()">
-									<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-										<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 19a2 2 0 01-2-2V7a2 2 0 012-2h4l2 2h4a2 2 0 012 2v1M5 19h14a2 2 0 002-2v-5a2 2 0 00-2-2H9a2 2 0 00-2 2v5a2 2 0 01-2 2z" />
-									</svg>
-									<span data-loc>Logs folder</span>
-								</button>
 							</div>
 							<hr />
 							<h3 data-loc>Clear data</h3>
@@ -311,12 +305,6 @@ <h4 data-loc>You can use these shortcuts everywhere, even outside the applicatio
 							<div class="globalShortcutsDiv">
 								<!-- global shortcuts -->
 							</div>
-							<hr />
-							<h3 data-loc>Shortcuts</h3>
-							<h4 data-loc>You can use these shortcuts inside the application only. Use english characters only, during editing shortcuts don't work.</h4>
-							<div class="shortcutsDiv">
-								<!-- shortcuts -->
-							</div>
 						</div>
 
 						<!-- experimental -->
-Original file line number
+Diff line change
@@ Expand Up / @@ -3,3 +3,4 @@ build @@
     dist
     build.json
     log.txt
+    tests/**.png