From 8d6988da1666bf422de05a47ef00f095ed14b9f4 Mon Sep 17 00:00:00 2001
From: Son NK <nguyenkims@hotmail.com>
Date: Sun, 22 Dec 2019 08:26:20 +0000
Subject: [PATCH] add warning message for social login options.

---
 app/auth/templates/auth/login.html    | 80 +++++++++++++++-----------
 app/auth/templates/auth/register.html | 81 ++++++++++++++++-----------
 2 files changed, 95 insertions(+), 66 deletions(-)

diff --git a/app/auth/templates/auth/login.html b/app/auth/templates/auth/login.html
index cfd14b2a..d708a23a 100644
--- a/app/auth/templates/auth/login.html
+++ b/app/auth/templates/auth/login.html
@@ -30,50 +30,53 @@
         </div>
       {% endif %}
 
-      <form class="card" method="post">
-        {{ form.csrf_token }}
-        <div class="card-body p-6">
-          <div class="form-group">
-            <label class="form-label">Email address</label>
-            {{ form.email(class="form-control", type="email") }}
-            {{ render_field_errors(form.email) }}
-          </div>
+      <div class="card">
+        <form method="post">
+          {{ form.csrf_token }}
+          <div class="card-body p-6">
+            <div class="form-group">
+              <label class="form-label">Email address</label>
+              {{ form.email(class="form-control", type="email") }}
+              {{ render_field_errors(form.email) }}
+            </div>
 
-          <div class="form-group">
-            <label class="form-label">
-              Password
-              <a href="{{ url_for('auth.forgot_password') }}" class="float-right small">
-                I forgot my password
-              </a>
-            </label>
-            {{ form.password(class="form-control", type="password") }}
-            {{ render_field_errors(form.password) }}
-          </div>
+            <div class="form-group">
+              <label class="form-label">
+                Password
+                <a href="{{ url_for('auth.forgot_password') }}" class="float-right small">
+                  I forgot my password
+                </a>
+              </label>
+              {{ form.password(class="form-control", type="password") }}
+              {{ render_field_errors(form.password) }}
+            </div>
 
-          <!-- TODO: add remember me
-          <div class="form-group">
-            <label class="custom-control custom-checkbox">
-              <input type="checkbox" class="custom-control-input"/>
-              <span class="custom-control-label">Remember me</span>
-            </label>
-          </div>
-          -->
+            <!-- TODO: add remember me
+            <div class="form-group">
+              <label class="custom-control custom-checkbox">
+                <input type="checkbox" class="custom-control-input"/>
+                <span class="custom-control-label">Remember me</span>
+              </label>
+            </div>
+            -->
 
-          <div class="form-footer">
-            <button type="submit" class="btn btn-primary btn-block">Log in</button>
+            <div class="form-footer">
+              <button type="submit" class="btn btn-primary btn-block">Log in</button>
+            </div>
           </div>
+        </form>
+
+        <div class="text-center text-muted mb-6">
+          Don't have an account yet? <a href="{{ url_for('auth.register') }}">Sign up</a>
         </div>
-      </form>
-
-      <div class="text-center text-muted">
-        Don't have an account yet? <a href="{{ url_for('auth.register') }}">Sign up</a>
       </div>
     </div>
 
     <div class="col-md-6">
       <div class="card">
         <div class="card-body p-6">
-          <div class="card-title text-center">OR</div>
+          <div class="card-title text-center">Or with social login
+          </div>
 
           <a href="{{ url_for('auth.github_login', next=next_url) }}"
              class="btn btn-block btn-social btn-github">
@@ -90,8 +93,19 @@
             <i class="fa fa-facebook"></i> Sign in with Facebook
           </a>
         </div>
+        <div class="text-center p-3" style="font-size: 12px; font-weight: light; margin: auto">
+
+          We don't use the Facebook/Google SDK to avoid their trackers. <br>
+
+          However when using a social login button, please keep in mind that this social network will <b>know</b> that
+          you are using SimpleLogin.
+
+          <span class="badge badge-warning">Warning</span>
+
+        </div>
       </div>
 
