From cb4b2adf4dab37dc0953e0ce2a4dae1ea793837e Mon Sep 17 00:00:00 2001 From: Torsten Grote <t@grobox.de> Date: Tue, 3 Dec 2019 12:45:27 -0300 Subject: [PATCH] Make manual translatable This adds a list of translation above the ToC and adds a config for Transifex. --- .tx/config | 10 + config.toml | 11 +- content/_index.md | 178 +++++++++--------- i18n/de.yaml | 4 + i18n/en.yaml | 5 + .../briar-manual/layouts/partials/head.html | 6 +- .../briar-manual/layouts/partials/header.html | 11 ++ .../shortcodes/break-do-not-translate.html | 1 + 8 files changed, 131 insertions(+), 95 deletions(-) create mode 100644 .tx/config create mode 100644 i18n/de.yaml create mode 100644 i18n/en.yaml create mode 100644 themes/briar-manual/layouts/shortcodes/break-do-not-translate.html diff --git a/.tx/config b/.tx/config new file mode 100644 index 0000000..3553c82 --- /dev/null +++ b/.tx/config @@ -0,0 +1,10 @@ +[main] +host = https://www.transifex.com + +[briar.manual] +source_file = content/_index.md +file_filter = content/_index.<lang>.md +type = GITHUBMARKDOWN +mode = developer +source_lang = en +minimum_perc = 100 \ No newline at end of file diff --git a/config.toml b/config.toml index f614126..b3db6b6 100644 --- a/config.toml +++ b/config.toml @@ -1,4 +1,9 @@ baseURL = "https://briarproject.org/manual" -languageCode = "en-us" -title = "Briar User Manual" -theme = "briar-manual" \ No newline at end of file +languageCode = "en" +DefaultContentLanguage = "en" +canonifyURLs = "true" +theme = "briar-manual" + +[languages] + [languages.en] + languageName = "English" diff --git a/content/_index.md b/content/_index.md index 507b0be..8697139 100644 --- a/content/_index.md +++ b/content/_index.md @@ -12,11 +12,11 @@ Briar is [available on Google Play](https://play.google.com/store/apps/details?i > **Tip:** If you're not sure whether you have an Android device, check whether it has the Play Store app. If it does, it runs Android. -If you have an Android device but you prefer not to use Google Play, the Briar website has instructions for installing the app via <a href="https://briarproject.org/fdroid.html">F-Droid</a> or <a href="https://briarproject.org/apk.html">direct download</a>. +If you have an Android device but you prefer not to use Google Play, the Briar website has instructions for installing the app via [F-Droid](https://briarproject.org/fdroid.html) or [direct download](https://briarproject.org/apk.html). # Creating an Account -<img src="img/create-account.png" alt="Creating an account"> + The first time you open Briar you'll be asked to create an account. You can choose any nickname and password. The password should be at least 8 characters long and hard to guess. @@ -24,21 +24,21 @@ The first time you open Briar you'll be asked to create an account. You can choo Tap "Create Account". When your account has been created you'll be taken to the contact list. -<div style="clear:both"></div> +{{< break-do-not-translate >}} # Adding Contacts -<img src="img/add-contact-options-cropped.png" alt="Options for adding a contact"> + To add a contact, tap the plus icon at the bottom right of the contact list. Choose one of the two options that appear. -<div style="clear:both"></div> +{{< break-do-not-translate >}} ## Add contact at a distance -<img src="img/add-contact-remotely.png" alt="Adding a contact at a distance"> + Copy the <code>briar://</code> link and send it to the person you want to add. You can also use the "Share" button to choose an app for sending the link. @@ -55,39 +55,39 @@ Congratulations! You're ready to communicate securely. If Briar can't connect to your contact after 48 hours, the pending contact list will show the message "Adding contact has failed". Both of you should delete the pending contact from the list and add each other's links again. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/add-contact-pending-cropped.png" alt="Pending Contacts"> + -<div style="clear:both"></div> +{{< break-do-not-translate >}} ## Add contact nearby -<img src="img/add-contact-1.png" alt="Adding a contact, step 1"> + Another way to add a contact is to meet up with the person you want to add. Each of you will scan a QR code from the other person's screen. This ensures you're connecting to the right person, so nobody else can impersonate you or read your messages. Tap "Continue" when you're ready to start. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/add-contact-2.png" alt="Adding a contact, step 2"> + Line up your contact's QR code in the viewfinder. You may have to wait a few seconds for the camera to focus. When the camera has scanned the QR code you'll see the message "Waiting for contact to scan and connect". Now your contact should scan your QR code. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/contact-list-with-contact-cropped.png" alt="The contact list showing a newly added contact"> + Your devices will exchange information, and after a few seconds you'll be added to each other's contact lists. Congratulations! You're ready to communicate securely. -<div style="clear:both"></div> +{{< break-do-not-translate >}} # Messaging ## -<img src="img/manual_messaging-cropped.png" alt="A private messaging conversation"> + To send a private message, tap a contact's name in the contact list. @@ -95,169 +95,169 @@ To send a private message, tap a contact's name in the contact list. If your contact is offline, your message will be delivered next time you're both online. -<div style="clear:both"></div> +{{< break-do-not-translate >}} # Introducing Contacts ## -<img src="img/introduction-1-cropped.png" alt="Starting an introduction"> + You can introduce your contacts to each other through Briar. This allows them to become contacts without having to meet up. To start an introduction, tap a contact's name in the contact list and choose "Make Introduction" from the menu. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/introduction-2-cropped.png" alt="Choosing the second contact"> + Next, choose the other contact you want to introduce. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/introduction-3-cropped.png" alt="Adding a message to both contacts"> + Add an optional message to the contacts, then tap "Make Introduction". -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/introduction-5-cropped.png" alt="An introduction request"> + Your contacts will see a message asking them whether they accept the introduction. If they both accept they'll be added to each other's contact lists and they'll be able to communicate securely. -<div style="clear:both"></div> +{{< break-do-not-translate >}} # Private Groups ## -<img src="img/nav-drawer-private-groups.png" alt="The main menu showing the private groups feature selected"> + You can use Briar for group chats with your contacts. To create a group, open the main menu and choose "Private Groups". The private group list will open. Tap the plus icon to create a new group. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/create-private-group-1-cropped.png" alt="Creating a private group, step 1"> + Choose a name for your group, then tap "Create Group". -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/create-private-group-2-cropped.png" alt="Creating a private group, step 2"> + Next choose the contacts you'd like to invite to join the group. Press the checkmark icon when you're done. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/create-private-group-3-cropped.png" alt="Creating a private group, step 3"> + Add an optional message to the chosen contacts, then tap "Send Invitation". The contacts will see a message inviting them to join. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/create-private-group-4-cropped.png" alt="The private group list showing a newly created group"> + The new group will be added to your private group list. This list shows all the groups you belong to. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/private-group-2.png" alt="A conversation in a private group"> + Messages in private groups are organized into threads. Any member can reply to a message or start a new thread. The creator of the group is the only one who can invite new members. Any member can leave the group. If the creator leaves, the group is dissolved. -<div style="clear:both"></div> +{{< break-do-not-translate >}} # Forums -<img src="img/nav-drawer-forums.png" alt="The main menu showing the forums feature selected"> + A forum is a public conversation. Unlike a private group, anyone who joins a forum can invite their own contacts. To create a forum, open the main menu and choose "Forums". The forum list will open. Tap the plus icon to create a new forum. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/create-forum-1-cropped.png" alt="Creating a forum"> + Choose a name for your forum, then tap "Create Forum". -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/create-forum-2-cropped.png" alt="The forum list showing a newly created forum"> + The new forum will be added to your forum list. This list shows all the forums you belong to. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/share-forum-1-cropped.png" alt="Sharing a forum, step 1"> + To share a forum with your contacts, tap the forum to open it, then tap the sharing icon. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/share-forum-2-cropped.png" alt="Sharing a forum, step 2"> + Next choose the contacts you'd like to share the forum with. Press the checkmark icon when you're done. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/share-forum-3-cropped.png" alt="Sharing a forum, step 3"> + Add an optional message to the chosen contacts, then tap "Share Forum". The contacts will see a message inviting them to join. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/forum-1.png" alt="A conversation in a forum"> + Messages in forums are organized into threads. Any member can reply to a message or start a new thread. Any member of a forum can invite new members, and any member including the creator can leave the forum. The forum continues to exist until the last member leaves. -<div style="clear:both"></div> +{{< break-do-not-translate >}} # Blogs -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/nav-drawer-blogs.png" alt="The main menu showing the blogs feature selected"> + Your Briar account has a built-in blog. You can use it to post news and updates about your life. Your blog is automatically shared with your contacts, and their blogs are shared with you. To read your contacts' blogs or write a post, open the main menu and choose "Blogs". -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/write-blog-post-1-cropped.png" alt="Writing a blog post, step 1"> + To write a post, tap the pen icon at the top of the blog feed. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/write-blog-post-2-cropped.png" alt="Writing a blog post, step 2"> + Write your post and tap "Publish". -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/write-blog-post-3-cropped.png" alt="The blog feed showing a newly created post"> + Your new post will appear in the blog feed. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/reblog-1-cropped.png" alt="Reblogging a post, step 1"> + To reblog a post, tap the reblog icon at the corner of the post. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/reblog-2-cropped.png" alt="Reblogging a post, step 2"> + Add an optional comment and tap "Reblog". -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/reblog-3-cropped.png" alt="Reblogging a post, step 3"> + The reblogged post will appear in the blog feed with your comment attached. -<div style="clear:both"></div> +{{< break-do-not-translate >}} # RSS Feeds @@ -265,60 +265,60 @@ You can use Briar to read any blog or news site that publishes an RSS feed. The > **Tip:** RSS is a way for websites to publish articles in a form that's easy to republish. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/import-rss-feed-1-cropped.png" alt="Importing an RSS feed, step 1"> + To import an RSS feed, open the blog feed and choose "Import RSS Feed" from the menu. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/import-rss-feed-2-cropped.png" alt="Importing an RSS feed, step 2"> + Enter the URL of the RSS feed and tap "Import". The articles will be downloaded and added to the blog feed. This can take a few minutes. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/import-rss-feed-3-cropped.png" alt="The blog feed showing a newly imported RSS article"> + When new articles are published, Briar will download them automatically. Imported articles are not shared with your contacts unless you choose to reblog them. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/manage-rss-feeds-1-cropped.png" alt="Managing RSS feeds, step 1"> + To manage your RSS feeds, open the blog feed and choose "Manage RSS Feeds" from the menu. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/manage-rss-feeds-2-cropped.png" alt="Managing RSS feeds, step 2"> + Tap the trash icon to remove a feed. The imported articles will be removed from the blog feed, except for any articles you've reblogged. -<div style="clear:both"></div> +{{< break-do-not-translate >}} # Deleting Contacts # -<img src="img/delete-contact-cropped.png" alt="Deleting a contact"> + To delete a contact, tap the contact's name in the contact list and choose "Delete contact" from the menu. > **Tip:** To protect your privacy, the contact won't be notified that you've deleted them. They'll just see you as offline from now on. -<div style="clear:both"></div> +{{< break-do-not-translate >}} # Settings -<img src="img/manual_dark_theme_settings-cropped.png" alt="The list of settings"> + To find the settings, open the main menu and choose "Settings". Here you can customize your Briar experience. -<div style="clear:both"></div> +{{< break-do-not-translate >}} ## Theme -<img src="img/manual_dark_theme_nav_drawer-cropped.png" alt="The main menu in a dark theme"> + You can change the color scheme that Briar uses: @@ -327,11 +327,11 @@ You can change the color scheme that Briar uses: * **Automatic:** Briar will change its color scheme based on the time of day. * **System default:** Briar will use the system's color scheme. -<div style="clear:both"></div> +{{< break-do-not-translate >}} ## Connect via Internet (Tor) -<img src="img/manual_tor_settings-cropped.png" alt="The 'Networks' section of the settings screen"> + > **Tip:** Briar uses Tor to connect to the internet. Tor is a network of computers run by volunteers around the world to help people access the internet privately and without censorship. "Bridges" are computers that can help you connect to Tor if your government or internet provider is blocking it. @@ -352,7 +352,7 @@ You can control whether Briar uses the internet while your device is running on ## Screen Lock -<img src="img/manual_app_lock-cropped.png" alt="The 'Security' section of the settings screen"> + > **Tip:** This feature is not available on Android version 4. @@ -360,17 +360,17 @@ To protect your privacy when other people are using your device, you can lock Br Briar uses the same PIN, pattern or password that you normally use to unlock your device, so this setting will be disabled (grayed out) if you haven't chosen a PIN, pattern or password yet. You can use your device's Settings app to choose one. -<img src="img/manual_app_lock_nav_drawer-cropped.png" alt="The main menu showing the 'Lock App' option"> + When the screen lock setting is activated, a "Lock App" option will be added to Briar's main menu. You can use this option to lock Briar without signing out. -<div style="clear:both"></div> +{{< break-do-not-translate >}} -<img src="img/manual_app_lock_keyguard.png" alt="Unlocking Briar"> + When Briar is locked, you'll be asked for your PIN, pattern or password to unlock it. -<div style="clear:both"></div> +{{< break-do-not-translate >}} ## Screen Lock Inactivity Timeout diff --git a/i18n/de.yaml b/i18n/de.yaml new file mode 100644 index 0000000..6c91a4e --- /dev/null +++ b/i18n/de.yaml @@ -0,0 +1,4 @@ +translations: + other: "Übersetzungen" +toc: + other: "Inhaltsverzeichnis" \ No newline at end of file diff --git a/i18n/en.yaml b/i18n/en.yaml new file mode 100644 index 0000000..fe1fa89 --- /dev/null +++ b/i18n/en.yaml @@ -0,0 +1,5 @@ +# Transifex support depends on https://github.com/gohugoio/hugo/issues/5242 +translations: + other: "Translations" +toc: + other: "Table of Contents" \ No newline at end of file diff --git a/themes/briar-manual/layouts/partials/head.html b/themes/briar-manual/layouts/partials/head.html index 88389bc..fc7a7c6 100644 --- a/themes/briar-manual/layouts/partials/head.html +++ b/themes/briar-manual/layouts/partials/head.html @@ -2,7 +2,7 @@ <title>{{ block "title" . }}{{ with .Params.Title }}{{ . }} | {{ end }}{{ .Site.Title }}{{ end }}</title> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> - <link type="text/css" rel="stylesheet" href='{{ "css/style.css" }}'/> - <link type="text/css" rel="stylesheet" href='{{ "css/pilcrow.css" }}'/> - <link type="text/css" rel="stylesheet" href='{{ "css/hljs-github.min.css" }}'/> + <link type="text/css" rel="stylesheet" href='{{ "/css/style.css" }}'/> + <link type="text/css" rel="stylesheet" href='{{ "/css/pilcrow.css" }}'/> + <link type="text/css" rel="stylesheet" href='{{ "/css/hljs-github.min.css" }}'/> </head> \ No newline at end of file diff --git a/themes/briar-manual/layouts/partials/header.html b/themes/briar-manual/layouts/partials/header.html index deefa75..22b8797 100644 --- a/themes/briar-manual/layouts/partials/header.html +++ b/themes/briar-manual/layouts/partials/header.html @@ -1,5 +1,16 @@ <div id="toc"> <div id="toc-inner"> + {{ if .IsTranslated }} + <h4>{{ i18n "translations" }}</h4> + <ul class="nav-list"> + {{ range .Translations }} + <li> + <a href="{{ .Permalink }}">{{ .Language.LanguageName }}: {{ .Title }}</a> + </li> + {{ end }} + </ul> + {{ end }} + <h4>{{ i18n "toc" }}</h4> {{ .TableOfContents }} </div> </div> diff --git a/themes/briar-manual/layouts/shortcodes/break-do-not-translate.html b/themes/briar-manual/layouts/shortcodes/break-do-not-translate.html new file mode 100644 index 0000000..0bd5783 --- /dev/null +++ b/themes/briar-manual/layouts/shortcodes/break-do-not-translate.html @@ -0,0 +1 @@ +<div style="clear:both"></div> \ No newline at end of file -- GitLab