Skip to content

Commit

Permalink
Codes page localization
Browse files Browse the repository at this point in the history
  • Loading branch information
@Levminer
Levminer committed Jan 13, 2024
1 parent 10629cc commit b0e3f0d
Show file tree
Hide file tree
Showing 2 changed files with 24 additions and 19 deletions.
23 changes: 13 additions & 10 deletions interface/windows/codes/codes.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,38 +16,38 @@

<div class="content mx-auto flex flex-col flex-wrap items-center justify-center gap-10 rounded-2xl p-10 sm:w-full">
<div class="importCodes transparent-800 hidden w-full max-w-2xl rounded-2xl p-5">
<h2>Import your codes</h2>
<h3>Import your existing 2FA codes, or choose your Authme import file if you already have one.</h3>
<h2>{language.codes.importCodes}</h2>
<h3>{language.codes.importCodesText}</h3>
<div class="mx-auto mt-6 flex flex-row items-center justify-center gap-3 sm:flex-wrap">
<button class="button" on:click={() => navigate("import")}>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 22h14a2 2 0 0 0 2-2V7.5L14.5 2H6a2 2 0 0 0-2 2v4" /><polyline points="14 2 14 8 20 8" /><path d="M2 15h10" /><path d="m9 18 3-3-3-3" /></svg>
Import codes
{language.codes.importCodesButton}
</button>
<button class="button" on:click={chooseImportFile}>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 22h14a2 2 0 0 0 2-2V7.5L14.5 2H6a2 2 0 0 0-2 2v3" /><polyline points="14 2 14 8 20 8" /><path d="M5 17a3 3 0 1 0 0-6 3 3 0 0 0 0 6z" /><path d="m9 18-1.5-1.5" /></svg>
Choose file
{language.codes.chooseFileButton}
</button>
</div>
</div>

<div class="gettingStarted transparent-800 hidden w-full max-w-2xl rounded-2xl p-5">
<h2>Getting started</h2>
<h3>In the mean time you can check out the settings or visit the GitHub page.</h3>
<h2>{language.codes.gettingStarted}</h2>
<h3>{language.codes.gettingStartedText}</h3>
<div class="mx-auto mt-6 flex flex-row items-center justify-center gap-3 sm:flex-wrap">
<button class="button" on:click={() => navigate("settings")}>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z" /><circle cx="12" cy="12" r="3" /></svg>
Settings
{language.codes.settingsButton}
</button>
<button class="button" on:click={() => open("https://github.com/levminer/authme")}>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4" /><path d="M9 18c-4.51 2-5-2-7-2" /></svg>
GitHub
{language.codes.githubButton}
</button>
</div>
</div>

<div class="noSearchResults transparent-800 hidden w-full max-w-2xl rounded-2xl p-5">
<h2>No search results found.</h2>
<h3>Not found search results for "<span class="searchResult" />".</h3>
<h2>{language.codes.noSearchResultsFound}</h2>
<h3>{language.codes.noSearchResultsFoundText} "<span class="searchResult" />".</h3>
</div>
</div>
</div>
Expand All @@ -57,6 +57,9 @@
import { stopCodesRefresher, search, chooseImportFile, loadCodes } from "./index"
import { navigate, open } from "../../utils/navigate"
import SearchFilter from "../../components/searchFilter.svelte"
import { getLanguage } from "@utils/language"
const language= getLanguage()
onMount(() => {
loadCodes()
Expand Down
20 changes: 11 additions & 9 deletions interface/windows/codes/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,11 @@ import { getSettings, setSettings } from "../../stores/settings"
import { getState, setState } from "../../stores/state"
import { decryptData, encryptData } from "interface/utils/encryption"
import logger from "interface/utils/logger"
import { getLanguage } from "@utils/language"

const settings = getSettings()
const state = getState()
const language = getLanguage()
let codesRefresher: NodeJS.Timeout
let searchQuery: LibSearchQuery[] = []
let saveText: string = ""
Expand All @@ -34,7 +36,7 @@ export const generateCodeElements = (data: LibImportFile) => {
<h3 id="name${i}" tabindex="0" class="whitespace-nowrap mt-3 text-3xl font-normal focusRing rounded-2xl">-</h3>
</div>
<div class="flex flex-1 justify-center px-3">
<p id="code${i}" tabindex="0" class="transparent-900 relative mt-1.5 w-[140px] select-all rounded-2xl py-3 px-5 text-2xl focusRing">-</p>
<p id="code${i}" tabindex="0" class="transparent-900 relative mt-1.5 w-[150px] select-all rounded-2xl py-3 px-5 text-2xl focusRing">-</p>
</div>
<div class="flex flex-1 justify-end">
<h3 id="time${i}" tabindex="0" class="mt-3 text-3xl font-normal focusRing rounded-2xl">-</h3>
Expand All @@ -46,9 +48,9 @@ export const generateCodeElements = (data: LibImportFile) => {
</div>
</div>
<div class="mb-5 mt-5 flex items-center justify-center">
<button id="button${i}" class="button w-[140px] py-3 px-5">
<button id="button${i}" class="button w-[150px] py-3 px-5">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="8" y="2" width="8" height="4" rx="1" ry="1"></rect><path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"></path></svg>
Copy
${language.common.copy}
</button>
</div>`
} else {
Expand All @@ -58,7 +60,7 @@ export const generateCodeElements = (data: LibImportFile) => {
<h3 id="name${i}" tabindex="0" class="whitespace-nowrap mt-3 text-3xl font-normal focusRing rounded-2xl">-</h3>
</div>
<div class="flex flex-1 justify-center px-3">
<p id="code${i}" tabindex="0" class="transparent-900 relative mt-1.5 w-[140px] select-all rounded-2xl py-3 px-5 text-2xl focusRing">-</p>
<p id="code${i}" tabindex="0" class="transparent-900 relative mt-1.5 w-[150px] select-all rounded-2xl py-3 px-5 text-2xl focusRing">-</p>
</div>
<div class="flex flex-1 justify-end">
<h3 id="time${i}" tabindex="0" class="mt-3 text-3xl font-normal focusRing rounded-2xl">-</h3>
Expand All @@ -71,9 +73,9 @@ export const generateCodeElements = (data: LibImportFile) => {
</div>
<p tabindex="0" class="text-2xl transparent-900 py-3 px-5 rounded-2xl select-all mt-5" id="description${i}">Description</p>
<div class="mb-5 mt-5 flex items-center justify-center">
<button id="button${i}" class="button w-[140px] py-3 px-5">
<button id="button${i}" class="button w-[150px] py-3 px-5">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="8" y="2" width="8" height="4" rx="1" ry="1"></rect><path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"></path></svg>
Copy
${language.common.copy}
</button>
</div>`
}
Expand Down Expand Up @@ -129,13 +131,13 @@ export const generateCodeElements = (data: LibImportFile) => {

button.innerHTML = `
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="8" y="2" width="8" height="4" rx="1" ry="1"></rect><path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"></path><path d="m9 14 2 2 4-4"></path></svg>
Copied
${language.common.copied}
`

setTimeout(() => {
button.innerHTML = `
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="8" y="2" width="8" height="4" rx="1" ry="1"></rect><path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"></path></svg>
Copy
${language.common.copy}
`
}, 800)
})
Expand Down Expand Up @@ -262,7 +264,7 @@ export const chooseImportFile = async () => {

saveText = importString

dialog.message("Codes imported. \n\nYou can edit your codes on the edit page.")
dialog.message(language.codes.dialog.codesImported)

state.importData = importString
setState(state)
Expand Down

0 comments on commit b0e3f0d

Please sign in to comment.