+
     </div>
 
 
diff --git a/app/auth/templates/auth/register.html b/app/auth/templates/auth/register.html
index 6e196a6f..924de075 100644
--- a/app/auth/templates/auth/register.html
+++ b/app/auth/templates/auth/register.html
@@ -18,51 +18,55 @@
 
   <div class="row">
     <div class="col-md-6">
-      <form class="card" method="post">
-        {{ form.csrf_token }}
-        <div class="card-body p-6">
-          <div class="form-group">
-            <label class="form-label">How should we call you?</label>
-            {{ form.name(class="form-control") }}
-            {{ render_field_errors(form.name) }}
-          </div>
+      <div class="card">
+        <form method="post">
+          {{ form.csrf_token }}
+          <div class="card-body p-6">
+            <div class="form-group">
+              <label class="form-label">How should we call you?</label>
+              {{ form.name(class="form-control") }}
+              {{ render_field_errors(form.name) }}
+            </div>
 
-          <div class="form-group">
-            <label class="form-label">Email address</label>
-            {{ form.email(class="form-control", type="email") }}
-            {{ render_field_errors(form.email) }}
-          </div>
+            <div class="form-group">
+              <label class="form-label">Email address</label>
+              {{ form.email(class="form-control", type="email") }}
+              {{ render_field_errors(form.email) }}
+            </div>
 
-          <div class="form-group">
-            <label class="form-label">Password</label>
-            {{ form.password(class="form-control", type="password") }}
-            {{ render_field_errors(form.password) }}
-          </div>
+            <div class="form-group">
+              <label class="form-label">Password</label>
+              {{ form.password(class="form-control", type="password") }}
+              {{ render_field_errors(form.password) }}
+            </div>
 
-          <!-- TODO: add terms
-          <div class="form-group">
-            <label class="custom-control custom-checkbox">
-              <input type="checkbox" class="custom-control-input"/>
-              <span class="custom-control-label">Agree the <a href="terms.html">terms and policy</a></span>
-            </label>
-          </div>
-          -->
+            <!-- TODO: add terms
+            <div class="form-group">
+              <label class="custom-control custom-checkbox">
+                <input type="checkbox" class="custom-control-input"/>
+                <span class="custom-control-label">Agree the <a href="terms.html">terms and policy</a></span>
+              </label>
+            </div>
+            -->
 
-          <div class="form-footer">
-            <button type="submit" class="btn btn-primary btn-block">Create your SimpleLogin account</button>
+            <div class="form-footer">
+              <button type="submit" class="btn btn-primary btn-block">Create your SimpleLogin account</button>
+            </div>
           </div>
+        </form>
+
+        <div class="text-center text-muted mb-6">
+          Already have account? <a href="{{ url_for('auth.login') }}">Sign in</a>
         </div>
-      </form>
-
-      <div class="text-center text-muted">
-        Already have account? <a href="{{ url_for('auth.login') }}">Sign in</a>
       </div>
+
+
     </div>
 
     <div class="col-md-6">
       <div class="card">
         <div class="card-body p-6">
-          <div class="card-title text-center">OR</div>
+          <div class="card-title text-center">Or with social login</div>
 
           <a href="{{ url_for('auth.github_login', next=next_url) }}"
              class="btn btn-block btn-social btn-github">
@@ -80,6 +84,17 @@
           </a>
 
         </div>
+        <div class="text-center p-3" style="font-size: 12px; font-weight: light; margin: auto">
+
+          We don't use the Facebook/Google SDK to avoid their trackers. <br>
+
+          However when using a social login button, please keep in mind that this social network will <b>know</b> that
+          you are using SimpleLogin.
+
+          <span class="badge badge-warning">Warning</span>
+
+        </div>
+
       </div>
     </div>
   </div>