Feature #8798

Split translations of "Tor check" in two lines when needed

Added by Anonymous 2015-01-26 12:49:18 . Updated 2015-06-20 02:09:29 .

Status:
Resolved
Priority:
Normal
Assignee:
Category:
Internationalization
Target version:
Tails_1.4.1
Start date:
2015-01-26
Due date:
% Done:

50%

Feature Branch:
doc/8798-torcheck-css-split
Type of work:
Website
Blueprint:

Starter:
1
Affected tool:
Deliverable for:

Description

As discussed here https://mailman.boum.org/pipermail/tails-l10n/2015-January/001876.html we would need a CSS modification in order to be able to translate “Tor Check” on https://tails.boum.org/news/index.en.html into other languages.

Proposal is to add a class to the button, example “twolines”.

Inherited CSS is then:
`
#tor_check a span {
position: absolute;
right: 0.7em;
bottom: 10px;
font-family: “Century Gothic”,“Avant Garde”,Avenir,TeXGyreAdventorRegular,“Heiti SC”,“Heiti TC”,AppleGothic,sans-serif;
font-weight: normal;
color: #FFF;
text-align: right;
font-size: 2.29em;
line-height: 1.1em;
}`

We should add:

`
#tor_check a span.twolines {
top: 0.3em;
width: 70%;
left: 30%;
text-align: left;
}`

All of that code should be double-checked, simplified as much as possible, and integrated in our current CSS.

Translators could be asked to provide the relevant strings for testing.

Subtasks

History

#1 Updated by BitingBird 2015-01-26 14:54:42

  • Status changed from New to In Progress

#2 Updated by sajolida 2015-01-27 20:16:08

  • Subject changed from CSS modification of "Tor check" button for translations to Split translations of "Tor check" in two lines when needed
  • Starter set to Yes

That should be easy and doesn’t require building the wiki:

  • Downloading a version of News page in French.
  • Downloading a version of News page in French.
  • Add a class to the relevant div in French.
  • Tweak the CSS.

#3 Updated by sajolida 2015-05-12 17:50:20

  • Description updated

#4 Updated by muri 2015-06-05 21:29:14

  • % Done changed from 0 to 50

hi, i’ve written a patch for the css file as suggested. i’ve also made the font smaller in the ‘twolines’ block. i’ve tested it with the string ‘Tor-Verbindung überprüfen’ and that looked oke.
you can find the commit on https://gitlab.com/muri/tails.git, branch doc/8798-torcheck-css-split, commits c635557f [completed the span.twolines block] and f510d3ea [added span.twolines to #tor_check]

#5 Updated by intrigeri 2015-06-06 08:08:25

  • Target version set to Tails_1.4.1
  • QA Check set to Ready for QA

#6 Updated by sajolida 2015-06-06 10:50:31

  • Assignee set to sajolida

#7 Updated by sajolida 2015-06-18 08:48:21

  • Assignee changed from sajolida to muri
  • Feature Branch set to doc/8798-torcheck-css-split

Thanks for working on this! Your patch made me realize that the right alignment of the base CSS doesn’t make sense. So I reused your code to futher simplify the original code in commit:191d3d2. I also added a note for translators in commit:dd00de8. Can you review my branch to see if I didn’t break anything else?

#8 Updated by muri 2015-06-19 08:34:57

  • Assignee changed from muri to sajolida

hi, i’ve reviewed the changes and built the wiki with the german translation ‘Tor-Verbindung überprüfen’ and everything looked fine! (good idea to include the note for the translators…!)

#9 Updated by sajolida 2015-06-20 02:09:29

  • Status changed from In Progress to Resolved
  • Assignee deleted (sajolida)
  • QA Check changed from Ready for QA to Pass

Merged then!