[community/master] fix rtl page and card layout. will-fix: https://gitlab.torproject.org/tpo/web/community/-/issues/186 - tor-commits

29 Mar 2021

commit 58f381e789e9611115e3a3113b860b07c156484a
Author: emma peel emma.peel@riseup.net
Date:   Sat Mar 27 07:57:52 2021 +0100
fix rtl page and card layout. will-fix: https://gitlab.torproject.org/tpo/web/community/-/issues/186
---
 templates/homepage.html         | 9 +++++----
 templates/layout.html           | 3 ++-
 templates/two-columns-page.html | 2 +-
 3 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/templates/homepage.html b/templates/homepage.html
index d01c9ff..361ac35 100644
--- a/templates/homepage.html
+++ b/templates/homepage.html
@@ -1,4 +1,5 @@
-<!doctype html>
+<!doctype html>{% set locale = bag('alternatives', this.alt) %}
+<html xmlns="http://www.w3.org/1999/xhtml" lang="{{ this.alt }}" {% if locale.direction == 'text-right' %}dir="rtl"{% endif %}>
 {% include 'meta.html' %}
<title>{{ _("Tor Project") }} | {% block title %}{{ this.title }}{% endblock %}</title>
@@ -8,19 +9,19 @@
   </header>
   <div class="page">
     <div class="container-fluid bg-{{ this.color }}">
-      <div class="row flex-xl-nowrap {{ bag('alternatives', this.alt, 'order') }}">
+            <div class="row flex-xl-nowrap {{ locale.direction }}">
         {% include 'hero.html' %}
       </div>
     </div>
     <div class="container-fluid">
       <div class="row flex-xl-nowrap">
-        <main role="main" class="mx-auto col-12 {{ bag('alternatives', this.alt, 'order') }}">
+        <main role="main" class="mx-auto col-12 {{ locale.direction }}">
           {% include this.html %}
         </main>
       </div>
     </div>
     <div class="container">
-      <div class="row p-5 m-3 border">
+      <div class="row p-5 m-3 border {{ locale.direction }}">
         <p>
           {{ _('The Tor Project is committed to fostering an inclusive environment and community. Tor is a place where people should feel safe to engage, share their point of view, and participate.') }} Read our <a href="https://gitweb.torproject.org/community/policies.git/tree/code_of_conduct.txt" title="Code of Conduct" target="_blank">Code of Conduct</a>, <a href="https://gitweb.torproject.org/community/policies.git/tree/social_contract.txt" title="Social Contract" target="_blank">Social Contract</a>, <a href="https://gitweb.torproject.org/community/policies.git/tree/statement_of_values.txt" title="Statement of Values" target="_blank">Statement of Values</a> and learn about the <a href="https://gitweb.torproject.org/community/policies.git/tree/community_council.txt" title="Tor Commmunity Council" target="_blank">Tor Community Council</a>.
         </p>
diff --git a/templates/layout.html b/templates/layout.html
index 663c51b..e036c02 100644
--- a/templates/layout.html
+++ b/templates/layout.html
@@ -1,4 +1,5 @@
 <!doctype html>
+<html xmlns="http://www.w3.org/1999/xhtml" lang="{{ this.alt }}" {% if bag('alternatives', this.alt, 'direction') == 'text-right' %}dir="rtl"{% endif %}>
 {% include 'meta.html' %}
 <body class="no-gutters">
   <header>
@@ -9,7 +10,7 @@
     {% include 'pagenav.html' %}
     <div class="container-fluid">
       <div class="row flex-xl-nowrap">
-        <main role="main" class="mx-auto col-12 {{ bag('alternatives', this.alt, 'order') }}">
+        <main role="main" class="mx-auto col-12 {{ bag('alternatives', this.alt, 'direction') }}">
           {% include this.html %}
         </main>
       </div>
diff --git a/templates/two-columns-page.html b/templates/two-columns-page.html
index 1b4883a..d71e970 100644
--- a/templates/two-columns-page.html
+++ b/templates/two-columns-page.html
@@ -2,7 +2,7 @@
<div class="row">
   {% include 'sidenav.html' %}
-  <div class="col-sm-12 col-xs-12 col-md-8 col-lg-8 pt-3 mt-5 mr-auto {{ bag('alternatives', this.alt, 'order') }}">
+  <div class="col-sm-12 col-xs-12 col-md-8 col-lg-8 pt-3 mt-5 mr-auto {{ bag('alternatives', this.alt, 'direction') }}">
     <div class="col-10">
       {{ this.body }}
     </div>

    